如何在Node.js中检测HTML中的JavaScript并阻止JS渲染

1. Node.js环境可完全实现HTML中JS代码的检测 #

你可以借助成熟的HTML解析库完成全场景的JS识别，覆盖所有可能的JS执行入口，常用工具包括cheerio、jsdom，检测范围包括：

• 内联/外部引用的<script>标签
• 元素上绑定的onclick、onload、onerror等on开头的事件属性
• href="javascript:xxx"格式的JS伪协议调用
• iframe内嵌内容中的JS代码（可递归检测）

示例检测代码（基于cheerio）：

const cheerio = require('cheerio');
// 传入HTML字符串即可返回是否包含JS代码
function checkHtmlHasJs(htmlStr) {
  const $ = cheerio.load(htmlStr);
  // 检测script标签
  if ($('script').length) return true;
  // 遍历所有元素的属性检测JS入口
  $('*').each((_, el) => {
    const attrs = el.attribs;
    for (const attrKey in attrs) {
      // 检测on开头的事件属性
      if (attrKey.startsWith('on')) return true;
      // 检测javascript伪协议
      if (attrKey === 'href' && attrs[attrKey].trimStart().startsWith('javascript:')) return true;
    }
  })
  return false;
}

2. 仅禁止JS执行、不影响HTML本身渲染的需求可实现 #

核心思路是对HTML内容做JS入口清洗，同时保留所有HTML结构、CSS样式、静态内容不变，处理完成后依然返回text/html类型的响应即可，具体操作：

• 把所有<script>标签的type属性修改为浏览器不识别的类型（比如type="text/inactive"），或直接移除script标签，浏览器不会执行这类script的代码，也不会影响页面渲染
• 移除所有元素上的on*事件属性，或清空属性值
• 把javascript:开头的伪协议链接替换为#或普通静态链接
• 额外增加响应头Content-Security-Policy: script-src 'none';做双重保险，即使有漏处理的JS入口，浏览器也会直接拦截所有JS执行，完全不影响HTML和CSS的正常渲染

如果是Node.js做反向代理的场景，只需要在拿到上游服务返回的HTML响应后，先做上述清洗处理，再返回给客户端即可，效果完全符合你的要求。

内容的提问来源于stack exchange，提问作者ShahtajK