Question

我正在尝试配置CORS，但我不知道我错过了什么。我使用Silex（PHP - Apache）作为后端，AngularJS作为前端。我在.htaccess中有这个配置：

Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "POST, GET, PUT, OPTIONS, PATCH, DELETE"
Header always set Access-Control-Allow-Credentials "true"
Header always set Access-Control-Allow-Headers "X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version, X-HTTP-Method-Override, Origin"

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

在angularJS的app配置中，我有：

myApp.config(['$httpProvider', function($httpProvider) {
            $httpProvider.defaults.useXDomain = true;
            delete $httpProvider.defaults.headers.common['X-Requested-With'];
        }
    ]);

我在angularJS的服务是这样的：

var headers = {
        'Access-Control-Allow-Origin': '*',
        'Access-Control-Allow-Methods': 'POST, GET, PUT, OPTIONS, PATCH, DELETE',
        'Access-Control-Allow-Headers': 'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version, X-HTTP-Method-Override, Origin'
    };
    var restConfig = {
        method: 'POST',
        dataType : 'json',
        url: 'http://localapi.com/user/create',
        data: paramData,
        headers: headers
    };
    return $http(restConfig)
        .success(function (a) {
             console.log('works');
        }).error(function (m) {
             console.log('does not work');
        });

我在网络上看到的所有电话都是

create | OPTION | (failed)
/user  |        | net::ERR_EMPTY_RESPONSE

然而，随着卷曲，我得到了这个回应

curl -I http://localapi.com/user/create

    HTTP/1.1 200 OK
    Date: Tue, 17 Feb 2015 01:46:06 GMT
    Server: Apache/2.2.26 (Unix) DAV/2 PHP/5.4.24 mod_ssl/2.2.26 OpenSSL/0.9.8y
    Access-Control-Allow-Origin: *
    Access-Control-Allow-Methods: POST, GET, PUT, OPTIONS, PATCH, DELETE
    Access-Control-Allow-Credentials: true
    Access-Control-Allow-Headers: X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version, X-HTTP-Method-Override, Origin
X-Powered-By: PHP/5.4.24
    Cache-Control: no-cache
    Content-Type: application/json

我不知道我错过了什么。我在端口5000中的nodeJS中有角度运行。有人可以给我一个解决方法吗？

Answer 1

此标题仅适用于服务器，因此无需以角度设置它们：

var headers = {
    'Access-Control-Allow-Origin': '*',
    'Access-Control-Allow-Methods': 'POST, GET, PUT, OPTIONS, PATCH, DELETE',
    'Access-Control-Allow-Headers': 'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version, X-HTTP-Method-Override, Origin'
};

在角度你应该设置如下：

headers: {
    'Content-Type': 'application/json; charset=UTF-8',
    'Accept': 'application/json, */*; q=0.01',
    'X-CSRFToken': undefined
},

这里有如何设置csrf令牌： AngularJS + Django Rest Framework + CORS ( CSRF Cookie not showing up in client )

同样使用网络浏览器的开发者工具，您可以准确了解您的请求是如何发送的。

AngularJS和Silex的CORS问题（PHP - Apache）

1 个答案: