Angular $http 正在发送 OPTIONS 而不是 PUT/POST

2024-05-06

我正在尝试通过 PHP 后端更新/插入 MySQL 数据库中的数据。我正在使用 AngularJS 构建前端并使用$http用于与 REST API 通信的服务。

我的设置如下所示:

我通过 $httpProvider 设置标头:

 $httpProvider.defaults.withCredentials = true;
 $httpProvider.defaults.headers = {'Content-Type': 'application/json;charset=utf-8'};

调用后看起来像这样:

   return $http({
      url: url,
      method: "POST",
      data: campaign
    });

Chrome 中的开发控制台向我展示了这一点:

当我从 POST 更改为 PUT 时,我发送 OPTIONS 调用而不是 PUT。内容类型切换到content-type.

我的请求有效负载作为对象发送:

如何正确设置标题?


EDIT:

PHP 后端设置一些标头:

   $e->getResponse()
              ->getHeaders()
              ->addHeaderLine('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');

   $e->getResponse()
              ->getHeaders()
              ->addHeaderLine('Access-Control-Allow-Origin', '*');

是不是少了点什么?


好的,我已经解决了。

问题出在哪里?
DELETE、PUT 和 POST 的 CORS 工作流程如下:

它的作用是:

  1. 检查将要发出哪个请求
  2. 如果是 POST、PUT 或 DELETE
  3. 它首先发送一个 OPTION 请求,以检查发送请求的域是否与服务器的域相同。
  4. If not,它希望允许访问标头发送此请求

这里重要的是:OPTIONS 请求不发送凭据.

所以我的后端服务器不允许 PUT 请求。

解决方案:
将其放入.htaccess file

RewriteCond %{REQUEST_METHOD} OPTIONS
RewriteRule ^(.*)$ blank.php [QSA,L]
Header set Access-Control-Allow-Origin "http://sub.domain:3000"
Header always set Access-Control-Allow-Credentials "true"
Header always set Access-Control-Max-Age "1000"
Header always set Access-Control-Allow-Headers "X-Requested-With, Content-Type, Origin, Authorization, Accept, Client-Security-Token, Accept-Encoding"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"

在这之后,在 public 文件夹中创建一个名为 Blank.php 的空 .php 文件。

编辑:正如一位评论者指出的那样,您可以将此重写规则添加到您的 .htaccess 文件中,而不是创建空的 PHP 文件;

RewriteRule ^(.*)$ $1 [R=200,L,E=HTTP_ORIGIN:%{HTTP:ORIGIN}]]

澄清:

  1. 我已经发送了访问控制标头
  2. 它解决的是前两行,并且
  3. 来自带有端口的特定子域的 Access-Control-Allow-Origin

我能找到的最好的网站了解有关 CORS 的更多信息 http://www.html5rocks.com/en/tutorials/cors/?redirect_from_locale=de.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Angular $http 正在发送 OPTIONS 而不是 PUT/POST 的相关文章

随机推荐