发布于 由admin

JS `XSS` (跨站脚本攻击) 与 `CSRF` (跨站请求伪造) 攻击与防御

各位观众老爷，大家好！我是今天的主讲人，专门负责给大家伙儿“拆台”——拆解那些藏在代码背后的安全隐患。今天咱要聊的是Web安全的两大“恶霸”：XSS (跨站脚本攻击) 和 CSRF (跨站请求伪造)。

别看它们名字挺高大上，实际上干的都是偷偷摸摸的勾当。一个擅长“变脸”，伪装成用户输入；另一个则喜欢“借刀杀人”，冒充用户发请求。但别怕，今天我就要手把手教你们如何识别并击退这些“妖魔鬼怪”。

第一部分：XSS (跨站脚本攻击) – “变脸大师”的真面目

XSS，全称Cross-Site Scripting，直译过来就是“跨站脚本”。听起来好像很深奥，其实就是攻击者想方设法地把恶意JavaScript代码注入到你的网站页面里。当用户浏览这些被注入了恶意代码的页面时，他们的浏览器就会执行这些代码，从而导致各种安全问题。

1. XSS攻击的原理：

想象一下，你的网站有一个留言板功能，用户可以在上面发表评论。如果你没有对用户的输入进行严格的过滤和转义，那么攻击者就可以在评论里插入一段恶意的JavaScript代码。

比如，攻击者发表如下评论：

<script>alert('XSS攻击！');</script>

如果你的网站直接把这段代码显示在页面上，用户的浏览器就会执行这段代码，弹出一个警告框。这只是一个简单的例子，攻击者可以利用XSS攻击做更多坏事，比如窃取用户的Cookie、篡改页面内容、甚至控制用户的浏览器。

2. XSS攻击的类型：

XSS攻击主要分为三种类型：

  • 反射型XSS (Reflected XSS)： 攻击者通过URL参数、表单提交等方式，将恶意代码发送到服务器。服务器接收到恶意代码后，直接将其嵌入到响应页面中返回给用户。用户浏览器解析响应页面时，恶意代码被执行。这种攻击方式是非持久性的，攻击只在用户点击恶意链接或提交包含恶意代码的表单时才会发生。

    举个栗子：

    假设你的网站有一个搜索功能，URL如下：

    http://www.example.com/search?keyword=hello

    如果你的网站没有对keyword参数进行过滤，攻击者可以构造如下URL：

    http://www.example.com/search?keyword=<script>alert('Reflected XSS!');</script>

    当用户点击这个URL时，服务器会将恶意代码嵌入到搜索结果页面中，用户的浏览器就会执行这段代码。

    代码示例 (易受攻击的代码):

    <?php
$keyword = $_GET['keyword'];
echo "您搜索的关键词是： " . $keyword; // 存在XSS漏洞
?>

  • 存储型XSS (Stored XSS)： 攻击者将恶意代码存储到服务器的数据库中。当用户访问包含恶意代码的页面时，恶意代码从数据库中取出并执行。这种攻击方式是持久性的，只要用户访问包含恶意代码的页面，攻击就会发生。

    举个栗子：

    还是那个留言板功能，攻击者在评论里插入恶意代码，并将评论提交到服务器。服务器将评论存储到数据库中。当其他用户访问留言板页面时，服务器从数据库中取出包含恶意代码的评论，并将其显示在页面上。用户的浏览器就会执行这段代码。

    代码示例 (易受攻击的代码):

    <?php
// 连接数据库 (省略数据库连接代码)
$comment = $_POST['comment'];
$sql = "INSERT INTO comments (content) VALUES ('$comment')"; // 存在XSS漏洞
// 执行SQL语句 (省略执行代码)
?>

  • DOM型XSS (DOM-based XSS)： 攻击者通过修改页面的DOM结构，将恶意代码注入到页面中。这种攻击方式不需要服务器参与，恶意代码直接在用户的浏览器端执行。

    举个栗子：

    你的网站使用JavaScript从URL的hash部分获取参数，并将其显示在页面上。攻击者可以构造包含恶意代码的URL，例如：

    http://www.example.com/#<script>alert('DOM XSS!');</script>

    你的JavaScript代码会将恶意代码插入到页面中，用户的浏览器就会执行这段代码。

    代码示例 (易受攻击的代码):

    <script>
var hash = document.location.hash;
document.getElementById('output').innerHTML = hash; // 存在XSS漏洞
</script>
<div id="output"></div>

3. XSS攻击的防范：

