Angular 5动态POST请求报404错误，请求协助排查

嘿，我一眼就看出问题出在哪了——你动态传参时的请求体格式和手动传参的完全不一样，后端根本认不出来，所以返回了404。

问题根源 #

手动调用时，你传给后端的是数组对象结构：

{emp:[{"empId":8106, "name":"xxxxx"}]}

但动态传参时，你用JSON.stringify(val)把参数转成了字符串，最终请求体变成了：

{emp: "[{\"empId\":8106,\"name\":\"xxxxx\"}]"}

后端期望接收的是数组，结果收到了一串字符串，自然无法正确匹配接口，返回404也就不奇怪了。

修复方案 #

1. 移除不必要的JSON.stringify

Angular的HttpClient.post会自动帮你把JavaScript对象序列化为JSON格式的请求体，不需要手动转字符串。修改你的doPost方法：

doPost(val): Observable<any> {
  // 直接传入val，不用转字符串
  return this.http.post(this.URL + '/GetEmp', { emp: val });
}

2. 确保传入的val格式正确

要保证从下拉框拿到的pval和手动传参的格式一致——也就是数组类型。如果下拉框选中的是单个员工对象，记得把它包装成数组：

// 比如pval是{empId: 8106, name: "xxxxx"}，转成数组再传入
const postPayload = [pval];
this.configs.doPost(postPayload).subscribe(
  data => {this.post = data['org']},
  err => console.error(err),
  () => console.log('done loading employee' + this.post)
);

3. 验证请求体（可选但推荐）

打开浏览器开发者工具的「Network」标签，查看POST请求的「Payload」，确认它和手动传参时的格式完全一致：

• ✅ 正确格式：{"emp":[{"empId":8106,"name":"xxxxx"}]}
• ❌ 错误格式：{"emp":"[{\"empId\":8106,\"name\":\"xxxxx\"}]"}

额外提醒 #

• Angular的HttpClient默认会设置Content-Type: application/json，自动处理对象的序列化，不用手动操心。
• 也可以顺便检查下this.URL + '/GetEmp'生成的最终URL是否和手动请求时完全一致，避免因URL拼接错误导致404。

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