在<script>块中的JavaScript字符串文字中转义HTML实体

Question

一方面,如果我有

<script>
var s = 'Hello </script>';
console.log(s);
</script>

浏览器将<script>提前终止块,基本上我搞砸了页面.

另一方面,字符串的值可能来自用户(例如,通过先前提交的表单,现在字符串最终<script>作为文字插入到块中),因此您可以期待该字符串中的任何内容,包括恶意形成的标签.现在,如果我在生成页面时使用htmlentities()转义字符串文字,则s的值将按字面包含转义的实体,即s将输出

Hello &lt;/script&gt;

在这种情况下,这不是所希望的行为.

在<script>块中正确转义JS字符串的一种方法是,如果它遵循左尖括号,或者只是总是转义斜杠,则转义斜杠,即

var s = 'Hello <\/script>';

这似乎工作正常.

然后是HTML事件处理程序中的JS代码问题,也可以很容易地解决,例如

<div onClick="alert('Hello ">')"></div>

最初看起来有效但在大多数(或所有？)浏览器中断开.这显然需要完整的HTML实体编码.

我的问题是:正确覆盖上述所有情况的最佳/标准做法是什么 - 即脚本块中的JS,事件处理程序中的JS - 如果您的JS代码可以部分地在服务器端生成并且可能包含恶意数据？

Answer 1

以下字符可能会干扰HTML或Javascript解析器,应该在字符串文字中进行转义:<, >, ", ', \,和&.

在使用转义字符的脚本块中,正如您所发现的那样有效.连接方法(</scr' + 'ipt>')可能难以阅读.

var s = 'Hello <\/script>';

对于HTML中的内联Javascript,您可以使用实体:

<div onClick="alert('Hello &quot;>')">click me</div>

在<script>块和内联Javascript 中工作的方法是\uxxxx,xxxx十六进制字符代码在哪里.

HTML:

<div onClick="alert('Hello \u0022>')">click me</div>

<script>
    var s = 'Hello \u003c/script\u003e';
alert( s );
</script>