Angular 中如何在 HTTP DELETE 请求内传递指定结构的 JSON 数组请求体

不少人用Angular发DELETE请求时会卡住，觉得DELETE方法没法带请求体，其实只要把参数配对，完全可以传固定结构的业务入参，根本不用改接口的现有入参规范。

核心实现步骤 #

• 首先严格按照业务要求构造固定结构的请求体，不对结构做任何调整：

// 固定结构的删除请求体，完全匹配业务要求格式
const deletePayload = {
  transactions: [
    {
      eventId: "21012200237172",
      productCode: "LC",
      id: "LC20110000090023"
    }
  ]
};

• 在注入HttpClient的服务类中，调用DELETE方法时，将请求体作为配置项的body字段传入：

constructor(private http: HttpClient) {}

deleteTransaction() {
  return this.http.delete(
    '/api/你的删除接口地址',
    {
      // 把构造好的固定结构请求体挂载到配置项的body属性
      body: deletePayload,
      // 按需配置请求头，确保接口能正确解析JSON格式的请求体
      headers: { 'Content-Type': 'application/json' }
    }
  );
}

常见踩坑说明 #

1. 参数顺序错误是最高发的问题：HttpClient.delete()的方法签名是delete<T>(url: string, options: {...})，第二个参数是请求配置项，不是直接传请求体，直接把业务对象当第二个参数传会导致请求体丢失、类型报错。
2. 如果使用的是Angular 5之前的低版本，需要确认XHR适配器的默认配置没有过滤DELETE方法的请求体，高版本Angular（5+）默认会正确序列化请求体，无需额外处理。
3. 如果接口经过Nginx等反向代理转发，需要确认代理配置没有主动截断DELETE请求携带的body内容，部分默认配置会对该方法的请求体做长度限制或直接丢弃。

注：该实现方式完全保留了业务要求的请求体结构，不需要做任何格式调整，也不需要修改后端接口的入参解析规则。

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