Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Access-Control-Allow-Origin: "*" not allowed when credentials flag is true, but there is no Access-Control-Allow-Credentials header

Tags:

Suddenly, seemingly without changing anything in my web app, I started getting CORS errors when opening it in Chrome. I tried adding an Access-Control-Allow-Origin: * header. Then I get this error:

XMLHttpRequest cannot load http://localhost:9091/sockjs-node/info?t= 1449187563637. A wildcard '*' cannot be used in the 'Access-Control-Allow-Origin' header when the credentials flag is true. Origin 'http://localhost:3010' is therefore not allowed access.

But as you can see in the following image, there is no Access-Control-Allow-Credentials header.

enter image description here

WTF? Chrome bug?

My page is loaded at http://localhost:3010 and that server also uses Access-Control-Allow-Origin: * without problems. Is there a problem if the two endpoints both use it?

like image 443
Andy Avatar asked Dec 04 '15 00:12

Andy


People also ask

How do I fix not allowed by Access-Control allow origin?

In that case you can change the security policy in your Google Chrome browser to allow Access-Control-Allow-Origin. This is very simple: Create a Chrome browser shortcut. Right click short cut icon -> Properties -> Shortcut -> Target.

How do I make Access-Control allow credentials true?

For a CORS request with credentials, for browsers to expose the response to the frontend JavaScript code, both the server (using the Access-Control-Allow-Credentials header) and the client (by setting the credentials mode for the XHR, Fetch, or Ajax request) must indicate that they're opting into including credentials.

How do I unblock cross-origin request?

Simply activate the add-on and perform the request. CORS or Cross-Origin Resource Sharing is blocked in modern browsers by default (in JavaScript APIs). Installing this add-on will allow you to unblock this feature.


2 Answers

"credentials flag" refers to XMLHttpRequest.withCredentials of the request being made, not to an Access-Control-Allow-Credentials header. That was the source of my confusion.

If the request's withCredentials is true, Access-Control-Allow-Origin: * can't be used, even if there is no Access-Control-Allow-Credentials header.

like image 77
Andy Avatar answered Sep 19 '22 05:09

Andy


Requests withCredentials:true, on a server configured with Access-Control-Allow-Origin: * CAN be used, but you will need some more extra config on your server:

Using Access-Control-Allow-Origin=* on the server, it will not allow access to any resource (that requires credentials) on any xhr CORS request.

Workarounds:

  1. Make that remote resource on the server accesible without credentials ( and use xhr.withCredentials = false )
  2. Create a rewrite rule on the server, to modify the response header Access-Control-Allow-Origin=* to the request's origin. You can also apply this rewrite under certain criteria, for example, if request is using certain port or it comes from a list of whitelisted domains.

Here is some article that explains how to do this on a IIS server, but you can do this in many other servers:

PS: in case of using credentials, you will also need the following header on your server's response: Access-Control-Allow-Credentials=true

PS2: only 1 value is allowed to "access-control-allow-origin" paramenter. If you try to use for instance two domains: domain1.com domain2.com, it won't work.

like image 34
Alberto S. Avatar answered Sep 23 '22 05:09

Alberto S.