Angular向PHP服务端POST数据时出现405 Method Not Allowed错误

这个问题的核心原因是浏览器的CORS预检机制在起作用，而Postman作为测试工具不受浏览器的CORS策略约束，所以能正常发起请求。

为什么会触发这个错误？ #

当你的Angular应用和PHP服务端不在同一域名下（比如Angular运行在localhost:4200，服务端在angularslim.local），且你的POST请求属于「非简单请求」（比如使用了Content-Type: application/json，或者携带了自定义请求头），浏览器会自动先发送一个OPTIONS预检请求，询问服务端是否允许后续的POST请求。如果你的PHP服务端没有处理这个OPTIONS请求，就会返回405错误，浏览器也就会直接阻止后续的POST请求。

解决方案：在PHP服务端处理OPTIONS预检请求 #

你需要在PHP服务端的入口文件（比如index.php）中添加CORS相关的响应头，专门处理OPTIONS请求，同时配置必要的跨域参数：

// 优先处理OPTIONS预检请求
if ($_SERVER['REQUEST_METHOD'] === 'OPTIONS') {
    // 允许你的Angular应用域名访问，生产环境建议指定具体域名，不要用*
    header("Access-Control-Allow-Origin: http://localhost:4200");
    // 允许的HTTP方法，根据你的业务需求调整
    header("Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE");
    // 允许的请求头，如果你Angular请求带了自定义头，要在这里添加对应字段
    header("Access-Control-Allow-Headers: Content-Type, Authorization");
    // 设置预检请求的缓存时间，减少重复OPTIONS请求的次数
    header("Access-Control-Max-Age: 86400");
    // 处理完OPTIONS请求后直接退出，无需执行后续业务逻辑
    exit();
}

// 为正常业务请求添加CORS头
header("Access-Control-Allow-Origin: http://localhost:4200");
header("Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE");
header("Access-Control-Allow-Headers: Content-Type, Authorization");

额外检查点 #

• 确认Angular请求的Content-Type已经包含在服务端的Access-Control-Allow-Headers中，比如如果使用了application/json，必须明确添加这个头。
• 如果你用Angular的HttpClient发送请求，检查请求配置中是否有未被服务端允许的自定义头，如有需要在服务端配置中补充。
• 生产环境不要使用Access-Control-Allow-Origin: *，指定具体的前端域名会更安全。

完成以上配置后，浏览器的OPTIONS预检请求会得到正常响应，后续的POST请求就能顺利发送到服务端了。

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