关于xss攻击解决方案-Toy模板网

这篇具有很好参考价值的文章主要介绍了关于xss攻击解决方案。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

1.介绍：

前端安全系列（一）：如何防止XSS攻击？
关于xss攻击解决方案

2.遇见的问题

情况一：

后端直接返回带有样式的字符串，使用v-html会受到xss的攻击：
原理：Vue中的v-html指令用以更新元素的innerHTML，其内容按普通HTML插入，不会作为Vue模板进行编译,容易受到xss攻击
关于xss攻击解决方案
xss攻击检验的方式：

  text: '<img src=X οnerrοr=alert(111)>'

解决方式：

方法一：

使用xss插件
https://jsxss.com/zh/options.html（npm）根据白名单过滤HTML(防止XSS攻击)
https://blog.csdn.net/lingxiaoxi_ling/article/details/105851736（详细理解版）

方法二：

①、用html转义，将<>转义成转义符，这样标签就编程了文本了（QQ空间的做法）
②、使用jsoup白名单过滤掉onerror关键字，让他不要在前台显示（这种更安全，因为转义还有可能被绕过）

其他尝试记录：

xss函数处理挂载在原型上，可是nuxt的配置上找不到chainWebpack，不生效
处理v-html的潜在XSS风险_lj1530562965的博客-CSDN博客
setAttribute（）方式对Css样式的属性进行操作时，只能获取已经通过JS代码进行设置过的值或者通过HTML元素显示设置了想要的内联样式的值（即在HTML标签中通过属性style进行设置了的属性值）。
后台返回的是带样式的字符串，不适用
子组件渲染–因为需要渲染字符串里面的css，使用要用到.innerHTML 会受到xss攻击

xss检验

总结

1.innerHTML —xss攻击
2.DOMParser().parseFromString（）–性能最差，会受到xss攻击
3.Range.createContextualFragment()–会执行内联的script js代码，这个方法尽量不要使用，不安全
4.insertAdjacentHTML（）–会受到xss攻击
5.createContextualFragment （）–安全性能差，会受到xss攻击

因此，在进行HTML字符串转DOM时候，记得过滤onload和onerror属性，尤其是第3方的HTML字符串，一定要注意安全，防止XSS攻击。文章来源地址https://www.toymoban.com/news/detail-426356.html

到了这里，关于关于xss攻击解决方案的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！