API返回JSON中的HTML字段：转义问题与最佳实践

假设某API返回如下JSON响应：

{"error":"","data":"xxx"}

其中xxx位置会返回HTML代码/页面。请问该HTML是否需要进行HTML转义或JSON转义？哪种转义更合适？该HTML是否可能破坏外层JSON？若可能，应如何避免？当前该场景的最佳实践是什么？

1. 转义类型选择 #

必须做JSON转义，HTML转义在这里完全没必要。

• JSON转义是为了让HTML里的特殊字符（比如双引号"、反斜杠\、换行符等）符合JSON字符串的语法规则，保证整个JSON结构合法可解析。
• HTML转义是给浏览器防XSS或显示纯文本用的，要是提前做了，前端拿到数据还得反转义才能正常渲染HTML，纯粹多此一举。

2. 是否可能破坏外层JSON？ #

当然可能。比如HTML里包含双引号，直接塞进data字段的话，原本的"data":"<div class="test">...</div>"会被JSON解析器错误识别为"data":"<div class="，后续内容全部乱套，直接导致JSON解析失败。另外反斜杠、换行、制表符这类控制字符也会打乱JSON的结构。

3. 避免破坏的方法 #

最靠谱的办法就是对HTML内容做标准JSON字符串转义，具体要处理这些情况：

• 把双引号"替换为\"
• 把反斜杠\替换为\\
• 换行、回车、制表符这类控制字符替换为对应的JSON转义序列（如\n、\r、\t）
• 非ASCII字符可以保留原样，或者转义为\uXXXX格式（后者兼容性更好）

别手动写替换逻辑，几乎所有编程语言都有现成的JSON序列化工具（比如Python的json.dumps()、JavaScript的JSON.stringify()），直接把HTML内容传入工具，就能自动完成所有正确转义，不会出错。

4. 最佳实践 #

• 后端生成JSON响应时，直接将HTML内容作为普通字符串传入JSON序列化工具，依赖工具完成转义，不要手动处理，避免遗漏特殊字符。
• 前端拿到JSON并解析后，直接将data字段的内容通过innerHTML插入DOM即可，不需要额外转义——后端已完成JSON转义，解析后得到的就是原始HTML内容。
• 若前端需要将HTML内容作为纯文本展示（而非渲染），才需要在前端做HTML转义，这属于前端展示逻辑，和后端的JSON响应无关。

内容的提问来源于stack exchange，提问作者peter.petrov