防范XSS攻击的关键在于对用户的输入进行严格的过滤和转义，并对输出进行适当的编码。

  • 输入验证： 验证用户输入的数据是否符合预期的格式和类型。例如，如果你的网站需要用户输入邮箱地址，你可以使用正则表达式验证用户输入的是否是一个有效的邮箱地址。
  • 输出编码： 对输出到页面的数据进行适当的编码，以防止浏览器将其解析为可执行的代码。常用的编码方式包括HTML编码、JavaScript编码、URL编码等。
  • 使用CSP (Content Security Policy)： CSP是一种安全策略，可以限制浏览器加载和执行哪些资源。通过配置CSP，你可以有效地防止XSS攻击。
  • 使用HTTPOnly Cookie： 将Cookie设置为HTTPOnly，可以防止JavaScript代码访问Cookie。这样，即使攻击者成功执行了XSS攻击，也无法窃取用户的Cookie。

代码示例 (使用htmlspecialchars()进行输出编码):

<?php
$keyword = $_GET['keyword'];
echo "您搜索的关键词是： " . htmlspecialchars($keyword); // 使用htmlspecialchars()进行编码
?>

代码示例 (使用JavaScript库进行输出编码):

// 使用DOMPurify库进行XSS过滤
var clean = DOMPurify.sanitize(dirty);
document.getElementById('output').innerHTML = clean;

表格总结XSS防御措施：

防御措施 描述 适用场景
输入验证 验证用户输入的数据是否符合预期的格式和类型。 所有用户输入的地方
输出编码 对输出到页面的数据进行适当的编码，以防止浏览器将其解析为可执行的代码。 所有输出数据的地方
使用CSP CSP是一种安全策略，可以限制浏览器加载和执行哪些资源。 所有页面
使用HTTPOnly Cookie 将Cookie设置为HTTPOnly，可以防止JavaScript代码访问Cookie。 所有Cookie
使用OWASP ESAPI OWASP ESAPI (Enterprise Security API) 是一个免费的、开源的 web 应用安全控制库，它使得程序员能够更容易地在应用程序中构建安全控制。它提供了一系列 API，用于执行常见的安全任务，例如输入验证、输出编码、身份验证和授权、加密等。使用 ESAPI 可以有效地减少 XSS、SQL 注入、CSRF 等安全漏洞。 虽然ESAPI主要用于Java，但类似的库和概念也可以应用于其他语言。 所有需要进行安全控制的地方

第二部分：CSRF (跨站请求伪造) – “借刀杀人”的幕后黑手

CSRF，全称Cross-Site Request Forgery，直译过来就是“跨站请求伪造”。它是一种利用用户的身份，在用户不知情的情况下，冒充用户发起恶意请求的攻击方式。

1. CSRF攻击的原理：

假设你的网站有一个修改密码的功能，用户可以通过访问以下URL修改密码：

http://www.example.com/change_password?new_password=newpassword

如果你的网站没有对请求的来源进行验证，攻击者就可以构造一个包含这个URL的恶意页面，并诱骗用户访问这个页面。当用户访问这个恶意页面时，用户的浏览器会自动向你的网站发送修改密码的请求。由于用户的浏览器会自动携带用户的Cookie，服务器会认为这是用户本人发起的请求，从而执行修改密码的操作。

2. CSRF攻击的条件：

CSRF攻击需要满足以下几个条件：

  • 用户已经登录目标网站： 攻击者需要利用用户的身份才能发起恶意请求。
  • 用户访问了攻击者构造的恶意页面： 攻击者需要诱骗用户访问恶意页面，才能让用户的浏览器向目标网站发送请求。
  • 目标网站没有对请求的来源进行验证： 如果目标网站对请求的来源进行了验证，可以有效地防止CSRF攻击。

3. CSRF攻击的防范：

防范CSRF攻击的关键在于对请求的来源进行验证，确保请求是由用户本人发起的。

  • 验证Referer字段： Referer字段包含了请求的来源URL。服务器可以验证Referer字段，判断请求是否来自合法的页面。但是，Referer字段可以被篡改，所以这种方法并不可靠。
  • 添加验证码： 在执行敏感操作时，要求用户输入验证码。这样可以确保请求是由用户本人发起的，而不是由恶意脚本自动发起的。但是，验证码会影响用户体验。
  • 使用CSRF Token： CSRF Token是一种随机生成的字符串，服务器将其存储在用户的Session中，并在生成表单时将其嵌入到表单中。当用户提交表单时，服务器会验证表单中包含的CSRF Token是否与Session中存储的CSRF Token一致。如果一致，则认为请求是合法的；否则，则认为请求是伪造的。

代码示例 (使用CSRF Token):

<?php
session_start();

