XSS攻击防范

前端安全系列之XSS攻击防范

1、使用textContent

2、使用HTML转义

• 把JS中的标签转成字符

3、对于链接跳转 禁止含有'javascript:'开头的字符

4、标签属性中含有恶意执行代码 javascript

5、如果用户输入的文本进行过滤很容易照成注入漏洞

6、什么是XSS攻击

• Cross-Site Scripting(跨站脚本攻击) 为和CSS区分所以叫XSS攻击

7、XSS攻击的本质

• 而已代码未经过滤，混入正常代码中，浏览器无法分辨，导致恶意代码被执行;

8、在处理输入时，以下内容都不可信

• 来自用户的 UGC 信息
• 来自第三方的链接
• URL 参数
• POST 参数
• Referer （可能来自不可信的来源）
• Cookie （可能来自其他子域注入）

9、XSS分类

• 根据攻击来源可分为三种: 存储型、反射型、DOM型;
  • 存储型:
    • 攻击者将恶意代码提交到目标网站的数据库中, 用户打开目标网站时，网站服务端将恶意代码从数据库取出，拼接在 HTML 中返回给浏览器;
    • 用户浏览器接收到响应后解析执行，混在其中的恶意代码也被执行, 恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作
    • 常见操作带有用户保存数据的网站功能，如论坛发帖、商品评论、用户私信等
  • 反射型:
    • 攻击者构造出特殊的 URL，其中包含恶意代码,用户打开带有恶意代码的 URL 时，网站服务端将恶意代码从 URL 中取出，拼接在 HTML 中返回给浏览器。
    • 反射型 XSS 跟存储型 XSS 的区别是：存储型 XSS 的恶意代码存在数据库里，反射型 XSS 的恶意代码存在 URL 里
    • 反射型 XSS 漏洞常见于通过 URL 传递参数的功能，如网站搜索、跳转等。
  • DOM 型:
    • 攻击者构造出特殊的 URL，其中包含恶意代码,
      
      用户打开带有恶意代码的 URL,用户浏览器接收到响应后解析执行，前端 JavaScript 取出 URL 中的恶意代码并执行。
    • DOM 型 XSS 跟前两种 XSS 的区别：DOM 型 XSS 攻击中，取出和执行恶意代码由浏览器端完成，属于前端 JavaScript 自身的安全漏洞，而其他两种 XSS 都属于服务端的安全漏洞。

10、XSS攻击预防

• 包含两大要素
  • 攻击者提交恶意代码。
  • 浏览器执行恶意代码。
• 两种方式
  • 纯前端渲染(当前主流形式)
    • 浏览器先加载一个静态 HTML，此 HTML 中不包含任何跟业务相关的数据,然后浏览器执行 HTML 中的 JavaScript, JavaScript 通过 Ajax 加载业务数据，调用 DOM API 更新到页面上。
    • 但纯前端渲染还需注意避免 DOM 型 XSS 漏洞;
    • 使用.innerHTML、.outerHTML、document.write()要小心;应尽量使用textContent;如果用 Vue/React 技术栈，并且不使用 v-html、dangerouslySetInnerHTML 功能，就在前端 render 阶段避免 innerHTML、outerHTML 的 XSS 隐患。
  • 转义 HTML
    • Java 工程里，常用的转义库为 org.owasp.encoder;

后记

• DOM 中的内联事件监听器，如 location、onclick、onerror、onload、onmouseover 等，标签的 href 属性，JavaScript 的 eval()、setTimeout()、setInterval() 等，都能把字符串作为代码运行。如果不可信的数据拼接到字符串中传递给这些 API，很容易产生安全隐患，请务必避免。