由于有问题的 405 错误而禁用 CORS

Posted

技术标签:

【中文标题】由于有问题的 405 错误而禁用 CORS【英文标题】:Disable CORS due to problematic 405 errors 【发布时间】:2018-11-17 04:38:18 【问题描述】:

背景:

我创建了一个基于精简的 API,目前在本地域运行,例如 localhost/api

我有一个使用 ionic 框架(基于 angular)的移动应用程序,并且有以下代码使用 httpClient 作为 http:

let accessurl = this.general.apiURL + '/v2/update/status/' + this.machineToChange;
    const headers = new HttpHeaders()
      .set('Authorization', 'Bearer: ' + this.general.apiKey);
    this.http.put(accessurl, 
      statusFuelled: 1
    ,  headers: headers ).subscribe(result => 
      console.log(JSON.stringify(result));
    , err => 
      console.log(JSON.stringify(err));
    );

我已经尝试了所有我能找到的让超薄框架禁用 cors 的堆栈溢出问题,这里只是几个:

$app->options('/update/status/machineNo', function ($request, $response) 
  header("Access-Control-Allow-Origin: $_SERVER['HTTP_ORIGIN']");
  header('Access-Control-Allow-Credentials: true');
  header('Access-Control-Max-Age: 86400');    // cache for 1 day
  return $response->withStatus(200);
);

或者:

//http://***.com/questions/18382740/cors-not-working-php
  if (isset($_SERVER['HTTP_ORIGIN'])) 
      header("Access-Control-Allow-Origin: $_SERVER['HTTP_ORIGIN']");
      header('Access-Control-Allow-Credentials: true');
      header('Access-Control-Max-Age: 86400');    // cache for 1 day
  

  // Access-Control headers are received during OPTIONS requests
  if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') 

      if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
          header("Access-Control-Allow-Methods: GET, POST, PUT, OPTIONS");

      if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
          header("Access-Control-Allow-Headers:        $_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']");

      exit(0);
  

或者:

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, PATCH, PUT, DELETE, OPTIONS');
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token');
header('Content-Type: application/json');

或者在.HTACCESS中:

Header add Access-Control-Allow-Origin "*"
Header add Access-Control-Allow-Methods: "GET,POST,OPTIONS,DELETE,PUT"
Header add Access-Control-Allow-Headers: Content-Type

还有更多使用 composer 的中间件。

我还从Slim Website 运行了代码,但没有成功。

没有工作,这给我带来了很多麻烦,所以我只想永久禁用 CORS,因为它弊大于利。

我不知道问题出在哪里,错误的 httpClient 请求或 CORS 像平常一样痛苦。

如果有人可以帮忙,请告诉我。

由于服务器限制,我正在运行 PHP 5.6,所以像 tuupola/cors 这样的中间件由于是 PHP

一些错误:

Safari 抛出:加载资源失败:预检响应不成功

Chrome 抛出:对预检请求的响应未通过访问控制检查:请求的资源上不存在“Access-Control-Allow-Origin”标头。因此,Origin 'http://localhost:8100' 不允许访问。响应的 HTTP 状态代码为 405。

Chrome 也会抛出:OPTIONS http://localhost/api/v2/update/status/ID 405(不允许的方法)

【问题讨论】:

Htaccess 明显缺失 header('Content-Type: application/json'); Access-Control-Allow-Headers: Content-Type 嗨 Swoox,Content-Type 标头在完成成功或不成功的请求时发送,使用 $response->withStatus(200)->withHeader("Content-Type","application/json"); 所以我假设你在其他地方不需要它 你在 htaccess 中需要这个:Access-Control-Allow-Headers: Content-Type 不要像我的系统管理员那么固执,我跟他说了 5 次,然后勉强做到了。 我已经添加了 Swoox 但仍然没有运气,chrome 正在抱怨“Access-Control-Allow-Origin”标头,所以我猜这就是问题所在。 查看大安的答案。 【参考方案1】:

CodeKit 是 CORS 无法正常工作的问题。当直接通过 MAMP 运行时,所有请求都正常返回,但是当通过 CodeKit 服务器发送相同的请求时,CORS 中间件不起作用。

我相信 Daan 的回答更适合其他有此问题的人,因此将其标记为正确。

【讨论】:

【参考方案2】:

发送带有响应的标头:

return $response
        ->withHeader('Access-Control-Allow-Origin', '*')
        ->withHeader('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, Accept, Origin, Authorization')
        ->withHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, PATCH, OPTIONS');

另请参阅纤薄文档:https://www.slimframework.com/docs/v3/cookbook/enable-cors.html

【讨论】:

嗨,Daan,我已将以下代码添加到响应中,但仍然收到相同的错误,我还浏览了文档并添加了它所声明的内容,但仍然没有成功。似乎根本没有解决方案... @MatthewM 你的堆栈看起来怎么样?是 apache+modphp 还是 nginx+php-fpm 等……它在负载均衡器后面吗?不要禁用 CORS,只需了解如何正确配置网络服务器。你不会因为钥匙坏了就把锁扔到门外。 我相信它是没有负载平衡器的 Apache+modphp,我使用 MAMP 来托管本地版本的 API,这也是应用程序所指向的,默认配置。 使用 curl 向您的 API 端点发出 OPTIONS 请求,然后向我们显示响应标头。 抱歉延迟@emix,我对CURL不太熟悉,因为我通常使用邮递员,所以正常put请求的响应是the following headers。但是,选项请求仅包含以下标头:Accept-Ranges、Connection、Content-Length 和 Date。

以上是关于由于有问题的 405 错误而禁用 CORS的主要内容,如果未能解决你的问题,请参考以下文章

VB.NET Web API CORS PUT 预检 405 错误

错误 405 - IIS Express 10 不允许使用 CORS for Web API 的方法

Angular 7:发送 post 请求给出错误 405(不允许的方法)

WebApi 2.2 + Chrome = CORS 405 错误

CORS 预检的响应是 405(不允许的方法)错误

CORS自定义程序不起作用405方法不允许