前端安全 xss、cors、csrf

user3975155117950
166 阅读7分钟

前端安全

xss

XSS 攻击可以分为三类：存储（也称为持久）、反射（也称为非持久）或基于 DOM。详细的解释可以查看这篇文章juejin.cn/post/684490…

  • 存储型 XSS 攻击

    • 注入的脚本永久存储在目标服务器上。当浏览器发送数据请求时，受害者会从服务器接收到该恶意脚本。
    • 场景：比如在掘金的发文章的时候，故意文章里增加一个 script 标签，如果后台没有对文章的里内容做检查，当文章保存到数据库的时候，script 标签也被保存了。当文章发布后被其他的jy看到，文章里的script标签被浏览器解析，其中的代码就会被执行。

  • 反射型 XSS 攻击

    • 当用户被诱骗点击恶意链接、提交特制表单或浏览恶意网站时，注入的代码就会传输到易受攻击的网站。Web 服务器将注入的脚本传回用户的浏览器，例如在错误消息、搜索结果或包含作为请求的一部分发送到服务器的数据的任何其他响应中。浏览器执行恶意代码是因为它假设来自用户已经与之交互的服务器的响应是“可信”的。
    • 场景：比如，我们通常会在url加入一些参数，如果没有判断参数里是否被填充了script标签，后端直接把参数的值取出来作用插入到被返回的html中，就会导致xss攻击。

  • 基于 DOM 的 XSS 攻击

    • 其是指通过修改原始客户端脚本所使用的 DOM 环境（在受害者浏览器中）而执行的。也就是说，页面本身没有改变，但是页面中包含的客户端代码由于对 DOM 环境的恶意修改而以期望之外的方式运行
    • 场景：攻击者构造出特殊的 URL，其中包含恶意代码。用户打开带有恶意代码的 URL。 用户浏览器接收到响应后解析执行，前端 JavaScript 取出 URL 中的恶意代码并执行。恶意代码窃取用户数据并发送到攻击者的网站，或者冒充用户的行为，调用目标网站接口执行攻击者指定的操作。

跨站脚本攻击（XSS）是一种常见的网络安全威胁。解决 XSS 攻击的主要策略是正确地处理用户输入和输出的数据，不能让有script标签的输入输出到html中，即使script插入到了html也不能让它执行，执行了也不能让他获取用户信息。以下是一些常见的解决方案：

  1. 转义用户输入：在将用户输入的数据插入到 HTML 中之前，应该将其转义。这可以防止攻击者插入恶意的 HTML 或 JavaScript 代码。例如，你可以将 < 转换为 <，将 > 转换为 > 等。
  2. 使用内容安全策略（CSP）：CSP 是一种安全机制，它可以限制浏览器加载和执行来自特定来源的资源。例如，你可以设置 CSP 来禁止加载和执行来自非信任来源的脚本。
  3. 使用 HTTP-only cookies：HTTP-only cookies 不能被 JavaScript 访问，这可以防止攻击者通过 XSS 攻击窃取用户的 cookies。
  4. 验证和清理用户输入：在接收用户输入的数据之前，应该验证其格式和内容。如果发现任何可疑或不符合规定的内容，应该拒绝接收或清理这些数据。
  5. 使用安全的库和框架：许多现代的 web 开发库和框架（如 React、Angular、Vue.js 等）都内置了一些防止 XSS 攻击的机制。使用这些库和框架可以帮助你更容易地防止 XSS 攻击。

请注意，这些只是防止 XSS 攻击的一些基本策略，实际的防护措施可能需要根据你的具体情况进行调整。

cors

跨域资源共享（CORS）是一种机制，它使用额外的 HTTP 头来告诉浏览器让运行在一个 origin（域名）上的 Web 应用被准许访问来自不同源服务器上的指定的资源。当一个 Web 应用进行 CORS 跨域请求时，浏览器会向服务器发送一个预检请求，服务器必须正确响应这个预检请求，然后才能进行实际的请求。

以下是一些常见的解决 CORS 问题的策略：

  1. 设置正确的 CORS 头：服务器需要在响应中包含正确的 CORS 头。例如，Access-Control-Allow-Origin 头可以指定哪些源可以访问这个资源，Access-Control-Allow-Methods 头可以指定哪些 HTTP 方法可以用来访问这个资源。
  2. 使用代理服务器：如果你不能控制服务器的配置，你可以使用一个代理服务器来绕过 CORS 限制。代理服务器可以接收到你的请求，然后代你向目标服务器发送请求，最后将目标服务器的响应返回给你。
  3. 使用 JSONP：JSONP 是一种旧的跨域解决方案，它通过动态创建 script 标签来绕过浏览器的同源策略。但是，JSONP 只能用于 GET 请求，并且存在一些安全问题，所以现在很少使用。

请注意，这些只是解决 CORS 问题的一些基本策略，实际的解决方案可能需要根据你的具体情况进行调整。

csrf

跨站请求伪造（CSRF）是一种网络攻击，攻击者通过诱导用户点击链接或加载页面的方式，使用户在不知情的情况下向服务器发送恶意请求。

场景：第三方链接，比如说 A网站 每次打开的文章或者评论区的链接的时候，都会提示你注意安全。那是因为你打开第三方链接后，如果恶意网站 B网站 有一个自动提交的表单，向A发起了请求，由于A在你的浏览器设置了cookie，所以这个恶意网站B帮你向A后台发起的请求就会携带A的cookie。

以下是一些常见的解决 CSRF 攻击的策略：

  1. 使用 CSRF 令牌：服务器生成一个随机的、唯一的值，称为 CSRF 令牌，并将其嵌入到表单中。当用户提交表单时，服务器会检查提交的 CSRF 令牌是否与之前生成的令牌匹配。如果不匹配，服务器会拒绝请求。
  2. 使用 SameSite Cookie 属性：SameSite Cookie 属性可以防止浏览器在跨站请求中发送 Cookie，从而防止 CSRF 攻击。有两个值可以设置，"Strict" 和 "Lax"，"Strict" 完全禁止跨站请求，"Lax" 在某些情况下允许。
  3. 验证 Referer 头：服务器可以检查 HTTP Referer 头，以确保请求是从可信的源发送的。如果 Referer 头的值不是预期的值，服务器可以拒绝请求。
  4. 使用双重 Cookie 验证：在这种方法中，当用户访问网站时，服务器会在用户的浏览器中设置一个随机值的 Cookie。然后，每次发送请求时，客户端需要在请求参数中包含这个 Cookie 的值。服务器会比较 Cookie 的值和请求参数中的值，如果不匹配，服务器会拒绝请求。如果cookie设置了httponly的话这种方式就不能用了。

请注意，这些只是防止 CSRF 攻击的一些基本策略，实际的防护措施可能需要根据你的具体情况进行调整。

avatar
文章
阅读
粉丝