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

Question

Несмотря на то, что CORS настроен через интерфейс API Gateway, а заголовок Access-Control-Allow-Origin установлен, я по-прежнему получаю следующую ошибку при попытке вызова API от AJAX в пределах Chrome:

XMLHttpRequest не может загрузить . В запрошенном ресурсе нет заголовка «Access-Control-Allow-Origin». Поэтому исходный 'null' не допускается. Ответ был HTTP код статуса 403.

Я попытался ПОЛУЧИТЕ URL через Postman и он показывает выше заголовок успешно прошел:

И из OPTIONS réponse:

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

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

Answer 2

1) мне нужно сделать то же самое, как @riseres и некоторые другие changes.This мои заголовки ответа:

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 шлюз конфигурации, посте или получить методы не имеют добавленные заголовков, только опция делает. Вы должны сделать это вручную в ответе (сервер или лямбда-ответ).

3) И

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

Answer 3

Получил мой образец работу: Я только вставлено 'Access-Control-Allow-Origin': '*', внутри заголовки: {} в генерируемый nodejs функции лямбда. Я сделал no Изменения в слое 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(); } 
}); 

Answer 4

Если кто-то работает в это до сих пор - я был в состоянии отследить причину в моем приложении.

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

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

Access-Control-Allow-Origin: '*' 

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