当响应代码未硬编码时，预检请求失败 CORS（没有 HTTP 请求 OK 状态）答案

【问题标题】：Preflight Request fails CORS (does not have HTTP Request OK status ) when response code isn't hardcoded当响应代码未硬编码时，预检请求失败 CORS（没有 HTTP 请求 OK 状态）
【发布时间】：2021-03-29 07:41:53
【问题描述】：

我正在使用一个简单的 PHP 后端和 Angular 前端。我在使用 CORS 时遇到了麻烦。我已经设置了正确的标题并且仍然面临 CORS 块。我尝试了很多东西并注意到以下内容。

由于我预计会有很多 PHP 文件，因此我希望响应之间保持一致。因此，我创建了一个名为 httpHelper.php 的 PHP 文件，并添加了一个函数来设置标题、响应状态代码并返回响应。

以下是httpHelper.php

<?php

function json_response($code = 200, $message = null)
{
    header_remove();
    http_response_code($code);
    header('Content-Type: application/json');
    header("Access-Control-Allow-Origin: *");
    header("Access-Control-Allow-Methods: PUT, GET, POST");
    header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
    
    return "{ \"detail\":". $message."}";
}

对这个函数的调用将来自另一个 PHP 文件，例如，

echo json_response(200, json_encode(FALSE));

我遇到了 CORS 块..

访问 XMLHttpRequest 在来自原点的“http://localhost:8080/checkFeedbackStatus.php” “http://localhost:4200”已被 CORS 策略阻止：响应预检请求未通过访问控制检查：它没有 HTTP 正常状态。

但是当相同的 httpHelper.php 被编码为常量状态码时，我没有问题。

<?php

function json_response($code = 200, $message = null)
{
    header_remove();
    http_response_code(200);
    header('Content-Type: application/json');
    header("Access-Control-Allow-Origin: *");
    header("Access-Control-Allow-Methods: PUT, GET, POST");
    header("Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept");
    
    return "{ \"detail\":". $message."}";
}

我想知道我错过了什么，哪里出了问题。

顺便说一下，请求类型是HTTP POST

【问题讨论】：

请求类型不是 POST，而是 OPTIONS，因为错误告诉您它是预检请求。它还告诉您 ti“没有 ok 状态”，所以首先要做的是找出确实有什么样的状态。解决 Forbidden 错误的方式与解决内部服务器错误的方式非常不同。查看浏览器开发者工具的网络标签。
@Quentin 是的，这就是问题所在。我正在为除 post 之外的所有请求方法发送 405 响应代码。其中包括选项。我不知道飞行前是选项类型。非常感谢。

标签： php cors backend

【解决方案1】：

在您使用实际域之前，它不会起作用，它目前是针对 CORS 标头的。可能有几种方法可以让它发挥作用，但我只知道其中两种。

在 Xampp 中使用代理
使用 Ngrok，这将为您提供公共域以在 localhost 上环回。

如果你使用的是xampp，你可以编辑httpd.conf，在文件末尾添加代理，然后重启apache服务

ProxyPass /checkStatus http://localhost:8080/checkFeedbackStatus.php
ProxyPassReverse /checkStatus http://localhost:8080/checkFeedbackStatus.php

对于 Ngrok，您可以阅读文档 here 设置好 ngrok 后，您可以使用任何端口将 ngrok 用作公共域

ngrok http 8080

【讨论】：