withCredentials 和通配符 * - 'Access-Control-Allow-Origin' 标头问题

Question

I have an app in nodejs that will serve as a proxy to connecting to various social platforms. The flow is like this:

1. Click on a button, open a new window
2. Before closing a window, add access token to cookie (for now the app is on localhost, so the token is on that domain) as a nonce and add it to database.
3. Once the modal closes, go to another endpoint that will take that nonce from cookie, search in db, and return the token.

Here is the issue, after sending AJAX request for step 3, CORS issue occurs. This is the code:

jQuery.ajax({
       url: "http://localhost:9057/facebook/gettoken",
       type: 'GET',
       dataType: "json",
       xhrFields: {
// -->> In order to access the cookie, we have to have this set as true.
           withCredentials: true
       },
       crossDomain: true,
       success: function (res) {
           console.log(res);
       }
});

In my NodeJS app, I have cors set up as:

if (config.getOption('PORT')) {
    const corsOptions = {
        credentials: true
    };

    app.use(cors(corsOptions));
// -->> I cannot have * here here, withCredentials cannot be set to true and have *, see the error below
    app.options('*', cors(corsOptions));
}

This is the error:

Access to XMLHttpRequest at ' http://localhost:9057/facebook/gettoken ' from origin ' http://something.test:8080 ' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

I cannot whitelist the domains that 'http://something.test:8080' represents as they will be user websites.

Anyone knows a workaround, if there is one?

Answer 1

See the docs .

They give an example of how to use a dynamic origin:

 var whitelist = ['http://example1.com', 'http://example2.com'] var corsOptions = { origin: function (origin, callback) { if (whitelist.indexOf(origin),== -1) { callback(null, true) } else { callback(new Error('Not allowed by CORS')) } } }

If you can't whitelist, then just remove the test for the whitelist!

var corsOptions = {
  origin: function (origin, callback) {
      callback(null, true)
  }
}