XSS 攻击

一、XSS 是什么？

XSS全称跨站脚本攻击（Cross Site Scripting），为了与重叠样式表CSS区分，换了另一个缩写XSS。

XSS攻击的核心是将可执行的前端脚本代码（一般为JavaScript）植入到网页中，听起来比较拗口，用大白话说就是攻击者想让你的浏览器执行他写的JS代码。那如何办到呢？一般XSS分为两种：
外在表现上的攻击场景

• 评论区植入js代码
• url上拼接js代码

如果你觉得这种场景下，用户能输入的代码长度有限，根本构不成什么威胁，其实攻击者是可以通过引入外部脚本实现复杂攻击的

二、从技术上分析有哪些XSS 攻击

反射型

反射型的恶意代码拼接在url上。需要用户主动打开恶意的URL才能生效。

• 攻击者将JS代码作为请求参数放置URL中，诱导用户点击
  • 示例： http://localhost:8080/test?name=
• 用户点击后，该 JS 作为请求参数传给Web服务器后端
• 后端服务器没有检查过滤，简单处理后放入网页正文中返回给浏览器

• 浏览器解析返回的网页，中招

  存储型

  
  存储型的恶意代码通过可输入区域，存储在数据库中，常见于带有用户保存数据的网站功能，攻击者通过可输入区域来注入恶意代码，如论坛发帖、商品评论，用户私信等。
  常见的套路举例：

• 攻击者网页回帖，帖子中包含JS 脚本

• 回帖提交服务器后，存储至数据库
• 其他网友查看帖子，后台查询该帖子的回帖内容，构建完整页面，返回浏览器
• 该网友浏览器渲染返回的网页，中招！

三、如何防范 XSS 攻击呢

主旨

• 防止攻击者提交恶意代码
• 防止浏览器执行恶意代码

1、 对数据进行严格的输出编码： 如 HTML元素的编码、css编码、js编码、url编码等。

• 避免拼接 HTML；
  • vue/react 技术展，避免使用v-html/dangerouslySetInnerHTML

2、 CSP HTTP Header，即Content-Security-Policy （不支持CSP的旧版浏览器可以设置X-XSS-Protection）

• 增加攻击难度，配置CSP （本质上建立白名单，由浏览器进行拦截）
• 禁止加载外域代码，防止复杂的逻辑攻击
• 禁止外域提交，网站被攻击后，用户的数据不会泄露到外域

参考 前端3年以上面试常考问的web安全问题总结 - 腾讯云开发者社区-腾讯云 【知识总结】有关前端安全的面试题总结 - 掘金