Html Minifier遇用户输入非标签'<''符号时解析失败求助

问题根源是html-minifier会将<3中的<识别为未闭合的HTML标签起始符，导致HTML结构合法性校验失败，进而压缩出错。以下是两种可行的解决办法：

方法1：转义用户输入的HTML特殊字符 #

在将用户输入嵌入HTML模板之前，先把输入中的<转义为<，>转义为>。转义后的内容在<pre>标签中会正常显示为原始符号，但HTML结构完全合法，html-minifier可以正常解析压缩。

示例转义函数：

function escapeUserInput(text) {
  // 转义HTML特殊字符，避免解析错误同时防范XSS
  return text.replace(/</g, '&lt;').replace(/>/g, '&gt;');
}

// 嵌入模板前处理用户输入
const safeUserMessage = escapeUserInput(userInput);
// 再将safeUserMessage嵌入到你的HTML模板中生成wrappedBody

这种方法不仅解决了压缩失败的问题，还能避免潜在的XSS攻击风险，是优先推荐的方案。

方法2：配置html-minifier跳过特定标签内的内容解析 #

如果不想修改用户输入，可以通过ignoreCustomFragments配置让html-minifier跳过<pre>标签内的内容解析，不对这部分内容做HTML结构校验。

修改后的压缩代码：

htmlMinifier.minify(wrappedBody, {
  collapseWhitespace: true,
  removeTagWhitespace: true,
  minifyCSS: true,
  // 匹配<pre>标签及其内部所有内容，跳过解析
  ignoreCustomFragments: [/<pre>[\s\S]*?<\/pre>/gi]
})

注意：这种方法需要确保用户输入中不会包含</pre>字符串，否则会破坏正则匹配的范围，导致部分内容被错误解析。

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