什么是javascript安全_XSS攻击如何防范?

XSS是因输入未过滤导致恶意JS执行的漏洞,防范关键是不让不可信数据以脚本方式运行;需对用户输入、URL参数、Cookie等默认不可信,并按HTML、JS、CSS、URL上下文分别转义。

JavaScript本身没有“安全_XSS攻击”这个概念,XSS(跨站脚本攻击)是一种利用网站对用户输入缺乏过滤或转义,从而在页面中执行恶意JavaScript代码的常见Web安全漏洞。防范核心是:**不让不可信数据以脚本方式运行**。

输入不信任,输出要转义

所有来自用户、URL参数、Cookie、第三方API的数据,都默认不可信。向HTML、JavaScript、CSS或URL上下文中插入数据前,必须做对应上下文的编码:

  • 插入HTML内容(如 innerHTML)→ 使用 HTML实体转义(zuojiankuohaophpcn""
  • 插入JS字符串(如 var x = "xxx")→ 使用 JavaScript 字符串转义(\"' 等需加反斜杠或Unicode编码)
  • 插入URL参数(如 location.href = "?q=" + user)→ 使用 encodeURIComponent()

优先使用安全的API和框架机制

现代前端框架(React、Vue、Angular)默认对插值内容做HTML转义,只要不用 v-htmldangerouslySetInnerHTML 这类“逃逸接口”,就能规避大部分反射型和存储型XSS。

原生开发中,避免直接拼接HTML字符串,改用 DOM API 构建元素:

  • ✅ 推荐:element.textContent = userInput(纯文本,无执行风险)
  • ✅ 推荐:element.setAttribute('data-id', userInput)
  • ❌ 避免:element.innerHTML = '' + userInput + ''

启用HTTP安全头加固防御

服务端配置关键响应头,作为纵深防御层:

  • Content-Security-Policy(CSP):限制哪些来源的脚本可执行,例如 script-src 'self'; 可阻止内联脚本和外部未授权JS
  • X-XSS-Protection: 1; mode=block(旧版浏览器兼容,现代推荐用CSP替代)
  • HttpOnly Cookie:防止JS读取敏感Cookie(如session),降低XSS后的危害扩大

定期清理和校验富文本

若业务必须支持用户提交HTML(如编辑器),不能简单白名单过滤标签——要使用专业库(如 DOMPurify)对HTML进行严格净化:

  • 只保留明确允许的标签(pstronga等)和属性(href需校验是否为http://https://
  • 移除所有 onerroronclickjavascript: 等执行逻辑
  • 避免在富文本渲染时使用 innerHTML + 自己写的正则清洗(极易绕过)

基本上就这些。XSS不复杂但容易忽略上下文差异,关键是把“数据”和“代码”严格分开,不信输入、严控输出、多层设防。