AngularJS和Silex(PHP-Apache)的CORS问题


Issue with CORS for AngularJS and Silex (PHP - Apache)

我正在尝试配置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的应用程序配置中,我有:

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,我得到了这个响应

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中运行了angular。有人能给我小费吗?

此标头仅在服务器上工作,因此不需要在angular中设置它们:

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)

此外,使用web浏览器的开发工具,您可以准确地看到您的请求是如何发送的。