POST

前端安全

2022/07/12 Web 共 2367 字，约 7 分钟

XSS

XSS(Cross-site scripting) 是一种网站应用程式的安全漏洞攻击，是代码注入的一种。它允许恶意使用者将程式代码注入到网页上，其他使用者在观看网页时就受到影响。这类攻击通常包含了 HTML 以及使用者端脚本语言

XSS 攻击分为三种：反射型，存储型，DOM-based

攻击方式

  • XSS 通过修改 HTML 节点或者执行 JS 代码来攻击网站
<!-- http://wwww.xxx.com?name=<script>alert(1)</script> -->
<div></div>

上述 URL 输入可能会将 HTML 改为 <div><script>alert(1)</script></div>，这样页面中就凭空多了一段可执行脚本。这种攻击类型是反射型攻击，也可以说是 DOM-based 攻击

防御方式

最普遍的做法就是转义输入输出的内容，对于引号，尖括号，斜杠进行转义

function escape(str) {
  str = str.replace(/&/g, "&amp;");
  str = str.replace(/</g, "&lt;");
  str = str.replace(/>/g, "&gt;");
  str = str.replace(/"/g, "&quto;");
  str = str.replace(/'/g, "&##39;");
  str = str.replace(/`/g, "&##96;");
  str = str.replace(/\//g, "&##x2F;");
  return str;
}

通过转义可以将 <script>alert(1)</script> 变成 &lt;script&gt;alert(1)&lt;&##x2F;script&gt;

对于富文本来说，不能通过上面的办法来转义所有字符，因为这样会把需要的格式也过滤掉。这种情况通常采用白名单过滤的方式，当然也可以通过黑名单过滤，但是考虑到需要过滤的标签和标签属性是在太多，更加推荐使用白名单的方式

const xss = require('xss')
const html = xss('<h1 id="title">XSS Demo</h1><script>alert("xss");</script>')
// <h1>XSS Demo</h1>&lt;script&gt;alert("xss");&lt;/script&gt;
  • httpOnly: 这个属性可以防止 XSS，它会禁用 JavaScript 脚本来访问 cookie
  • secure: 这个属性告诉浏览器仅在请求为 https 时发送 cookie，具体内容可以查看Cookie的使用

CSRF

CSRF(Cross-site request forgery) 就是利用用户的登录状态发起恶意请求 CSRF - 跨站请求伪造，是一种常见的攻击方式。指 A 网站正常登录后，cookie 正常保存登录信息，网站 B 通过某种方式调用 A 网站接口进行操作，网站 A 的接口会在请求时自动带上 cookie

攻击方式

403560712-54fdb1994e6c50a3_fix732

防御方式

  • 使用 token 服务器产生一个 token 存在 session 中，同时将 token 发送给客户端，客户端提交表单时带上该 token，服务器验证 token 与 session 是否一致，一致就允许访问，否则拒绝访问

  • referer 验证 referer 指的是页面请求来源，意思是，只接受本站的请求，服务器才做响应，如果不是就拦截

  • SameSite Cookie

  • 使用验证码 对于重要请求，要求用户输入验证码，强制用户必须与应用进行交互，才能完成最终请求

CSRF 攻击，仅仅是利用了 http 携带 cookie 的特性进行攻击，但是攻击站点还是无法得到被攻击站点的 cookie。与 XSS 不同，XSS 是直接通过拿到 Cookie 等信息进行攻击

CSRF 怎么获取用户的登录态

攻击全程不需要获取 cookie，只是在危险的网站欺骗用户去点击已登录的网站链接，利用已登录的网站自动发送 cookie 达到目的、因为 http 请求都会带着请求目标域下的 cookie，向同一个服务器发请求时会带上浏览器保存的 cookie，不管从哪个网站向目标网站发请求

点击劫持

点击劫持就像是将一个危险网站设置透明，然后在其上方设置一个按钮，当你点击这个按钮的时候，就会触发底部恶意网站的某些事件

防御方式

  • 设置 http 响应头 X-Frame-Options X-Frame-Options 响应头是用来给浏览器指示允许一个页面可否在 <frame>, <iframe> 或者 <object> 中展现的标记。网站可以使用此功能，来确保自己网站的内容没有被嵌到别人的网站中去

  • 使用 CSP(Content Security Policy) 内容安全策略

XS-Leaks

XS-Leaks 即跨站泄露。 XS-Leaks 利用了对 HTTP 缓存进行查询的机制，通过对资源缓存的判断进而推断出当前用户的相关信息。

攻击方式

XS-Leaks 攻击的主要流程如下：

    1. 删除特定网站的缓存资源
    1. 强制浏览器刷新网站
    1. 检查浏览器是否缓存了在 1 中删除的资源

2522384929-9f77456b1e725da9_fix732

防御方式

CSRF 的防御手段同样可以让 XS-Leaks 对带鉴权的请求访问无效，从而降低危险。当然有些时候这种攻击其实并不需要鉴权就能达成目的，因此 CSRF 的防御手段并不能做到完美抵御，所以在浏览器层面增加缓存分区就显得非常有必要了

  • 设置 SameSite Cookie
  • CSRF Token
  • 浏览器支持缓存分区
Web