Javascript 什么'；解码包含特殊HTML实体的字符串的正确方法是什么？

假设我从服务请求中获得一些JSON，如下所示：

{
    "message": "We're unable to complete your request at this time."
}

 moduleDefinitions.filter('sanitize', ['$sce', function($sce) {
    return function(htmlCode) {
        var txt = document.createElement("textarea");
        txt.innerHTML = htmlCode;
        return $sce.trustAsHtml(txt.value);
    }
}]);

我不知道为什么那个字母是这样编码的（

'；

）；我只知道我想解码它

这里有一种使用jQuery的方法突然出现在我的脑海中：

function decodeHtml(html) {
    return $('<div>').html(html).text();
}

函数解码html（html）{
返回$（''）.html（html.text（）；
}

---

不过，这似乎（非常）令人讨厌。有什么更好的办法？有“正确”的方法吗？

这是我最喜欢的解码HTML字符的方法。使用此代码的优点是还保留了标记

function decodeHtml(html) {
    var txt = document.createElement("textarea");
    txt.innerHTML = html;
    return txt.value;
}

例如：

输入：

Entity:&nbsp;Bad attempt at XSS:<script>alert('new\nline?')</script><br>

Entity:XSS:alert的错误尝试（'new\nline？'）

输出：

Entity: Bad attempt at XSS:<script>alert('new\nline?')</script><br>

Entity:XSS:alert的错误尝试（'new\nline？'）

如果不想使用html/dom，可以使用regex。我还没有测试过这个；但大致如下：

function parseHtmlEntities(str) {
    return str.replace(/&#([0-9]{1,3});/gi, function(match, numStr) {
        var num = parseInt(numStr, 10); // read num as normal number
        return String.fromCharCode(num);
    });
}

[编辑] 注意：这只适用于数字html实体，而不适用于&oring；之类的东西

[编辑2]

---

修复了函数（一些拼写错误），在这里测试：

有JS函数要处理&#xxxx样式的实体：

---

不要使用DOM来执行此操作。使用DOM来解码HTML实体（如当前接受的答案中所建议的）会导致错误

对于根据HTML标准中的算法解码字符引用的健壮且确定的解决方案，请使用。自述：

他（代表“HTML实体”）是一个用JavaScript编写的健壮的HTML实体编码器/解码器。它支持、处理和其他边缘情况，具有广泛的测试套件，并且-与许多其他JavaScript解决方案相反-他可以很好地处理astral Unicode符号

以下是您如何使用它：

he.decode("We're unable to complete your request at this time.");
→ "We're unable to complete your request at this time."

免责声明：我是he图书馆的作者

---

有关更多信息，请参阅。

jQuery将为您编码和解码

函数htmlDecode（值）{
返回$（“”）.html（值）.text（）；
}
函数htmlEncode（值）{
返回$（''）.text（value.html（）；
}

$（文档）.ready（函数（）{
$（“#编码”）
.文本（htmlEncode（“”）；
$（“#已解码”）
.text（htmlDecode（“img src onerror='alert（0）'）；
});
htmlEncode（）结果：



HtmlCode（）结果：

这是一个非常好的答案。您可以将其用于以下角度：

{
    "message": "We're unable to complete your request at this time."
}

 moduleDefinitions.filter('sanitize', ['$sce', function($sce) {
    return function(htmlCode) {
        var txt = document.createElement("textarea");
        txt.innerHTML = htmlCode;
        return $sce.trustAsHtml(txt.value);
    }
}]);

---

\uu.unescape

实现您所需的功能

---

---

Ah，看起来基本上与我采用的方法相同，但没有jQuery依赖项（这很好）。不过，它看起来还是很粗糙吧？或者我应该完全适应它吗？哦，等等，我明白了：你正在使用

textarea

，特别是为了保留标记（如你所说），但HTML实体仍然被解码。相当聪明…这是可以接受的。这是解码HTML的最好方法。不传递任何标记，这与原始解决方案不同，原始解决方案解析（从而隐藏）标记。这是一个很好的技巧！我已经用了一段时间了，这是一个非

textarea

版本，而且这个版本要好得多。@Leonardo它从未附加到文档中。可能的重复：那

呢&和其他命名实体？这些仍然没有在这个实现中被解析。我已经评论过它们不会被解析的事实。要解析这些，您需要某种类型的hashmap（查找）。但是，如果该代码是自动生成的（比如说），那么它有可能总是返回数值。我只提供了一种纯js的方法（不使用DOM），不是说它解决了一般的问题，而是更具体的问题。不使用JSFIDLE，我只是对它做了一个小小的修改，
{1,3}
到
{1,4}
，它还允许使用更多字符，比如破折号（
&-\8211；
）。作为将来的参考，任何其他人都可以将其用于其他标记，例如正则表达式match
/（pattern）/gi中的
，不需要使用
i
后缀来忽略大小写，因为这只会匹配数字。除了davewoodhall的评论之外，我还使用了
/&#（[0-9]{1,4}）/g
作为参考，任何“元素”都可以在这里使用。在这里工作的textarea没有什么神奇之处。但也就是说，如果您已经在使用jQuery，我总是使用这种方法，并获得非常好的结果。我不同意。Textarea提供了其他元素（如div）不会提供的安全性。如果使用div而不是textarea，则输入中任何未编码的javascript都将在浏览器中呈现。textarea通过将输入视为文本来解决此问题。。。不像html那样。我还没有尝试过其他元素来了解它们的行为。我只是想进一步澄清：如果你真的希望html在转换后在浏览器中呈现，请将其包装在一个不是文本输入的元素中。我在NodeJS中，所以这是唯一可用的解决方案。我正在编写一个浏览器插件，从页面中获取内容，因此，基于dom的解决方案不是问题。这取决于上下文。“导致跨浏览器结果的差异”有多重要？在哪个浏览器中，结果可能会非常不同？你能给我举个确切的例子吗（你心目中最重要的是哪一个）？我不想使用过多的第三方库，所以我想先了解它。@TaufikNurRahmanda它指向的链接回答了这个问题。这个应该是正确的答案。比lodash和下划线更有效。它只是替换了一些编码字符-如果你有例如a，它将保持原样。e'不在列表中？这仅替换&；、和，“，`；和'；更新了lodash.unescape的链接，该链接可处理'，而此代码可能会回答此问题，提供有关如何和/或为什么解决此问题的附加上下文将提高答案的长期价值。谢谢。此函数在无法定义
文档的#gatsbyjs应用程序中运行良好在静态HTML构建期间。这是应该如何完成的！