Angular升级至13后HttpClient发送Map对象请求失效原因咨询

核心根因 #

该兼容性问题由 Angular 框架内部实现调整直接导致，与 RxJS、Node.js 版本变动无关；TypeScript 仅承担编译期类型校验职责，不会改变代码运行时的序列化行为。

• Angular 9.1 版本的 HttpClient 内部存在一层未写入公开文档的兼容逻辑：序列化请求体阶段会主动遍历检测对象属性的类型，遇到 Map、Set 这类特殊内置对象时，会先将其手动转换为普通键值对结构，再执行序列化流程，因此旧版本下携带Map字段的请求可以正常发送。
• Angular 12 版本重构 HttpClient 序列化模块时，移除了这层非公开的兼容逻辑，改为直接调用原生JSON.stringify处理请求体。而原生JSON.stringify的标准行为就是无法识别Map实例内部存储的键值对，默认会将Map序列化为空对象{}，与抓包看到的labels: {}异常现象完全匹配。

官方升级指南未提及该变更的原因 #

Angular 官方的破坏性变更（Breaking Change）公示范围，仅覆盖公共API承诺支持的功能行为。HttpClient 从正式发布至今，官方文档从未声明过支持直接序列化 Map、Set 这类特殊内置对象，旧版本的兼容效果属于内部实现带来的附带行为，不属于公开承诺的功能范畴，因此版本升级时没有将该调整列入变更清单。

可行修复方案 #

可根据业务场景选择对应方案修复：

• 单次请求手动转换：发起请求前将Map类型字段手动转为普通对象，针对Map<string, string[]>类型可直接使用Object.fromEntries()方法完成转换，存在嵌套Map结构时补充递归遍历逻辑即可，参考代码如下：

export interface MyObject {
  name: string;
  description: string;
  labels?: Map<string, string[]>;
}

// 完成字段转换后再发起请求
const requestPayload = {
  ...myObjectInstance,
  labels: myObjectInstance.labels ? Object.fromEntries(myObjectInstance.labels) : undefined
}
this.http.post<AlertRule>(url, requestPayload).pipe(
    catchError(this.errorHandler.handlerHTTPError)
);

• 全局统一处理：实现自定义HttpInterceptor，在拦截链路中统一遍历请求体，将所有Map、Set类型的属性值转换为普通POJO对象后，再构造新的请求传递给后续流程，无需在每个业务接口处单独修改逻辑。

内容的提问来源于stack exchange，提问作者Jonatan Lavado