API Gateway CORS：no 'Access-Control-Allow-Origin'ヘッダー

Question

CORSはAPIゲートウェイ経由で設定されており、Access-Control-Allow-Originヘッダーが設定されていますが、 Chrome内のAJAXのAPI：

XMLHttpRequestはをロードできません。要求されたリソースに「Access-Control-Allow-Origin」ヘッダーが存在しません。したがって、原点「ヌル」はアクセスが許可されません。私はPostmanを通じてURLをGETしようとした403

応答は、HTTPステータスコードを持っていたし、それは、上記のヘッダが正常に渡されますを示しています。

：

をとオプションのREPONSEから

JSON-Pに戻さずにブラウザからAPIを呼び出すにはどうすればよいですか？

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ゲートウェイPOSTメソッドで 'APIキーの必要' オプションを無効にする必要がありました。

Answer 3

は私のサンプルの作業を手に入れた：私はちょうどは、「アクセス制御 - 許可 - 起源」を挿入：「*」、内部ヘッダ：{}ラムダ関数nodejs生成に。私はをのラムダ生成API層に変更しました。

は、ここに私の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-Gatewayをカスタムオーソライザで実行している場合、API-Gatewayは実際にサーバーにヒットする前に401または403バックを送信します。デフォルトでは、カスタム許可者から4xxを返すときにCORS用にAPIゲートウェイが設定されていません。

API Gatewayの設定を修正するには、「Gateway Responses」に移動し、「Default 4XX」を展開してCORS設定ヘッダーを追加します。すなわち

Access-Control-Allow-Origin: '*' 

ゲートウェイを再インストールしてください。