不存在一个提及XSS攻击就都可以应付的通法。需要根据需求思考可能存在的攻击点，做对应的处理。
什么是XSS攻击
XSS大名叫CSS (Cross Site Script) ，跨站脚本攻击。它指的是恶意攻击者往Web页面里插入恶意html代码，当用户浏览该页之时，嵌入其中Web里面的html代码会被执行，从而达到恶意用户的特殊目的。
下面就一个url传参的然后在某个地方展现参数文本的场景讨论
XSS攻击分类
反射型：后端读取参数，参数夹杂在响应中。
存储型：后端读取参数、存储，需要拉取数据时返回给前端。
DOM型：前端读取参数（路由传参），参数插入在DOM结构中。
防御XSS
X-XSS-Protection
一个浏览器用来防御XSS攻击的HTTP头字段。
X-XSS-Protection: 0
X-XSS-Protection: 1
X-XSS-Protection: 1; mode=block
X-XSS-Protection: 1; report=<reporting-uri>
0禁止XSS过滤。
1启用XSS过滤（通常浏览器是默认的）。 如果检测到跨站脚本攻击，浏览器将清除页面（删除不安全的部分）。
1; mode=block用XSS过滤。 如果检测到攻击，浏览器将不会清除页面，而是阻止页面加载。
1; report=<reporting-uri>启用XSS过滤。 如果检测到跨站脚本攻击，浏览器将清除页面并使用CSP report-uri指令的功能发送违规报告。
缺点：只拦截HTML属性和节点，浏览器支持性不好。
过滤
过滤是面对XSS的常规反应，但是要想好过滤什么。
怎么让一个参数内容是代码的时候另一边展示代码？
字符：> --> > < --> < & ---> &
属性：on开头的统统干掉，src href data 要对url做校验（支持http、https或者相对路径，根据应用场景而定），style（因为老版本浏览器支持css expression，用户需要定制样式可以提供一些定制样式的class）
标签：script style link embed（嵌入资源，提防flash脚本） object（浏览器插件）
可不可以不要一刀切？
对于css expression可以做一个CSS过滤器不过会增加成本，而对于移动端H5的项目可以不用管，因为expreion已经废弃。
对于embed object如果不去除还要设置allowScript为none，等配置。
如何让用户输入的html在另外的地方作为html解析？
很少有这样的需求，富文本编辑器也是要点击上方提示样式按钮给特定模板语法的。可以通过白名单过滤解决，但是白名单的方案本身很勉强（受限于任知范围和HTML规范更新的支持）。
对于XSS攻击的处理后端是一定要做的，在前端做会减轻后端的压力。后端也是具备解析HTML能力的（通过自己写的解析器或者开一个浏览器线程），不过对于后端的意义是不同的，作为一个XML节点。
网友评论