“Access-Control-Allow-Origin”标头包含多个值答案

【问题标题】：The 'Access-Control-Allow-Origin' header contains multiple values“Access-Control-Allow-Origin”标头包含多个值
【发布时间】：2016-10-02 08:11:03
【问题描述】：

我正在尝试向 api 发送获取请求，就像它是一个登录 URL 一样

var url = "http://demo.software.travel/gptp/api/authorization?apiKey=****&alias=****&login=****&password=****"
$.get(url, function(data) {
    console.log(data);
});

我在控制台中收到此错误

XMLHttpRequest 无法加载 http://demo.software.travel/gptp/api/authorization?apiKey=****&alias=****&login=****&password=****。 “Access-Control-Allow-Origin”标头包含多个值“http://travellights.net, *”，但只允许一个值。因此，不允许访问 Origin 'http://travellights.net'。

我试图在这里查看问题以解决它，但我没有得到我需要更改的内容，这实际上很烦人。

The 'Access-Control-Allow-Origin' header contains multiple values

asp.net web.congif 解决了这个问题

顺便说一下，我正在使用 CHROME BROWSER 任何帮助。

更新响应标头：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:origin, x-requested-with, Content-Type, accept, Token
Access-Control-Allow-Methods:GET, HEAD, POST, PUT, DELETE, TRACE, OPTIONS
Access-Control-Allow-Origin:http://travellights.net
Access-Control-Allow-Origin:*
Connection:close
Content-Encoding:gzip
Content-Type:application/json;charset=utf-8
Date:Thu, 02 Jun 2016 16:41:18 GMT
Server:nginx/1.1.19
Set-Cookie:JSESSIONID=51FEE1A1206B9B481DD3EEA4167A9256; Path=/gptp
Vary:Origin
Vary:Accept-Encoding
X-UA-Compatible:IE=EmulateIE7

请求标头：

Accept:application/json, text/javascript, */*; q=0.01
Accept-Encoding:gzip, deflate, sdch
Accept-Language:en-US,en;q=0.8,ar;q=0.6,en-GB;q=0.4
Connection:keep-alive
Host:demo.software.travel
Origin:http://travellights.net
Referer:http://travellights.net/b2b/Pages/login?
User-Agent:Mozilla/5.0 (Windows NT 10.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36

【问题讨论】：

是http://demo.software.travel你的吗？
现在是你的，或者不是......
问题出在您请求数据的服务器上，如果它不是您的，您所能做的就是向他们提供您遇到的错误。就需要更改的内容而言，它非常具有描述性。
表单发布和获取不受同源策略的约束。
Curl 也不受同源策略的约束。仅限阿贾克斯。 I 帧也受到限制，但略有不同。

标签： jquery json ajax google-chrome cross-domain

【解决方案1】：

如果您通过添加“access-control-allow-origin *”在 nginx 中设置 "Full" CORS（带有 OPTION 预请求）并独立添加该标头（对于 Simple CORS - 没有 OPTION 预请求） SERVER 中的每个响应（例如 php）：

header('Access-Control-Allow-Origin', "*");

那么你就会遇到这个问题。解决方案：如果您已经在 nginx 配置中添加了此标头，请删除在服务器中添加此标头的代码:)

我找到了这个建议here

【讨论】：

【解决方案2】：

您正在尝试进行跨域资源共享 (CORS)，这是一种允许从资源来源域之外的另一个域请求网页上的受限资源的机制。（例如访问字体或 JSON 文件）。

作为互联网用户的安全措施，浏览器限制您访问来自其他来源的资源，因为同源政策。

要解决此问题，您必须选择：

在域http://demo.software.travel 上允许 CORS （但存在安全问题，请在此处进行更多描述：https://www.owasp.org/index.php/HTML5_Security_Cheat_Sheet#Cross_Origin_Resource_Sharing）

在服务器上启用 CORS 以便能够通过它访问其他域。这可以通过在响应中添加以下标头来完成：

Access-Control-Allow-Origin: http://travellights.net Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept

如果您未获准与该域共享资源，则允许您使用 JSONP 进行只读操作（JSONP 本质上是只读的）

JSONP 在回调中包装了一个 JSON 对象，这在技术上使请求成为非受限资源（脚本标签），因此可以跨域共享。

可以通过 vanilla js 在页面上添加脚本标签来完成。

function process(data) {
    // do stuff with JSON
}

var script = document.createElement('script');
script.src = '//domainURL?callback=process'

document.getElementsByTagName('head')[0].appendChild(script);

或者你也可以使用 jquery 来达到同样的效果：

$.ajax({enter code here
    url: "http://query.yahooapis.com/v1/public/yql",
    jsonp: "callback",
    dataType: "jsonp",
    data: {
        q: "select title,abstract,url from search.news where query=\"cat\"",
        format: "json"
    },
    success: function( response ) {
        console.log( response ); // server response
    }
});

jquery 文档：https://learn.jquery.com/ajax/working-with-jsonp/

【讨论】：