如何在Node与浏览器环境中正确解码字符串为可读格式？

你遇到的问题本质是字符串同时包含两种编码异常：一部分是UTF-8字节被错误解码为Latin-1（比如Señor实际是Señor的UTF-8字节误解析结果），另一部分是URI编码的字符（比如%3A对应冒号），直接混用escape/decodeURIComponent会因为编码不匹配报错或结果错误。

以下是适用于Node.js和浏览器的统一解决方案：

核心思路 #

1. 先把整个字符串拆解为原始字节：
   • 对URI编码部分（%XX）直接解析为对应的字节
   • 对普通字符（比如Ã、±）按Latin-1编码转成字节（因为它们本身就是UTF-8字节误解析的产物，转成Latin-1字节就能还原原始UTF-8序列）
2. 用UTF-8解码字节数组，得到正确的文本
3. 按需处理控制字符到对应符号（比如你的例子中%06%88转成♠）

实现代码 #

// 解析混合编码字符串为原始字节数组
function parseToRawBytes(str) {
  const byteList = [];
  let index = 0;
  const strLen = str.length;

  while (index < strLen) {
    // 处理URI编码片段 %XX
    if (str[index] === '%' && index + 2 < strLen) {
      const hexStr = str.slice(index + 1, index + 3);
      const byteValue = parseInt(hexStr, 16);
      byteList.push(byteValue);
      index += 3;
    } else {
      // 非URI编码字符按Latin-1转字节（还原UTF-8原始字节）
      byteList.push(str.charCodeAt(index));
      index += 1;
    }
  }

  return new Uint8Array(byteList);
}

// 最终解码函数
function decodeMixedString(str) {
  const rawBytes = parseToRawBytes(str);
  // 用UTF-8解码，fatal: false避免非法序列抛出错误
  let decodedStr = new TextDecoder('utf-8', { fatal: false }).decode(rawBytes);
  
  // 自定义控制字符映射，根据你的需求调整
  decodedStr = decodedStr.replace(/\x06\x88/g, '♠');
  
  return decodedStr;
}

// 测试示例
const inputStr = 'Señor and salvación and Number%3A 1234%3B %06%88';
const expectedOutput = 'Señor and salvación and Number: 1234; ♠';

console.log(decodeMixedString(inputStr) === expectedOutput); // 输出true

关键说明 #

• TextDecoder/TextEncoder：这是浏览器和Node.js（v11+）原生支持的API，比escape/unescape、decodeURIComponent更可靠，能精准控制编码解码逻辑
• Latin-1转字节：解决UTF-8字节被误解析为Latin-1文本的问题，还原原始UTF-8字节序列
• URI编码手动解析：避免decodeURIComponent因非法UTF-8序列抛出URIError，确保所有编码片段都能被处理
• 控制字符映射：可根据你的需求扩展映射规则，处理二进制文件中可能出现的特殊控制字符

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