解决 Java 与 JavaScript 之间特殊字符传递问题的终极方案

在前后端分离的 Web 开发中，JSON 数据传递是常见的交互方式。但当 JSON 中包含特殊字符（如四字节 Unicode 字符、引号等）时，很容易引发前端解析错误或安全漏洞。本文将深入探讨这一问题的解决方案。

问题背景

在 Java 与 JavaScript 之间传递 JSON 数据时，直接将 JSON 字符串嵌入到 JavaScript 代码中会遇到以下问题：

特殊字符（如双引号、换行符）会破坏 JavaScript 代码结构
四字节 Unicode 字符（如一些罕见汉字）在某些编码环境下会被截断或显示为乱码
XSS 攻击风险：未正确转义的 JSON 可能被注入恶意脚本

传统的解决方案是在后端对 JSON 字符串进行转义处理，但这种方式不仅繁琐，还容易遗漏某些特殊字符。

终极解决方案：使用 Base64 编码

更优雅的解决方案是使用 Base64 编码，将 JSON 数据转换为安全的 ASCII 字符串进行传递：

Java后端代码

java 复制代码

import java.nio.charset.StandardCharsets;
import java.util.Base64;

// 将Map转换为JSON字符串并进行Base64编码
String jsonString = JsonUtils.toString(map);
String encodedJson = Base64.getEncoder().encodeToString(jsonString.getBytes(StandardCharsets.UTF_8));
request.setAttribute("base64Json", encodedJson);

JavaScript前端代码

javascript 复制代码

var base64Json = '${base64Json}'; // 从服务器获取Base64编码的JSON

// 自定义Base64解码函数，确保正确处理UTF-8字符
function decodeBase64UTF8(base64) {
    // 首先使用atob()解码Base64字符串为二进制字符串
    const binaryStr = atob(base64);
    
    // 将二进制字符串转换为Uint8Array
    const bytes = new Uint8Array(binaryStr.length);
    for (let i = 0; i < binaryStr.length; i++) {
        bytes[i] = binaryStr.charCodeAt(i);
    }
    
    // 使用TextDecoder将字节数组解码为UTF-8字符串
    return new TextDecoder('utf-8').decode(bytes);
}
// 解码并解析JSON数据
var PAGE_DATA = {
    COMBOXDATAS: Ext.decode(decodeBase64UTF8(base64Json))
};

方案优势

完全避免特殊字符问题： Base64 编码只包含 A-Z、a-z、0-9、+、/、=，不包含任何会破坏 JavaScript代码的特殊字符
支持所有 Unicode 字符： 无论是两字节还是四字节的 Unicode 字符，都能被正确编码和解码
安全性提升： Base64 编码本质上是一种加密，能有效防止 XSS 攻击
简洁高效： 相比手动转义，Base64编码和解码的实现更加简洁，代码量更少

与传统方案的对比

传统方案通常需要在后端对 JSON 字符串进行复杂的转义处理：

java

// 传统方案：手动转义JSON字符串

java 复制代码

String escapedJson = jsonString
    .replace("\\", "\\\\")
    .replace("\"", "\\\"")
    .replace("\n", "\\n")
    .replace("\r", "\\r")
    .replace("\t", "\\t");
request.setAttribute("escapedJson", escapedJson);

这种方案存在以下问题：

需要处理各种特殊字符，容易遗漏
转义后的字符串体积可能增大
对于四字节 Unicode 字符仍然可能处理不当

实际应用建议

在后端生成 Base64 编码的 JSON 时，建议设置适当的缓存策略，避免重复编码相同的数据
前端解码函数可以封装为工具函数，方便在多个地方复用
如果需要兼容旧浏览器（如 IE9 及以下），可以引入第三方 Base64 库
对于特别大的 JSON 数据，考虑使用 gzip 压缩后再进行 Base64 编码，减少传输体积

通过使用 Base64 编码方案，我们可以彻底解决 Java 与 JavaScript 之间特殊字符传递的问题，同时提升系统的安全性和稳定性。