如何编码包含 HTML 字符的 JSON 字符串？答案

【问题标题】：How to encode a JSON string that includes HTML characters?如何编码包含 HTML 字符的 JSON 字符串？
【发布时间】：2017-06-08 11:22:06
【问题描述】：

我有一个 ASP.NET MVC 视图模型，我需要在页面加载时将其传递给 JavaScript 函数，而我目前正在这样做：

<script type="text/javascript">
    $(window).on("load", function () {
        myFunction(@Html.Raw(JsonConvert.SerializeObject(Model)));
    });
</script>

换句话说，我使用 JSON.NET 将模型序列化为 JSON，并将其（未编码）插入到我的 <script> 块中。

渲染时，脚本块最终看起来像：

<script type="text/javascript">
    $(window).on("load", function () {
        myFunction({"myProperty": "the property value"});
    });
</script>

在一定程度上可行。但是当我的模型包含一个字符串属性，其文本包含 HTML 标记 *，这些会使浏览器误以为 <script> 块已经结束，并且浏览器开始渲染嵌入在视图模型中的标记。

编辑：根据 cmets，只有在有 </script> 标签时才会发生这种情况。

例如：

<script type="text/javascript">
    $(window).on("load", function () {
        myFunction({"myProperty": "<script>...</script>"});
    });
</script>

我该如何解决这个问题？

【问题讨论】：

@Jamiec 你错了，浏览器会这样做。他们寻找</script> 并结束脚本。
@Jamiec：好吧，在这种情况下，IE11 和 Chrome 都表现出相同的行为。值得一提的是，JSON 片段非常大，而且问题文本是整个 HTML 文档，这可能与浏览器是否说“肯定有缺少结束标记或引号”有关。
@Jamiec 你是对的，它只在特定字符串</script> 上中断。示例代码错误。
我可以证明 (here) 您发布的代码没有任何问题。这就是为什么我们在回答代码问题之前要求minimal reproducible example - 所以我们很清楚问题是什么。从你的问题来看，没有问题。如果您证明是 </script> 标签导致了问题，那么我们有一个问题！
@GaryMcGill 你做了一个真正的 runnable 例子...你会发现它没有脚本标签也能正常工作

标签： javascript json asp.net-mvc encoding json.net

【解决方案1】：

这是一个已知问题。 PHP 的json_encode 函数将/ 编码为\/ 来避免这个问题。

一个简单的解决方案是编写自己的 JSON 编码包装函数，在 JSON 编码后将 </script> 替换为 <\/script>。

也许有更好的解决方案，但我对 asp.net 不熟悉。

【讨论】：