CORS: нельзя использовать подстановочный знак в Access-Control-Allow-Origin, когда флаг учетных данных верен

У меня есть настройка с участием

Внешний сервер (Node.js, domain: localhost: 3000) < --- > Backend (Django, Ajax, domain: localhost: 8000)

Browser < - webapp < - Node.js(обслуживать приложение)

Браузер (webapp) → Ajax → Django (подавать запросы POST ajax)

Теперь моя проблема здесь в настройке CORS, которую использует webapp, чтобы сделать вызовы Ajax на сервер. В хроме, я продолжаю получать

Нельзя использовать подстановочный знак в Access-Control-Allow-Origin, когда флаг учетных данных имеет значение true.

также не работает на firefox.

Моя установка Node.js:

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();
};

И в Django я использую это промежуточное программное обеспечение вместе с этим

Webapp делает запросы как таковые:

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

Итак, заголовки запросов, которые отправляет Webapp, выглядят следующим образом:

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="***"

И вот заголовок ответа:

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

Где я иду не так?!

Изменить 1: Я использовал chrome --disable-web-security, но теперь хочу, чтобы все на самом деле работало.

Изменить 2: Ответ:

Итак, решение для меня 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

Это часть безопасности, вы не можете этого сделать. Если вы хотите разрешить учетные данные, то ваш Access-Control-Allow-Origin не должен использовать *. Вам нужно будет указать точный протокол + домен + порт. Для справки см. Следующие вопросы:

Кроме того, * является слишком разрешительным и приведет к поражению использования учетных данных. Поэтому установите http://localhost:3000 или http://localhost:8000 в качестве заголовка allow origin.

Ответ 2

Если вы используете промежуточное ПО CORS и хотите отправить withCredential boolean true, вы можете настроить CORS следующим образом:

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

Ответ 3

Если вы используете express, вы можете использовать пакет cors, чтобы позволить CORS для этого вместо того, чтобы писать ваше промежуточное программное обеспечение;

var express = require('express')
, cors = require('cors')
, app = express();

app.use(cors());

app.get(function(req,res){ 
  res.send('hello');
});

Ответ 4

попробуй:

const cors = require('cors')

const corsOptions = {
    origin: 'http://localhost:4200',
    credentials: true,

}
app.use(cors(corsOptions));

Ответ 5

Для целей разработки в Chrome установка этого дополнения избавит от этой конкретной ошибки:

Access to XMLHttpRequest at 'http://192.168.1.42:8080/sockjs-node/info?t=1546163388687' 
from origin 'http://localhost: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 credentials mode is 'include'. The credentials mode of requests 
initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

После установки убедитесь, что вы добавили шаблон URL к Intercepted URLs, щелкнув значок AddOn (CORS, зеленый или красный) и заполнив соответствующее текстовое поле. Пример шаблона URL для добавления сюда, который будет работать с http://localhost:8080, будет: *://*

Ответ 6

Если вы хотите разрешить все источники и сохранить учетные данные, это сработало для меня:

app.use(cors({
  origin: function(origin, callback){
    return callback(null, true);
  },
  optionsSuccessStatus: 200,
  credentials: true
}));

Ответ 7

Это работает для меня в разработке, но я не могу посоветовать, что в производстве это просто другой способ выполнения работы, который еще не был упомянут, но, вероятно, не самый лучший. Во всяком случае здесь идет:

Вы можете получить источник из запроса, а затем использовать его в заголовке ответа. Вот как это выглядит в экспрессе:

app.use(function(req, res, next) {
  res.header('Access-Control-Allow-Origin', req.header('origin') );
  next();
});

Я не знаю, как это будет выглядеть с вашей настройкой Python, но это должно быть легко перевести.