// 生成CSRF Token
if (empty($_SESSION['csrf_token'])) {
    $_SESSION['csrf_token'] = bin2hex(random_bytes(32));
}

// 显示包含CSRF Token的表单
?>
<form action="process_form.php" method="post">
    <input type="hidden" name="csrf_token" value="<?php echo $_SESSION['csrf_token']; ?>">
    <label for="new_password">新密码：</label>
    <input type="password" name="new_password" id="new_password">
    <button type="submit">修改密码</button>
</form>

<?php
// process_form.php

session_start();

// 验证CSRF Token
if (!isset($_POST['csrf_token']) || $_POST['csrf_token'] !== $_SESSION['csrf_token']) {
    die('CSRF攻击！');
}

// 处理表单数据 (省略处理代码)
?>

代码示例 (使用Double Submit Cookie):

// 设置CSRF Cookie
function setCookie(name,value,days) {
    var expires = "";
    if (days) {
        var date = new Date();
        date.setTime(date.getTime() + (days*24*60*60*1000));
        expires = "; expires=" + date.toUTCString();
    }
    document.cookie = name + "=" + (value || "")  + expires + "; path=/";
}

// 生成并设置CSRF Cookie
var csrfToken = Math.random().toString(36).substring(2);
setCookie('csrf_token', csrfToken, 7); // 设置cookie有效期为7天

// 在请求头中添加CSRF Token
fetch('/api/change_password', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
        'X-CSRF-Token': csrfToken // 添加到请求头
    },
    body: JSON.stringify({ new_password: 'newpassword' })
})
.then(response => response.json())
.then(data => console.log(data));
<?php
// 后端验证CSRF Token (Double Submit Cookie)
$csrfToken = $_COOKIE['csrf_token'];
$requestToken = $_SERVER['HTTP_X_CSRF_TOKEN'];

if ($csrfToken !== $requestToken) {
    die('CSRF攻击!');
}

// 处理请求 (省略处理代码)
?>

表格总结CSRF防御措施：

防御措施 描述 适用场景
验证Referer字段 验证Referer字段，判断请求是否来自合法的页面。 所有请求
添加验证码 在执行敏感操作时，要求用户输入验证码。 敏感操作
使用CSRF Token CSRF Token是一种随机生成的字符串，服务器将其存储在用户的Session中，并在生成表单时将其嵌入到表单中。当用户提交表单时，服务器会验证表单中包含的CSRF Token是否与Session中存储的CSRF Token一致。 所有POST请求
使用Double Submit Cookie Double Submit Cookie是一种CSRF防御技术，它通过设置一个随机值的Cookie，并在所有需要防范CSRF的请求中，将该Cookie的值作为请求参数发送到服务器。服务器验证Cookie的值和请求参数的值是否一致，如果一致，则认为请求是合法的。 与传统的CSRF Token方法相比，Double Submit Cookie不需要在服务器端存储任何状态信息，因此可以减少服务器的压力。 但需要注意的是，Double Submit Cookie只能用于同源请求，即请求的域名、协议和端口号必须与当前页面的域名、协议和端口号相同。如果请求是跨域的，则浏览器会阻止JavaScript代码读取Cookie的值，从而导致CSRF防御失效。 所有需要防范CSRF的请求
SameSite Cookie属性 SameSite Cookie属性是一种HTTP Cookie的属性，用于控制Cookie是否可以被跨站请求发送。它可以设置为三个值：Strict、Lax和None。 Strict：Cookie只能在同站请求中发送，即请求的域名、协议和端口号必须与当前页面的域名、协议和端口号相同。 Lax：Cookie可以在同站请求和某些跨站请求中发送，例如点击链接、提交表单等。 None：Cookie可以在所有请求中发送，包括跨站请求。但如果设置为None，则必须同时设置Secure属性，表示Cookie只能在HTTPS连接中发送。 使用SameSite Cookie属性可以有效地防止CSRF攻击，因为它可以限制Cookie的发送范围，从而防止攻击者利用用户的身份发起恶意请求。 所有Cookie

第三部分：总结与展望

今天咱们聊了XSS和CSRF两种Web安全攻击方式，以及相应的防御措施。希望大家在开发网站时，能够牢记这些安全知识，并将其应用到实际项目中。

记住，安全不是一蹴而就的事情，而是一个持续不断的过程。我们需要不断学习新的安全知识，并及时更新我们的防御策略，才能有效地保护我们的网站和用户的数据安全。

最后，希望大家都能成为一名合格的“安全卫士”，共同维护一个安全、可靠的Web环境！ 感谢大家的观看，咱们下期再见！

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注