为啥我收到 XMLHttpRequest cannot load - Preflight response is not successful 仅使用 Delete 方法出错？

Posted 2023-02-27

【中文标题】为啥我收到 XMLHttpRequest cannot load - Preflight response is not successful 仅使用 Delete 方法出错？

【英文标题】：Why I am getting XMLHttpRequest cannot load - Preflight response is not successful Error with Delete method only?为什么我收到 XMLHttpRequest cannot load - Preflight response is not successful 仅使用 Delete 方法出错？

【发布时间】：2018-07-24 02:35:36

【问题描述】：

php资源文件：

<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");
header("Access-Control-Allow-Methods: POST, DELETE, OPTIONS, GET, PUT");
header("Access-Control-Max-Age: 3600");
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");

require_once ("center_service.php");

$data = json_decode(file_get_contents("php://input"));
$method = $_SERVER['REQUEST_METHOD'];

if (!isset($routes[2])) 
    $sql = "SELECT * FROM centers;";
    Center::readCenter($sql);
 else if (isset($routes[2]) && is_numeric($routes[2]) && $method === "GET") 
    $sql = "SELECT * FROM centers WHERE id='$routes[2]';";
    Center::readCenter($sql);
 else if (isset($routes[2]) && is_numeric($routes[2]) && $method === "DELETE") 
    Center::deleteCenter($routes[2]);

else 
    header('HTTP/1.0 404 Not Found');
    require '404.php';

Angular 服务文件：

readonly ROOT_URL = 'http://localhost/ecdweb/api/index.php';

getCenters(): Observable<Center[]> 
  return this.http.get<Center[]>(this.ROOT_URL + '/centers');

deleteCenter(id: number): Observable<> 
  return this.http.delete(this.ROOT_URL + '/centers/' + id);

get 方法正在工作并返回结果，但它不适用于 delete 方法。如果是因为 CORS，那么为什么 get 方法有效？

控制台日志：

网络：

相关问题：

“XMLHttpRequest cannot load file:///… Preflight response is not successful” error

Preflight response is not successful

Express server and Axios CORS Preflight response is not successful

【问题讨论】：

您对 Access-Control-Allow-Methods 标头的修改是否仍然存在问题？ (developer.mozilla.org/en-US/docs/Web/HTTP/Headers/…)

@PierreMallet 不确定是什么导致了问题。我已经在Access-Control-Allow-Methods 中包含了所有方法，但它只适用于 GET 而不是 DELETE。

【参考方案1】：

好的，我认为这是因为如果方法与 GET 或 DELETE 不同，则会返回 404。因此，当处理预检请求（动词 OPTIONS）时，您会返回 404。

这是一个 PHP 中的 CORS 示例 (here)

主题是：

这里的重点是 API 脚本需要识别何时收到初始 OPTIONS 请求，并在这种情况下返回适当的访问控制标头（仅此而已）。在此之后，浏览器会发起第二个请求，在这个请求中真正的工作已经完成。

在你的具体情况下，我认为代码应该是：

if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') 
    header('Access-Control-Allow-Origin: *');
    header('Access-Control-Allow-Headers: X-Requested-With, content-type, access-control-allow-origin, access-control-allow-methods, access-control-allow-headers');
    exit;

如果您想在全局范围内启用 cors，您可以添加

header('Access-Control-Allow-Origin: *');

在你的 php 脚本中 (see here)

【讨论】：

我在 http post 请求标头上插入但不工作。示例链接也失效了