API Gateway CORS: нет заголовка "Access-Control-Allow-Origin"

Хотя CORS был настроен через API-шлюз и установлен заголовок Access-Control-Allow-Origin, я все еще получаю следующую ошибку при попытке вызвать API из AJAX в Chrome:

XMLHttpRequest не может загрузить http://XXXXX.execute-api.us-west-2.amazonaws.com/beta/YYYYY. В запрошенном ресурсе отсутствует заголовок "Access-Control-Allow-Origin". Происхождение 'null', следовательно, не разрешено. Ответ имел HTTP-код состояния 403.

Я попытался получить URL через Почтальон, и он показывает, что вышеуказанный заголовок успешно передан:

И из вариантов ответа:

Как я могу вызвать мой API из браузера, не возвращаясь к JSON-P?

Ответ 1

Я получаю ту же проблему. Я использовал 10 часов для поиска.

https://serverless.com/framework/docs/providers/aws/events/apigateway/

// handler.js

'use strict';

module.exports.hello = function(event, context, callback) {

const response = {
  statusCode: 200,
  headers: {
    "Access-Control-Allow-Origin" : "*", // Required for CORS support to work
    "Access-Control-Allow-Credentials" : true // Required for cookies, authorization headers with HTTPS 
  },
  body: JSON.stringify({ "message": "Hello World!" })
};

callback(null, response);
};

Ответ 2

Если кто-то еще сталкивается с этим - я смог отследить основную причину в моем приложении.

Если вы используете API-шлюз с пользовательскими Авторизаторами - API-шлюз отправит 401 или 403 назад, прежде чем он действительно попадет на ваш сервер. По умолчанию - API-шлюз НЕ настроен для CORS при возврате 4xx из пользовательского авторизатора.

Кроме того - если вы получаете код состояния 0 или 1 из запроса, выполняемого через API-шлюз, возможно, это ваша проблема.

Чтобы исправить - в конфигурации шлюза API - перейдите в раздел "Ответы шлюза", разверните "Default 4XX" и добавьте туда заголовок конфигурации CORS. т.е.

Access-Control-Allow-Origin: '*'

Обязательно повторно разверните ваш шлюз - и вуаля!

Ответ 3

1) Мне нужно было сделать то же самое, что и @riseres, и некоторые другие изменения. Это мои заголовки ответов:

headers: {
            'Access-Control-Allow-Origin' : '*',
            'Access-Control-Allow-Headers':'Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token',
            'Access-Control-Allow-Credentials' : true,
            'Content-Type': 'application/json'
        }

2) И

Согласно этой документации:

http://docs.aws.amazon.com/apigateway/latest/developerguide/how-to-cors.html

Когда вы используете прокси для лямбда-функций в конфигурации API-шлюза, методы post или get не имеют добавленных заголовков, а только параметры. Вы должны сделать это вручную в ответе (сервер или лямбда-ответ).

3) И

Кроме того, мне нужно было отключить опцию "Требуется ключ API" в моем методе поста шлюза API.

Ответ 4

Получил мой пример: я просто вставил "Access-Control-Allow-Origin": '*', в заголовки : {} в сгенерированной лямбда-функции nodejs. Я внес изменения не на уровень API, созданный Lambda.

Здесь мой NodeJS:

'use strict';
const doc = require('dynamodb-doc');
const dynamo = new doc.DynamoDB();
exports.handler = ( event, context, callback ) => {
    const done = ( err, res ) => callback( null, {
        statusCode: err ? '400' : '200',
        body: err ? err.message : JSON.stringify(res),
        headers:{ 'Access-Control-Allow-Origin' : '*' },
    });
    switch( event.httpMethod ) {
        ...
    }
};

Здесь мой вызов AJAX

$.ajax({
    url: 'https://x.execute-api.x-x-x.amazonaws.com/prod/fnXx?TableName=x',
    type: 'GET',
    beforeSend: function(){ $( '#loader' ).show();},
    success: function( res ) { alert( JSON.stringify(res) ); },
    error:function(e){ alert('Lambda returned error\n\n' + e.responseText); },
    complete:function(){ $('#loader').hide(); }
});

Ответ 5

