Angular与Spring Boot删除操作报Method Not Allowed错误的排查与解决

1. 浏览器直接访问URL报错的原因 #

浏览器地址栏输入URL时，默认发送GET请求，但你的后端删除接口用@DeleteMapping("/delete/{JMBAG}")注解，只接受DELETE请求，所以服务器返回405（方法不允许）。这是正常现象，浏览器地址栏无法直接发送DELETE请求，要测试DELETE接口请用Postman、curl这类工具。

2. 前端Angular调用可能存在的问题及修复 #

问题1：HTTP请求未实际触发 #

Angular的HttpClient.delete()返回Observable对象，必须订阅才会真正发送请求。你当前的student.component.ts代码仅调用了服务方法，但未订阅，导致请求根本没发出去。

修复代码：

// student.component.ts
deleteStudent(jmbag: string) : void {
    this.studentService.deleteStudent(jmbag).subscribe({
        next: () => {
            // 可添加删除成功后的逻辑，比如刷新学生列表
            console.log(`学生${jmbag}删除成功`);
        },
        error: (error) => {
            console.error('删除失败:', error);
        }
    });
}

问题2：路径匹配检查 #

确认student.service.ts中的this.apiUrl值为http://localhost:8080/api，这样拼接后的URL是http://localhost:8080/api/delete/{jmbag}，与后端@RequestMapping("api") + @DeleteMapping("/delete/{JMBAG}")的路径完全匹配。

问题3：HTTP拦截器干扰 #

检查Angular项目中是否存在HTTP拦截器，部分拦截器可能误将DELETE请求修改为GET请求，引发405错误。可暂时禁用拦截器测试请求是否正常。

3. 后端接口验证 #

用Postman或curl发送DELETE请求验证后端接口是否正常：

# curl命令示例，替换为实际JMBAG值
curl -X DELETE http://localhost:8080/api/delete/12345678

如果返回200（删除成功）或404（学生不存在），说明后端接口无问题，问题集中在前端。

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