angular js nginx cors - 没有'Access-Control-Allow-Origin'标题

时间:2014-01-02 23:26:26

标签: angularjs nginx cross-domain cors

我知道同一个问题的不同版本已经被问到,我已经阅读了我在SO和Google上找到的所有相关问题和答案。

我正在尝试从angularJS应用程序向nginx服务器发出跨域请求。所有GET请求都表现正常,但我的POST请求却没有。

Chrome正在给我一个'Access-Control-Allow-Origin'错误,所以我将以下内容添加到我的nginx服务器配置中:

location / {

if ($http_origin ~* (https?://.*\.mysite\.com(:[0-9]+)?)) {
    set $cors "true";
}

if ($request_method = 'OPTIONS') {
    set $cors "${cors}options";  
}

# non-OPTIONS indicates a normal CORS request
if ($request_method = 'GET') {
    set $cors "${cors}get";  
}
if ($request_method = 'POST') {
    set $cors "${cors}post";
}

# if it's a GET or POST, set the standard CORS responses header
if ($cors = "trueget") {
    add_header 'Access-Control-Allow-Origin' "$http_origin";
    #add_header 'Access-Control-Allow-Credentials' 'true';
}

if ($cors = "truepost") {
    add_header 'Access-Control-Allow-Origin' "$http_origin";
    #add_header 'Access-Control-Allow-Credentials' 'true';
}

if ($cors = "trueoptions") {
    add_header 'Access-Control-Allow-Origin' "$http_origin";
    #add_header 'Access-Control-Allow-Credentials' 'true';

    #
    # Return special preflight info
    #        
    add_header 'Access-Control-Max-Age' 1728000;
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
    add_header 'Access-Control-Allow-Headers' 'Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,Keep-Alive,X-Requested-With,If-Modified-Since';
    add_header 'Content-Length' 0;
    add_header 'Content-Type' 'text/plain charset=UTF-8';
    return 204;
}
}

OPTIONS请求按预期返回状态204和添加的标题:

Request URL:<code>http://otherSite/shfofx/PHP/Add/addTrade</code>
Request Method:OPTIONS
Status Code:204 No Content
Request Headers
Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:accept, x-requested-with, content-type
Access-Control-Request-Method:POST
AlexaToolbar-ALX_NS_PH:AlexaToolbar/alxg-3.2
Cache-Control:no-cache
Connection:keep-alive
Host:otherSite
Origin:<code>http://test-shf.mysite.com</code>
Pragma:no-cache
Referer:<code>http://test-shf.mysite.com/portfolio</code>
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_1) AppleWebKit/537.36 (KHTML, like    Gecko) Chrome/31.0.1650.63 Safari/537.36
Response Headersview source
Access-Control-Allow-Headers:Authorization,Content-Type,Accept,Origin,User-   Agent,DNT,Cache-Control,X-Mx-ReqToken,X-Requested-With,Keep-Alive,If-Modified-Since
Access-Control-Allow-Methods:GET, POST, OPTIONS
Access-Control-Allow-Origin:<code>http://test-shf.mysite.com</code>
Access-Control-Max-Age:1728000
Connection:keep-alive
Content-Length:0
Content-Type:text/plain charset=UTF-8
Date:Thu, 02 Jan 2014 22:54:58 GMT
Server:nginx/1.2.6 (Ubuntu)

然后,我在Chrome网络标签中看到一个带有POST请求的网络通话,该通过以下控制台输出取消:

XMLHttpRequest cannot load <code>http://otherSite/shfofx/PHP/Add/addTrade</code>. 
No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'http://test-shf.mysite.com' is therefore not allowed access.

取消的POST请求的标头信息是:

Request URL:<code>http://otherSite/shfofx/PHP/Add/addTrade</code>
Request Headers
Accept:application/json, text/plain, */*
Cache-Control:no-cache
Content-Type:application/json;charset=UTF-8
Origin:<code>http://test-shf.mysite.com</code>
Pragma:no-cache
Referer:<code>http://test-shf.mysite.com/portfolio</code>
User-Agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36
X-Requested-With:XMLHttpRequest
Request Payload
{UserFIID:0, FinancialInstID:4, FinancialInstName:undefined, UserID:1, SHFUserID:1,…}

为什么允许预检OPTIONS请求但我的POST请求被取消了?

1 个答案:

答案 0 :(得分:1)

所以答案很简单,也很烦人。

我的开发服务器配置为允许松散解释的文件名,所以:

Request URL:http://otherSite/shfofx/PHP/Add/addTrade

将解析addTrade.php,代码将按预期执行。但是,在我的测试服务器中,服务器配置为仅返回请求的确切区分大小写的页面。因此,POST请求返回的状态为“404 Not Found”。

更糟糕的是,Chrome的网络标签没有传输404响应,只是“Access-Control-Allow-Origin”错误。直到我检查了服务器响应firefox,我才能确定并解决问题。

我只是改变了:

Request URL:http://otherSite/shfofx/PHP/Add/addTrade

为:

Request URL:http://otherSite/shfofx/PHP/Add/addTrade.php

就是这样。