Spring Boot+AngularJS开发CRUD时遇POST请求不支持错误的解决建议

嘿，我一眼就瞅到问题核心啦——你的前端POST请求路径和后端Controller的接口映射完全不匹配，这才导致Spring Boot返回“POST方法不支持”的错误。

具体问题拆解 #

• 后端Spring Boot的TruckController里，POST接口的映射路径是@PostMapping(value="/posttruck")，也就是说这个接口的访问地址是/posttruck
• 但你前端AngularJS的create1方法中，发送POST请求的路径写的是"truck"，也就是请求的是/truck路径。而这个路径在后端只有@GetMapping的接口（用来获取所有卡车数据），根本没有处理POST请求的逻辑，所以Spring Boot自然会报错说POST方法不支持。

两种修复方案，选一个就行 #

方案一：修改前端请求路径，适配后端接口 #

把前端create1方法里的POST目标路径改成"/posttruck"，和后端的映射保持一致：

create1(truck: Truck): Promise<Truck> {
  return this.http
    .post("/posttruck", JSON.stringify(truck), {headers : this.headers})
    .toPromise()
    .then(res => res.json() as Truck)
    .catch(this.handleError);
}

方案二：修改后端Controller的映射路径，适配前端请求 #

把后端的@PostMapping路径改成/truck——不用担心和已有的@GetMapping("/truck")冲突，Spring Boot会根据请求方法（GET/POST）来区分不同的接口：

@PostMapping(value="/truck")
public Truck postTruck(@RequestBody Truck truck) {
  truckRepository.save(new Truck(truck.getName(), truck.getCapacity()));
  return truck;
}

额外要注意的小问题 #

除了当前的POST路径问题，我还发现一个潜在的坑：

• 前端的getTruckByName方法里，请求路径是/findbytruck/${name}，但后端对应的接口映射是@GetMapping(value="/getTruckByName/{name}，这俩路径也不匹配，等你调用这个查询接口的时候肯定也会报错，记得一起修改哦！

另外，还要确认你的请求头this.headers里包含了Content-Type: application/json，因为后端用了@RequestBody接收参数，必须要前端发送JSON格式的数据，不然会出现参数解析失败的问题。

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