# 浏览器安全 --- XSS 攻击

# 有哪些可能引起前端安全的的问题?

  1. 跨站脚本 (Cross-Site Scripting, XSS): 一种代码注入方式, 为了与 CSS 区分所以被称作 XSS. 早期常见于网络论坛, 起因是网站没有对用户的输入进行严格的限制, 使得攻击者可以将脚本上传到帖子让其他人浏览到有恶意脚本的页面, 其注入方式很简单包括但不限于 JavaScript / VBScript / CSS / Flash 等
  2. iframe的滥用: iframe中的内容是由第三方来提供的,默认情况下他们不受我们的控制,他们可以在iframe中运行JavaScirpt脚本、Flash插件、弹出对话框等等,这可能会破坏前端用户体验
  3. 跨站点请求伪造(Cross-Site Request Forgeries,CSRF): 指攻击者通过设置好的陷阱,强制对已完成认证的用户进行非预期的个人信息或设定信息等某些状态更新,属于被动攻击
  4. 恶意第三方库

# XSS 攻击

  • 什么是 XSS 攻击
    XSS(Cross Site Scripting) 跨站脚本,XSS 攻击是指浏览器中执行恶意脚本(跨域或同域),从而拿到用户的信息并进行操作
    1. 窃取 Cookie
    2. 监听用户行为,例如输入账号密码后直接发送到黑客服务器
    3. 修改 DOM 伪造登录表单
    4. 在页面中生成浮窗广告
  • 分类
    根据攻击的来源,XSS 攻击可分为存储型、反射型和 DOM 型三种
  • 存储型 攻击者将恶意代码存储到了服务端的数据库,当用户打开目标网站的时候服务端将恶意代码从数据库中取出,拼接在 HTML 中返回给浏览器,混在其中的恶意代码被执行
    常见场景
    常见于带有保存用户数据的网站功能,如评论区、用户私信(前后端没有做好转义工作)
  • 反射型
    反射性 XSS 是指把恶意脚本作为网络请求的一部分(存在 URL 中)
    反射性 XSS 和存储型 XSS 的区别是:存储型 XSS 的恶意代码存在服务端数据库,反射型 XSS 的恶意代码存在 URL 中
    比如:http://www.baidu.com?q=<script>alert('You are done!')</script>
    服务端会拿到 q 参数,然后将内容返回给浏览器端,浏览器将这些内容作为 HTML 的一部分解析,发现是一个脚本就会直接执行
    由于需要用户主动打开恶意的 URL 才能生效,攻击者往往会结合多种手段诱导用户点击
    常见场景
    常见于通过 URL 传递参数的功能,如网站搜索、跳转等
    之所以叫反射型是因为恶意脚本作为网络请求的参数传递给服务端,然后再被反射到 HTML 文档中返回给浏览器解析执行
  • DOM 型
    用户打开带有恶意代码的 URL,浏览器接收到响应后解析执行,前端 JavaScript 取出 URL 中的恶意代码执行
    DOM 型 XSS 跟前两种 XSS 的区别:DOM 型 XSS 攻击中,取出和执行恶意代码由浏览器端完成,属于前端 JavaScript 自身的安全漏洞,而其他两种 XSS 都属于服务端的安全漏洞

# XSS 攻击的防范措施

XSS 攻击有两大要素:

  1. 攻击者提交恶意代码
  2. 浏览器执行恶意代码
    一个信念,两个利用
  3. 千万不要相信任何用户的输入
    无论是在前端还是服务端,都要对用户的数据进行转码或者过滤
  4. 利用 CSP(浏览器内容安全策略),核心思想是服务器决定浏览器加载渲染哪些内容
    限制其他域下的资源加载
    禁止向其他域提交数据
    提供上报机制,及时发现 XSS 攻击
  5. 利用 HttpOnly
    设置 Cookie 的 HttpOnly 之后,JS 无法读取 Cookie

纯前端渲染的过程:

  1. 浏览器先加载一个静态 HTML,此 HTML 中不包含任何跟业务相关的数据
  2. 然后浏览器执行 HTML 中的 JavaScript
  3. JavaScript 通过 Ajax 加载业务数据,调用 DOM API 更新到页面上

转义 HTML

避免在字符串中拼接不可信数据

输入内容长度控制

Last Updated: 5/6/2020, 11:48:16 AM