Question

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

API使用PHP，终点等已经过测试并且运行正常。

我得到的问题是，每次设置GET授权标头时，我都会在Chrome控制台中收到以下错误消息：

Response for preflight has invalid HTTP status code 404

我已经设置了我的API标头，以允许从远程来源访问以下内容：

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");

是的我正在localhost上运行我的角度项目，我有一个POST请求，没有 Authoriazation 标头设置，它运行正常，我还删除了授权来自我的GET请求的标题，然后它工作正常（但该终点需要Authorization标头将我的JWT发送到我的API）

我做错了吗？我应该设置其他标题，我已经在Postman中测试了端点，一切正常。

修改

我还编辑了我的Hosts文件，指向我的本地，还有一个用于API，这是我本地计算机上的IP ....

所以我的起源是：website.com 我的API：api.website.com

我改变了我的意见 Access-Control-Allow-Origin：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请求所需的标题

Answer 2

如果您拥有对响应服务器的控制权，最简单的方法是为以下内容添加响应标头：

Access-Control-Allow-Origin: *

这将允许跨域Ajax。在PHP中，您将要修改响应，如下所示：

<?php header('Access-Control-Allow-Origin: *'); ?>

您可以将Header set Access-Control-Allow-Origin *设置放在Apache配置或htaccess文件中。它就像一个魅力。

从评论中，这是一个重要的注意事项：通配符将允许任何域向您的主机发送请求。我建议用您将在其上运行脚本的特定域替换星号。当你要活着的时候。

参考Origin is not allowed by Access-Control-Allow-Origin

Angular2 http.get预检问题

2 个答案: