【摘要】 web前端如何防范安全攻击考必过小编为大家整理了关于web前端如何防范安全攻击的信息，希望可以帮助到大家！
web前端如何防范安全攻击
标签：就是-obar来源option方法only地址ade
一、对于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 从而实现中间人攻击。
web前端如何防范安全攻击
标签：就是-obar来源option方法only地址ade
以上就是web前端如何防范安全攻击的内容，更多资讯请及时关注考必过网站，最新消息小编会第一时间发布，大家考试加油！