javascript - Angular2 http.get 预检问题

Question

我目前正在使用 angular2 的 HTTP 从我的自定义 api 发布和获取数据。

API 在 PHP 中，端点等已经过测试并且工作正常。

我遇到的问题是每当我设置 GET 授权 header 时，我都会在 Chrome 控制台中收到以下错误消息:

Response for preflight has invalid HTTP status code 404

我已将我的 API header 设置为允许使用以下内容从远程来源进行访问:

header("Access-Control-Allow-Origin: http://localhost:3000");
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Methods: GET, POST, PUT, PATCH ,DELETE");
header("Access-Control-Allow-Headers: Authorization, Content-Type");

是的，我在本地主机上运行我的 Angular 项目，我有一个 POST 请求，该请求在没有设置 Authoriazation header 的情况下发生并且工作正常，我还删除了 Authorization来 self 的 GET 请求的 header 然后它工作正常(但该端点需要授权 header 将我的 JWT 发送到我的 API)

我做错了什么吗？我是否应该设置其他 header ，我已经在 Postman 中测试了端点并且一切正常。

编辑

我还编辑了我的 Hosts 文件，让一个 tld 指向我的本地，还有一个用于 API，它是我本地机器上的一个 IP....

所以我的来源是:website.com我的API:api.website.com

我改变了 访问控制允许来源:http://website.com:3000

Answer 1

我发现了问题。

我的路由器只接受 $_POST 和 $_GET 方法，

Chrome 在发送 POST 或 GET 之前发送一个 OPTIONS 方法来确认来源。

现在我刚刚添加:

if($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
    header("Access-Control-Allow-Origin: *");
    header("Access-Control-Allow-Methods:GET,POST,PUT,DELETE,OPTIONS");
    header("Access-Control-Allow-Headers: Authorization, Content-Type,Accept, Origin");exit;
}

所以现在当一个 OPTION 请求通过时，它只返回允许我的 POST 和 GET 请求所需的 header