前端安全：CSRF、XSS该怎么防御？

近几年随着业务的不断发展，前端随之面临很多安全挑战。我们在日常开发中也需要不断预防和修复安全漏洞。接下来，梳理一些场景的前端安全问题和对应的解决方案。

XSS攻击介绍

XSS是后端的责任，后端应该在用户提交数据的接口对隐私敏感的数据进行转义。

NO，这种说法不对

所有插到页面的数据，都要进行过滤转移，当没有敏感字符的时候，就可以直接插到页面上显示了。

NO，丝毫没有什么作用

XSS攻击是页面被注入了恶意的代码，利用恶意脚本，攻击者可以获取用户的Cookie、SessionID等敏感信息。

XSS注入的方法：

• 在HTML中内嵌的文本中，恶意内容通过script标签注入
• 在内联的JS中，拼接的数据突破了原本的限制
• 在标签属性中，恶意内容包含引导，从而突破属性值的限制
• 在标签href、src等属性中，包含javascript:可执行代码
• 在onload、onerror、onclick事件中，注入不受控制的代码
• 在style属性中，类似background- image: url("javascript:..")代码

如果开发者没有将用户输入的文本进行合适的过滤，直接插入到HTML中，很容易造成注入漏洞。

XSS攻击的分类

存储型XSS

其攻击步骤如下：

1. 攻击者将恶意代码提交到目标网站的数据库
2. 用户打开目标网站，服务端将恶意代码取出，拼在HTML中返回给浏览器
3. 用户浏览器解析执行，混在HTML中的恶意代码也被执行
4. 恶意代码窃取用户数据，冒充用户，执行攻击者制定的操作

常见场景：论坛发帖、商品评论、私信

反射型XSS

其攻击步骤如下：

1. 攻击者构造特殊URL，其中包含恶意代码
2. 用户点击打开该URL，服务端将恶意代码从URL中取出，拼接在HTML中返回给浏览器