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

191

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

Внешний сервер (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
    Для меня это localhost: 3000 без http, например: CORS_ORIGIN_WHITELIST = ('localhost: 3000',)
  • 0
    Вы имеете в виду, что вы разрабатываете интерфейс и бэкэнд на одном ПК?
Показать ещё 3 комментария
Теги:
cors
django-cors-headers

4 ответа

175
Лучший ответ

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

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

  • 28
    Но что, если существует более одного домена?
  • 8
    @aroth Вы можете дать список доменов. Похожий вопрос: stackoverflow.com/questions/1653308/…
Показать ещё 6 комментариев
11

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

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

app.use(cors());

app.get(function(req,res){ 
  res.send('hello');
});
  • 10
    Ах, теперь это более удобно, однако, результат тот же :( Кстати, я использую app.use(cors({credentials: true}));
  • 1
    Возможно, вы захотите взглянуть на это промежуточное ПО Django CORS, которое тестируется.
Показать ещё 5 комментариев
9

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

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

попробуй:

const cors = require('cors')

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

}
app.use(cors(corsOptions));
  • 0
    работает с угловым кликом, например

Ещё вопросы

Сообщество Overcoder
Наверх
Меню