CORS: Cannot use wildcard in Access-Control-Allow-Origin when credentials flag is true

匿名 (未验证) 提交于 2019-12-03 02:09:01

问题:

I have a setup involving

Frontend server (Node.js, domain: localhost:3000) <---> Backend (Django, Ajax, domain: localhost:8000)

Browser <-- webapp <-- Node.js (Serve the app)

Browser (webapp) --> Ajax --> Django(Serve ajax POST requests)

Now, my problem here is with CORS setup which the webapp uses to make Ajax calls to the backend server. In chrome, I keep getting

Cannot use wildcard in Access-Control-Allow-Origin when credentials flag is true.

doesn't work on firefox either.

My Node.js setup is:

var allowCrossDomain = function(req, res, next) {     res.header('Access-Control-Allow-Origin', 'http://localhost:8000/');     res.header('Access-Control-Allow-Credentials', true);     res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');     res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");     next(); }; 

And in Django I'm using this middleware along with this

The webapp makes requests as such:

$.ajax({     type: "POST",     url: 'http://localhost:8000/blah',     data: {},     xhrFields: {         withCredentials: true     },     crossDomain: true,     dataType: 'json',     success: successHandler }); 

So, the request headers that the webapp sends looks like:

Access-Control-Allow-Credentials: true Access-Control-Allow-Headers: "Origin, X-Requested-With, Content-Type, Accept" Access-Control-Allow-Methods: 'GET,PUT,POST,DELETE' Content-Type: application/json  Accept: */* Accept-Encoding: gzip,deflate,sdch Accept-Language: en-US,en;q=0.8 Cookie: csrftoken=***; sessionid="***" 

And here's the response header:

Access-Control-Allow-Headers: Content-Type,* Access-Control-Allow-Credentials: true Access-Control-Allow-Origin: * Access-Control-Allow-Methods: POST,GET,OPTIONS,PUT,DELETE Content-Type: application/json 

Where am I going wrong?!

Edit 1: I've been using chrome --disable-web-security, but now want things to actually work.

Edit 2: Answer:

So, solution for me django-cors-headers config:

CORS_ORIGIN_ALLOW_ALL = False CORS_ALLOW_CREDENTIALS = True CORS_ORIGIN_WHITELIST = (     'http://localhost:3000' # Here was the problem indeed and it has to be http://localhost:3000, not http://localhost:3000/ ) 

回答1:

This is a part of security, you cannot do that. If you want to allow credentials then your Access-Control-Allow-Origin must not use *. You will have to specify the exact protocol + domain + port. For reference see these questions :

  1. Access-Control-Allow-Origin wildcard subdomains, ports and protocols
  2. Cross Origin Resource Sharing with Credentials

Besides * is too permissive and would defeat use of credentials. So set http://localhost:3000 or http://localhost:8000 as the allow origin header.



回答2:

If you are using express you can use the cors package to allow CORS like so instead of writing your middleware;

var express = require('express') , cors = require('cors') , app = express();  app.use(cors());  app.get(function(req,res){    res.send('hello'); }); 


回答3:

If you are using CORS middleware and you want to send withCredential boolean true, you can configure CORS like this:

var cors = require('cors');     app.use(cors({credentials: true, origin: 'http://localhost:3000'})); 


回答4:

try it:

const cors = require('cors')  const corsOptions = {     origin: 'http://localhost:4200',     credentials: true,  } app.use(cors(corsOptions)); 


易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!