Я получил свою работу после того, как понял, что лямбда-авторизатор терпит неудачу и по какой-то неизвестной причине переводится в ошибку CORS. Простое решение для моего автора (и некоторые тесты, которые я должен был добавить в первую очередь), и это сработало. Для меня требуется действие API Gateway "Включить CORS". Это добавило все заголовки и другие настройки, которые мне нужны в моем API.

Ответ 6

Если вы пробовали все, что касается этой проблемы, ничего не получилось, вы окажетесь там, где я это сделал. Оказывается, Amazon существующие настройки установки CORS работают просто отлично... просто убедитесь, что вы помните, что нужно передислоцировать ! Мастер редактирования CORS, даже со всеми его красивыми маленькими зелеными галочками, не делает живых обновлений для вашего API. Возможно, очевидно, но это затормозило меня полдня.

Ответ 7

В моем случае, поскольку я использовал AWS_IAM в качестве метода авторизации, мне нужно было предоставить разрешения моей роли IAM для достижения конечной точки.

Ответ 8

Я запускаю aws-serverless-express, и в моем случае нужно было изменить simple-proxy-api.yaml.

Прежде чем CORS был настроен на https://example.com, я просто поменял местами свое имя сайта и перераспределил его с помощью npm run setup, и он обновил мою существующую лямбда/стек.

#...
/:
#...
method.response.header.Access-Control-Allow-Origin: "'https://example.com'"
#...
/{proxy+}:
method.response.header.Access-Control-Allow-Origin: "'https://example.com'"
#...

Ответ 9

Другой основной причиной этой проблемы может быть разница между HTTP/1.1 и HTTP/2.

Симптом: Некоторые пользователи, не все из них, сообщили, что при использовании нашего Программного обеспечения произошла ошибка CORS.

Проблема: иногда отсутствовал заголовок Access-Control-Allow-Origin.

Контекст: У нас была Lambda в месте, посвященном обработке OPTIONS запроса и ответа с соответствующими CORS заголовки, такие как Access-Control-Allow-Origin совпадающих белый список Origin.

Решение. Похоже, что шлюз API преобразует все заголовки в строчные буквы для вызовов HTTP/2, но поддерживает использование заглавных букв для HTTP/1.1. Это вызвало сбой доступа к event.headers.origin.

Проверьте, есть ли у вас эта проблема тоже:

Предполагая, что ваш API находится на https://api.example.com, а ваш интерфейс на https://www.example.com. Используя CURL, сделайте запрос, используя HTTP/2:

curl -v -X OPTIONS -H 'Origin: https://www.example.com' https://api.example.com

Вывод ответа должен включать заголовок:

< Access-Control-Allow-Origin: https://www.example.com

Повторите тот же шаг, используя HTTP/1.1 (или с заголовком Origin в нижнем регистре):

curl -v -X OPTIONS --http1.1 -H 'Origin: https://www.example.com' https://api.example.com

Если заголовок Access-Control-Allow-Origin отсутствует, вы можете проверить чувствительность к регистру при чтении заголовка Origin.

Ответ 10

В моем случае я просто неправильно писал URL запроса на выборку. На serverless.yml вы устанавливаете для cors значение true:

register-downloadable-client:
    handler: fetch-downloadable-client-data/register.register
    events:
      - http:
          path: register-downloadable-client
          method: post
          integration: lambda
          cors: true
          stage: ${self:custom.stage}

и затем в лямбда-обработчике вы отправляете заголовки, но если вы ошиблись в запросе на выборку во внешнем интерфейсе, вы не получите этот заголовок в ответе и получите эту ошибку. Итак, дважды проверьте URL вашего запроса на передней панели.

Ответ 11

В Python вы можете сделать это, как показано в коде ниже:

{ "statusCode" : 200,
'headers': 
    {'Content-Type': 'application/json',
    'Access-Control-Allow-Origin': "*"
     },
"body": json.dumps(
    {
    "temperature" : tempArray,
    "time": timeArray
    })
 }

Ответ 12

Я нашел простое решение в

API Gateway> Выберите конечную точку API> Выберите метод (в моем случае это был POST)

Теперь есть выпадающий список ACTIONS> Enable CORS.. выберите его.

Теперь снова выберите выпадающие ДЕЙСТВИЯ> Развернуть API (повторно разверните его)

Это сработало !