Angular 5 HttpClient如何发送Protobuf原始二进制POST请求？

当然支持发送未编码的原始请求体！你遇到的问题是因为Angular的HttpClient默认会把非Blob/ArrayBuffer类型的请求体（比如Uint8Array）序列化成JSON，这才导致服务器收到了那个数组形式的JSON字符串。下面给你两种可行的解决方案：

方法一：转换为Blob发送（最简便） #

直接把你的Uint8Array转换成Blob，同时设置正确的Content-Type请求头，这样HttpClient就会直接发送原始二进制数据，不会做JSON编码：

import { HttpClient, HttpHeaders } from '@angular/common/http';
// 假设你的Protobuf生成代码已经导入

// 构建并编码Protobuf消息
const message = LoginRequest.fromObject({ 
  code: code, 
  username: username, 
  password: password 
});
const buffer: Uint8Array = LoginRequest.encode(message).finish();

// 转换为Blob，指定Protobuf的MIME类型
const protoBlob = new Blob([buffer], { type: 'application/protobuf' });

// 发送请求
this.http.post('https://api.myserver.com', protoBlob, {
  headers: new HttpHeaders({
    'Content-Type': 'application/protobuf' // 确保和服务器期望的类型一致
  }),
  responseType: 'arraybuffer' // 如果服务器返回Protobuf，用这个类型接收
}).subscribe(
  (response) => {
    // 处理响应：把ArrayBuffer转成Uint8Array再解码
    const responseBuffer = new Uint8Array(response);
    const loginResponse = LoginResponse.decode(responseBuffer);
    // 后续逻辑...
  },
  (error) => {
    // 错误处理
  }
);

方法二：使用HttpRequest直接发送（更灵活） #

如果需要对请求有更精细的控制，可以直接构建HttpRequest对象，通过HttpHandler发送，这种方式完全绕过默认的JSON序列化：

import { HttpClient, HttpRequest, HttpHandler, HttpHeaders } from '@angular/common/http';

// 构建并编码Protobuf消息
const message = LoginRequest.fromObject({ 
  code: code, 
  username: username, 
  password: password 
});
const buffer: Uint8Array = LoginRequest.encode(message).finish();

// 构建原始请求
const protoRequest = new HttpRequest('POST', 'https://api.myserver.com', buffer, {
  headers: new HttpHeaders({
    'Content-Type': 'application/protobuf'
  }),
  responseType: 'arraybuffer'
});

// 通过HttpHandler发送
this.httpHandler.handle(protoRequest).subscribe(
  (event) => {
    if (event.type === 4) { // 响应完成事件
      const responseBuffer = new Uint8Array(event.body);
      const loginResponse = LoginResponse.decode(responseBuffer);
      // 后续逻辑...
    }
  },
  (error) => {
    // 错误处理
  }
);

关键说明 #

• 为什么之前的代码失效？：HttpClient默认会把Uint8Array当作普通JavaScript数组，使用JSON序列化器转成字符串，所以服务器收到的是数组的JSON表示，而非原始二进制。
• Content-Type设置：一定要和服务器约定好，常见的Protobuf类型是application/protobuf，如果服务器要求application/octet-stream也可以替换。
• 响应处理：如果服务器返回的也是Protobuf，记得把responseType设为arraybuffer，再转成Uint8Array后解码。

内容的提问来源于stack exchange，提问作者Martin Fink