使用JavaScript atob函数无法正确解码Base64字符串求助

你遇到的问题核心有两个：未处理Socket.IO的协议封装，以及用错误方式解码二进制类型的Base64数据，以下是具体解决步骤：

1. 先处理Socket.IO的消息封装 #

对方提供的是Socket.IO v4的WebSocket地址（EIO=4是Socket.IO的协议版本标识），你收到的消息并非纯Base64数据，而是Socket.IO框架封装后的协议帧，直接用原生WebSocket接收解码会忽略帧格式规则，导致解析错误。

• 优先方案：使用官方Socket.IO客户端库
  用socket.io-client连接，它会自动处理帧解析、心跳、重连等逻辑，无需手动处理协议头：

  import { io } from 'socket.io-client';
  
  const socket = io('ws://domain.com', {
    transports: ['websocket'],
    query: { EIO: 4 }
  });
  
  socket.on('message', (data) => {
    // 此处拿到的data才是对方实际发送的Base64编码数据
    processEncodedData(data);
  });
  

• 备选：原生WebSocket手动处理帧格式
  Socket.IO v4的WebSocket帧通常以数字开头（比如0表示连接成功、42表示事件消息），需要先剥离这些前缀字符，再处理剩余的Base64内容。

2. 正确解码Base64到二进制数据 #

atob()返回的是DOMString，会把二进制字节当作UTF-16编码解析，但你解码后的内容是二进制序列化数据（从结果里的userKey、version等字段判断，大概率是Protobuf或类似二进制协议），直接转字符串必然出现乱码。

正确解码流程：

1. 将Base64字符串转换为Uint8Array二进制数组：

   function base64ToUint8Array(base64) {
     const binaryString = atob(base64);
     const bytes = new Uint8Array(binaryString.length);
     for (let i = 0; i < binaryString.length; i++) {
       bytes[i] = binaryString.charCodeAt(i);
     }
     return bytes;
   }
   
   const encodedData = 'h6d1c2VyS2V50Rqdom5v0wAAAYSBGgjtp3ZlcnNpb26mMS4xMy4wqXNlc3Npb25JZLAxNjY4NjEzMDI0NDM0NDM0o3NpZ6Cmc3luY0lkAKRib2R5gad1c2VyS2V50Rqd';
   const binaryData = base64ToUint8Array(encodedData);
   

2. 解析二进制数据：
   这是结构化的二进制协议，必须拿到对方提供的协议定义文件（比如Protobuf的.proto文件），再用对应库解析：
   • 若为Protobuf，用protobufjs加载定义文件后解析：

     import { load } from 'protobufjs';
     
     async function parseProtobufData(bytes) {
       const root = await load('your-proto-file.proto');
       const MessageType = root.lookupType('YourMessageType');
       const message = MessageType.decode(bytes);
       console.log(message.toJSON());
     }
     
     parseProtobufData(binaryData);
     

   • 若为自定义二进制协议，需对方提供字段偏移、类型定义，手动解析Uint8Array。

3. 额外验证 #

可将收到的Base64字符串转为十六进制（用本地工具或离线转换脚本），结合对方的协议文档验证字段匹配情况，排除Base64本身的编码错误。

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