Политика CORS блокирует XMLHttpRequest

Запустив Ionic Angular на моем локальном хосте, я сделал следующий вызов к моему бэкенду Django (запущенному на другом локальном хосте):

  test() {
    return this.httpClient.get(endpoint + '/test', {
      headers: { mode: 'no-cors' },
    });
  }

На стороне бэкенда у меня есть следующий код для ответа:

@csrf_exempt
def test(request):
  response = json.dumps({'success': True})
  return HttpResponse(response, content_type='application/json', headers={'Access-Control-Allow-Origin': '*'})

У меня также есть это в моем файле settings.py:

 INSTALLED_APPS = [
      ...
      'corsheaders',

    ]

    MIDDLEWARE = [
      ...
      'corsheaders.middleware.CorsMiddleware',
     ]

     CORS_ALLOW_ALL_ORIGINS = True 
     CORS_ALLOW_CREDENTIALS = True

По-прежнему, я получаю это сообщение об ошибке в моей консоли:

Доступ к XMLHttpRequest по адресу 'http://127.0.0.1:8000/test' из origin 'http://localhost:8100' был заблокирован политикой CORS: Режим поля заголовка запроса не разрешен Access-Control-Allow-Headers в префлайт-ответе.

Что я делаю не так?

Вам нужно просто добавить еще одну настройку

CORS_ALLOW_ALL_HEADERS=True

Кроме вышеперечисленного, вам не нужно устанавливать заголовок для каждого ответа. Просто ответьте обратно с полезной нагрузкой в виде

@csrf_exempt
def test(request):
  response = json.dumps({'success': True})
  return HttpResponse(response, content_type='application/json', headers={'Access-Control-Allow-Origin': '*'})
Вернуться на верх