JavaScript如何防止代码注入攻击？-js教程-PHP中文网

JavaScript如何防止代码注入攻击？

夢幻星辰

发布： 2025-12-22 18:41:28

原创

939人浏览过

JavaScript无法直接防止代码注入，核心是禁止执行不可信字符串：禁用eval()、Function()、setTimeout(string)等；插入HTML时用textContent或DOMPurify转义；JSON解析用JSON.parse()而非eval；启用CSP禁用'unsafe-eval'和'unsafe-inline'。

javascript如何防止代码注入攻击？

JavaScript本身不能直接防止代码注入攻击，关键在于不执行不可信的字符串作为代码。常见错误是用eval()、Function()、setTimeout(string)或setInterval(string)动态运行用户输入的内容。

避免动态执行字符串代码

这是最核心的防护原则。任何来自用户、URL参数、表单、API响应或本地存储的数据，都不能直接传给以下函数：

eval()
new Function(...)
setTimeout(string, ...) 或 setInterval(string, ...)
document.write()（尤其拼接用户数据时）

例如，不要这样写：

❌ 错误示例

const userInput = 'alert("xss")';
eval(userInput); // 危险！

登录后复制

安全处理HTML和DOM插入

向页面插入用户内容时，必须防止XSS（跨站脚本）——本质也是一种代码注入。

立即学习“Java免费学习笔记（深入）”；

迅易年度企业管理系统开源完整版

系统功能强大、操作便捷并具有高度延续开发的内容与知识管理系统，并可集合系统强大的新闻、产品、下载、人才、留言、搜索引擎优化、等功能模块，为企业部门提供一个简单、易用、开放、可扩展的企业信息门户平台或电子商务运行平台。开发人员为脆弱页面专门设计了防刷新系统，自动阻止恶意访问和攻击；安全检查应用于每一处代码中，每个提交到系统查询语句中的变量都经过过滤，可自动屏蔽恶意攻击代码，从而全面防止SQL注入攻击

查看详情

用textContent代替innerHTML，当只需显示纯文本时
若必须插入HTML，先对特殊字符做转义（如 → <code><），或使用可信的库如DOMPurify
避免用字符串拼接构造HTML，改用document.createElement() + appendChild() + textContent

例如：

✅ 推荐方式

const el = document.createElement('div');
el.textContent = userInput; // 自动转义，安全

登录后复制

谨慎使用JSON解析与模板引擎

JSON.parse()本身安全（只要输入是合法JSON），但注意别用eval()模拟解析；模板引擎如Handlebars、Mustache默认会自动转义变量，但需确认未关闭转义（如Handlebars中{{{ }}}是不转义的，慎用）。

永远用JSON.parse()，不用eval('(' + jsonStr + ')')
检查模板语法是否启用了“原始输出”，避免把用户数据不经转义渲染成HTML
服务端返回的数据，前端仍需当作不可信内容处理，不因“自己后端发的”就放松校验

启用CSP（内容安全策略）作为纵深防御

CSP不是JS代码层面的修复，但能大幅降低注入成功后的危害。通过HTTP响应头设置：

Content-Security-Policy: default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'

登录后复制

应移除'unsafe-eval'和'unsafe-inline'，改用外部JS文件和事件委托。

禁止内联脚本（<script>...</script>、onclick="..."）
禁止eval类函数执行
配合非ces-only的哈希或nonce机制更稳妥

以上就是JavaScript如何防止代码注入攻击？的详细内容，更多请关注php中文网其它相关文章！

大家都在看：

JavaScript中如何实现栈和队列_数组实现方式 javascript的代码混淆是什么_它如何保护源代码？什么是JavaScript的Source Map_它如何映射压缩后的代码呢 Javascript的严格模式是什么_为什么要使用它？如何在javascript中实现深拷贝_有哪些常见的方法和陷阱？