常见 Web 安全攻防总结

Web 应用程序的安全性一直是前端开发人员需要考虑的重要问题。在本文中，我们将讨论常见的 Web 安全攻防，并提供一些深入的解释和实用建议。

XSS 攻击

跨站脚本攻击（XSS）是一种常见的Web攻击，攻击者利用输入验证不充分的漏洞注入恶意脚本代码到页面中，从而可窃取用户的敏感信息或者操作其账号。

示例代码：

// 此代码易遭受 XSS 攻击
document.write('<p>' + untrustedInput + '</p>');

预防 XSS 攻击的方法之一是通过转义特殊字符来清理所有输入数据。例如，可以使用 DOMPurify 库：

const cleanedInput = DOMPurify.sanitize(untrustedInput);
document.write('<p>' + cleanedInput + '</p>');

此外，CSP(Content Security Policy)可以帮助防御 XSS 攻击， 它允许开发人员指定哪些来源的内容可以被加载到自己的网站上。

CSRF 攻击

跨站请求伪造（CSRF）攻击是一种利用用户已登录状态下的身份认证，向服务器发送伪造请求的攻击。攻击者可以通过诱使受害者点击一个恶意链接或者访问一个被攻击站点，实现在用户不知情的情况下执行恶意操作。

示例代码：

<!-- 伪造请求 -->
<form action="https://example.com/transfer" method="POST">
  <input type="hidden" name="to" value="hacker_account">
  <input type="hidden" name="amount" value="1000000">
  <button type="submit">Send Money</button>
</form>

预防 CSRF 攻击的方法之一是添加 CSRF token，服务器生成一个独特的令牌，它与用户会话相关联，并将其嵌入到 Web 页面的隐藏表单字段中。在处理任何提交请求时，服务端会验证该 token 是否有效。

<!-- 添加 CSRF token -->
<form action="https://example.com/transfer" method="POST">
  <input type="hidden" name="to" value="hacker_account">
  <input type="hidden" name="amount" value="1000000">
  <input type="hidden" name="csrf_token" value="your_csrf_token_here">
  <button type="submit">Send Money</button>
</form>

SQL 注入攻击

SQL 注入攻击是指攻击者通过构造恶意 SQL 查询语句，利用应用程序对用户输入数据未经验证而直接拼接成 SQL 语句从而执行数据库查询语句，导致敏感数据泄露或数据库被攻破。

示例代码：

// SQL 注入攻击
const name = "'; DROP TABLE users; --";
const query = "SELECT * FROM users WHERE name='" + name + "'";

预防 SQL 注入攻击的方法之一是使用参数化查询，例如，在 Node.js 中可以使用 mysql 库：

const name = "'; DROP TABLE users; --";
connection.query('SELECT * FROM users WHERE name = ?', [name], function (error, results, fields) {
  // 处理结果
});

点击劫持攻击

点击劫持攻击是通过在一个可见页面上放置透明的覆盖层，将用户的点击行为转移到被隐藏的按钮或链接上来，以达到欺骗用户操作的目的。

示例代码：

<!-- 点击劫持攻击 -->
<style>
    #overlay {
      position: absolute;
      top: 0;

> 来源：[JavaScript中文网](https://www.javascriptcn.com/post/5786) ，转载请注明来源
[https://www.javascriptcn.com/post/5786](https://www.javascriptcn.com/post/5786)