我想通过JavaScript函数将文本显示为HTML。如何在JavaScript中转义HTML特殊字符?有API吗?


当前回答

如果你已经在你的应用程序中使用模块,你可以使用escape-html模块。

import escapeHtml from 'escape-html';
const unsafeString = '<script>alert("XSS");</script>';
const safeString = escapeHtml(unsafeString);

其他回答

照章办事

OWASP建议“[e]除字母数字字符外,[您应该]转义所有ASCII值小于256的字符,使用&#xHH;格式(或命名实体,如果可用),以防止切换[一个]属性。

这里有一个函数可以做到这一点,并有一个用法示例:

不安全功能 return键unsafe replace(。 - [u0000 - u002F \ u003A \ u0040 u005B - u0060 \ u007B \ u00FF] / g, c => '&#' + (' 1000 +。’这是c . charCodeAt(+ 0)。切片(四)?” ) 的 querySelector(“div”)的文件。innerHTML = <span class= + escapeHTML(' faeclass ' onclick="alert " ("test") + > +。’” escapeHTML(“<脚本>alert”(“attributes检查员”)\u003C/脚本>' ”< /跨越> < div > < / div >

您应该亲自验证我提供的实体范围,以验证函数的安全性。你也可以使用这个正则表达式,它具有更好的可读性,应该涵盖相同的字符代码,但在我的浏览器中性能下降了10%:

/(?![0-9A-for-z])[\u0000-\u00FF]/g

找到一个更好的解决方案是很有趣的:

var escapeHTML = function(unsafe) {
  return unsafe.replace(/[&<"']/g, function(m) {
    switch (m) {
      case '&':
        return '&amp;';
      case '<':
        return '&lt;';
      case '"':
        return '&quot;';
      default:
        return '&#039;';
    }
  });
};

我没有解析>,因为它没有破坏结果中的XML/HTML代码。

以下是基准测试:http://jsperf.com/regexpairs 此外,我还创建了一个通用转义函数:http://jsperf.com/regexpairs2

函数escapeHtml (html) { var text = document.createTextNode(html); var p = document.createElement('p'); p.appendChild(文本); 返回p.innerHTML; } //在输入时转义并打印结果 document.querySelector(“输入”)。addEventListener('input', e => { console.clear (); console.log(escapeHtml(e.t target.value)); }); <输入风格= '宽度:90%;填充:6 px;占位符= ' & lt; b&gt; cool&lt; / b&gt; " >

你可以对字符串中的每个字符进行编码:

function encode(e){return e.replace(/[^]/g,function(e){return"&#"+e.charCodeAt(0)+";"})}

或者只关注主要角色(&,inebreaks, <, >, "和'),比如:

函数编码(r) { 返回r.replace (/ [\ x26 \ x0A \ < > "] / g函数(r){返回" & # + r.charCodeAt(0) +”;“}) } 测试。value=encode('如何编码\nonly html标签&<>\'" nice & fast!'); /************* * \x26是& &号(必须排在第一位), * \x0A为换行符, *************/ < textarea测试行id = =“9”关口= " 55 " > & # 119;& # 119;& # 119;& # 46;& # 87;& # 72;& # 65;& # 75;& # 46;& # 99;& # 111;& # 109;textarea > < /

试试这个,使用prototype.js库:

string.escapeHTML();

尝试演示