12、前端安全：防范 DOM XSS 与 CSRF 攻击

time3

于 2025-11-19 15:27:07 发布

阅读量10

点赞数

CC 4.0 BY-SA版权

分类专栏： Node.js安全实战指南文章标签： DOM XSS CSRF 前端安全

本文链接：https://blog.youkuaiyun.com/time3/article/details/155118471

Node.js安全实战指南专栏收录该内容

15 篇文章 ¥499.90

订阅专栏¥69.90

会员秒杀 ¥9.9 重磅福利

超级会员免费看

前端安全：防范 DOM XSS 与 CSRF 攻击

1. 防范 DOM XSS 攻击

DOM - based XSS 是一种特殊的跨站脚本攻击，需要专门的处理规则。若应用中大量使用 DOM 操作，就容易受到 DOM XSS 攻击，建议使用如 OWASP 的 ESAPI JavaScript 库这类针对特定上下文验证的 JavaScript 验证库。

1.1 DOM XSS 防护步骤

处理 DOM XSS 防护可分为两个步骤：
1. 获取数据 ：将数据存入 JavaScript 变量，可在服务端构建脚本时进行 JavaScript 编码，也可将值作为 JSON 传输并使用 JSON.parse 解析，切勿使用 eval() 。
2. 使用数据 ：将数据插入 HTML 或 URL 上下文时需进行相应编码；插入属性或 CSS 上下文时则无需编码，但要避免危险属性。

以下是一个简单示例及修复方案：

<!-- chp - 11 - xss/xss - dom - simple.ejs -->
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF - 8">
<title>My DOM XSS</title>
</head>
<body>
<div id="dyn