CORS 预检通道未成功 - 客户端 - 服务器

Posted

技术标签:

【中文标题】CORS 预检通道未成功 - 客户端 - 服务器【英文标题】：CORS preflight channel did not succeed - client - server 【发布时间】：2015-12-01 03:19:25 【问题描述】：

我正在构建一个应用程序并使用下面的测试代码来测试 angular http.Post()

但是我收到一个奇怪的错误，我的预检没有成功。

客户端代码如下

<!DOCTYPE html>
<html>
<script src= "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="customersCtrl"> 

<ul>
     names 
</ul>

</div>

<script>
var app = angular.module('myApp', []);


app.controller('customersCtrl', function($scope, $http) 
  $http.post("http://ec2-52-3-54-45.compute-1.amazonaws.com/api/user/dogs",id:'hello word!')
  .success(function (response) 
    $scope.names = response);
);
</script>

</body>
</html>

另一端的.htaccess文件在下面

  Header set Access-Control-Allow-Methods "POST"
  Header set Access-Control-Allow-Origin "*"
RewriteEngine On

RewriteCond %REQUEST_FILENAME !-f
RewriteCond %REQUEST_FILENAME !-d
RewriteRule ^(.*)$ index.php [QSA,L]

而应该处理这个问题的 PHP 是

<?php
header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept');
header( ‘Access-Control-Allow-Headers: Authorization, Content-Type’ );
header("Access-Control-Allow-Origin: *");

我不确定我为什么会收到此错误或我到底做错了什么。非常感谢任何帮助或见解。

【问题讨论】：

【参考方案1】：

这个 htaccess 代码应该可以工作：

Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Headers "Origin, X-Requested-With, Content-Type, Access-Control-Allow-Origin"
Header always set Access-Control-Allow-Methods "PUT, GET, POST, DELETE, OPTIONS"

Angularjs 在发出 POST 请求之前会发出 OPTIONS 请求

【讨论】：

似乎创建了一个新错误“'Access-Control-Allow-Origin' does not match '*, *').” 我通常不会在.htaccess中设置标题，在我制作的php代码中：header('Access-Control-Allow-Origin: *'); header('Access-Control-Allow-Methods: POST, GET, PUT, DELETE, OPTIONS'); header('Access-Control-Allow-Headers: X-Requested-With, content-type, X-Token, x-token'); 另外here你有一个自定义CORS请求的功能 谢谢！不管出于什么奇怪的原因，PHP 成功了！

以上是关于CORS 预检通道未成功 - 客户端 - 服务器的主要内容，如果未能解决你的问题，请参考以下文章

跨域请求被阻止原因：CORS 预检通道未成功

CORS 预检通道在 Spring Security 中没有成功

CORS 预检响应未成功

来自 CORS 预检通道的 CORS 标头“Access-Control-Allow-Headers”中缺少令牌“x-auth”[重复]

来自 CORS 预检通道的 CORS 标头“Access-Control-Allow-Headers”中缺少令牌

来自 CORS 预检通道的 CORS 标头“Access-Control-Allow-Headers”中缺少令牌“access-control-allow-origin”