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

61,990

Solution 1

You are attempting to do Cross-origin resource sharing (CORS) which is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the resource originated. (such as accessing fonts or JSON files).

Browsers restrict your access to resources from other origins as of Same-origin policy as a security measure for internet users.

To get around this issue you have to options:

  1. allow CORS on the domain http://demo.software.travel (but there is are security concerns, more description about it here: https://www.owasp.org/index.php/HTML5_Security_Cheat_Sheet#Cross_Origin_Resource_Sharing)

Enable CORS on the server to be able to access other domains through. this can be done by adding the following headers to responses:

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

  1. if you are not granted resource sharing with that domain, you are allowed to use JSONP for read only operations (JSONP is inherently read-only)

JSONP wraps a JSON object in a callback, which technically makes the request a non-restricted resource (a script tag) hence can be shared across domains.

it can be done via vanilla js by adding a script tag onto the page.

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

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

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

or you can use jquery to achieve the same:

$.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 documentation: https://learn.jquery.com/ajax/working-with-jsonp/

Solution 2

If you set "Full" CORS (with OPTION pre-request) on in nginx by add 'access-control-allow-origin *' and independently you add that header (for Simple CORS - without OPTION pre-request) to each response in SERVER (eg. php):

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

Then you will get this problem. Solution: remove code which add this header in server if already you add this header in your nginx config :)

I found this advice here

Share:
61,990
Alaa M. Jaddou
Author by

Alaa M. Jaddou

Alaa M. Jaddou. Mid Level Full Stack Developer. IT Solution, Graphic Design and Web services at AJ Design & Develop.

Updated on July 09, 2022

Comments

  • Alaa M. Jaddou
    Alaa M. Jaddou almost 2 years

    i'm trying to send get request to api like it's a login url

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

    i'm getting this in my console this error

    XMLHttpRequest cannot load http://demo.software.travel/gptp/api/authorization?apiKey=****&alias=****&login=****&password=****. The 'Access-Control-Allow-Origin' header contains multiple values 'http://travellights.net, *', but only one is allowed. Origin 'http://travellights.net' is therefore not allowed access.

    i'm trying to see questions here to solve it but i didn't get what i need to change, this is annoying actually.

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

    this solved by asp.net web.congif

    By the way i'm using CHROME BROWSER any help i appreciate.

    UPDATE response headers:

    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
    

    Request Headers:

    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