web前端如何防范安全攻击
一、对于XSS防御:
1、不要信任任何外部传入的数据,针对用户输入作相关的格式检查、过滤等操作,以及转义字符处理。最普遍的做法就是转义输入输出的内容,对于括号,尖括号,斜杠进行转义
function escape(str) { str = str.replace(/&/g, '&') str = str.replace(/</g, '<') str = str.replace(/>/g, '>') str = str.replace(/"/g, '&quto;') str = str.replace(/'/g, ''') str = str.replace(/`/g, '`') str = str.replace(/\//g, '/') return str } // 通过转义可以将攻击代码 变成 -> <script>alert(1)</script> escape('<script>alert(1)</script>')
但是对于显示富文本来说,显然不能通过上面的办法来转义所有字符,因为这样会把需要的格式也过滤掉。对于这种情况,通常采用白名单过滤的办法,当然也可以通过黑名单过滤,但是考虑到需要过滤的标签和标签属性实在太多,更加推荐使用白名单的方式。
const xss = require('xss') let html = xss('<h1 id="title">XSS Demo</h1><script>alert("xss");</script>') // -> <h1>XSS Demo</h1><script>alert("xss");</script> console.log(html)
示例使用了 js-xss 来实现,可以看到在输出中保留了 h1 标签且过滤了 script 标签。
2、可以使用CSP内容安全策略
二、对于CSRF防御:
1、get请求不对数据进行修改
2、不让第三方网站访问到Cookie,安全地使用 Cookie,设置Cookie为HttpOnly,禁止JavaScript操作Cookie;
3、阻止第三方网站请求接口,不要信任任何传入的第三方数据,使用 CORS,设置 Access-Control-Allow-Origin;
4、请求时附带验证信息,比如验证码或者Token
5、防止网页被其他网站内嵌为iframe,服务器端设置 X-Frame-Options 响应头,防止页面被内嵌。
三、对于点击劫持防御:
1、X-FRAME_OPRIONS
X-FRAME_OPRIONS (X-Frame-Options)这个可以说是为了解决ClickJacking而生的,是一个HTTP响应头,在现代的浏览器中有一个较好的支持,它就是为了防御用iframe嵌套的点击劫持攻击。该响应头有三个值可选,分别是:
(1)DENY 表示页面不允许通过iframe的方式展示,(浏览器会拒绝当前页面加载的任何iframe)
(2)SAMEORIGIN 表示页面可以在相同域名下通过iframe的方式展示,(frame页面的地址只能为同源域名下的页面)
(3)ALLOW-FROM 表示页面可以在指定来源的iframe中展示
// 配置方法 // Apache配置 Header always append X-Frame-Options SAMEORIGIN // nginx配置 add_header X-Frame-Options SAMEORIGIN;
四、对于中间人攻击防御
防御中间人攻击其实并不难,只需要增加一个安全通道来传输信息。HTTPS 就可以用来防御中间人攻击,但是并不是说使用了 HTTPS 就可以高枕无忧了,因为如果你没有完全关闭 HTTP 访问的话,攻击方可以通过某些方式将 HTTPS 降级为 HTTP 从而实现中间人攻击。