【前端安全】JavaScript防XSS攻击

1.攻击过程
1、攻击者通过评论表单提交将 提交到网站

2、网站后端对提交的评论数据不做任何操作，直接存储到数据库中

3、其他用户访问正常访问网站，并且需要请求网站的评论数据

4、网站后端会从数据库中取出数据，直接返回给用户

5、用户得到页面后，直接运行攻击者提交的代码，所有用户都会在网页中弹出aaa的弹窗

这种攻击方式恶意代码会被存储在数据库中，其他用户在正常访问的情况下，也有会被攻击，影响的范围比较大

2.攻击类型

1、持续型XSS攻击：恶意脚本来源于网站的数据库

1、攻击者通过评论表单提交将提交到网站

2、网站后端对提交的评论数据不做任何操作，直接存储到数据库中

3、其他用户访问正常访问网站，并且需要请求网站的评论数据

4、网站后端会从数据库中取出数据，直接返回给用户

5、用户得到页面后，直接运行攻击者提交的代码，所有用户都会在网页中弹出aaa的弹窗

2、反射型XSS攻击：恶意脚本来源于受害者的请求

3、基于DOM的XSS攻击

3.预防攻击
1、编码，就是转义用户的输入，把用户的输入解读为数据而不是代码
2、校验，对用户的输入及请求都进行过滤检查，如对特殊字符进行过滤，设置输入域的匹配规则等。
对于验证输入，我们既可以在服务端验证，也可以在客户端验证
对于持久性和反射型攻击，服务端的验证是必须的，服务端支付的任何语言都能够做到
而对于基于DOM的XSS攻击，验证输入在客户端必须执行，因为从服务端来说，所有发出的页面内容是正常的，只是在客户端js代码执行的过程中才发生可攻击
但是对于各种攻击，我们最好做到客户端和服务端都进行处理。这里，我们主要讨论的是客户端的验证，至于服务端如何过滤验证，可以查看其它资料
总结
在日常的开发过程中，我们对于用户的输入嵌入到页面中要格外小心，根据嵌入内容的上下文，采取不同的防范策略，提高我们页面的安全性