CSHTML文件中HTML与JavaScript的UTF-8字符串转换差异问题

在.cshtml文件中，HTML代码与JavaScript代码对UTF-8字符串的处理存在差异，导致无法用JavaScript字符串过滤HTML表格。举个例子：

原.cshtml代码：

@{
    string WaitText = "Payé";
}
 
<div>
    @WaitText
</div>
<script>
    @WaitText
</script>

在Firefox中运行后的渲染结果：

<div>
    Payé
</div>
<script>
    Pay&#xE9;
</script>

可以看到，HTML标签内的@WaitText正常显示为Payé，但<script>标签内的@WaitText被转成了HTML实体Payé，这会导致JavaScript无法识别为原始的UTF-8字符串，进而影响表格过滤逻辑。

解决方案 #

要解决这个问题，需要让Razor引擎在输出到<script>标签时，不将UTF-8特殊字符转成HTML实体。可以通过以下两种方式实现：

1. 使用Html.Raw配合Json.Encode
   将<script>内的@WaitText替换为@Html.Raw(Json.Encode(WaitText))，这样会把字符串序列化为合法的JavaScript字符串，同时保留原始UTF-8字符：

@{
    string WaitText = "Payé";
}
 
<div>
    @WaitText
</div>
<script>
    const waitText = @Html.Raw(Json.Encode(WaitText));
    console.log(waitText); // 输出 "Payé"
</script>

2. 直接输出未编码的原始字符串
   如果确定字符串中没有可能导致JS语法错误的字符（比如引号、换行），也可以直接用Html.Raw输出：

<script>
    const waitText = "@Html.Raw(WaitText)";
</script>

这种方式要注意字符串内的引号需要转义，否则会破坏JS语法。

原因说明 #

Razor引擎默认会对输出到HTML中的内容进行HTML编码，防止XSS攻击。但在<script>标签内，这种编码会把UTF-8特殊字符转成HTML实体，而JavaScript无法自动解析这些实体，因此需要手动指定输出未编码的合法JS字符串。

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