機能するもの
作成した簡単なWordゲームがあります。それは素晴らしく機能します。ユーザーが要求したことの1つは、Wordの有効性チェックです。 AWS Lambda Proxy/Node.jsエンドポイントでoxford辞書apiを実行しています。これは、ブラウザーを介してAPIGateway uriにアクセスする場合に最適です。
Oxford APIキーを保護し、より直接的なCORS制御を行うために、AWS Lambda関数を選択しました。
取られたステップ
AWS APIGatewayでCORSを有効にし、開発中に「*」ワイルドカードを使用しました。
ローカルサーバー@ 127.0.0.1を使用して、ゲームへの追加をコーディングし始めました。
エラーが発生しました
次の問題に遭遇しました。
myproject.html:57クロスオリジンリードブロッキング(CORB)がクロスオリジンレスポンスをブロックしました https://XXXXXXXXXXX.execute-api.us-east-2.amazonaws.com/prod/dictionary?word=help MIMEタイプがapplication/jsonの場合。詳細については、 https://www.chromestatus.com/feature/5629709824032768 をご覧ください。 getWord @ myproject.html:57(匿名)@ myproject.html:67
クライアントコード
私は簡単なフェッチを使用しています:
var base_url = "https://XXXXXXXXXXX.execute-api.us-east-2.amazonaws.com/prod/dictionary?word=";
getWord = function(Word){
fetch(base_url+Word, {
headers: {
'content-type': 'application/json'
},
method: 'GET',
mode: 'cors'
}).then(function(response) {
console.log(response);
});
}
質問
CORBについて聞いたことがありません。何がCORBを引き起こしているのか、そしてこれを解決するための手順は何なのか理解できません。 CORBの問題はどのように解決されますか?
どうやら忍耐する必要がありました。誰かがこれに遭遇した場合に備えて:
APIGateway CORSの有効化にもかかわらず、Lambdaプロキシ統合が有効になっていると、CORS権限がラムダ関数に渡されます。最初のURI要求はAPIgatewayで受け入れられましたが、ラムダ応答にヘッダーがないため最終的に失敗しました。どういうわけか、これはCORSの代わりにCORBを引き起こしました。理由はわかりません。
答えは、CORSがAPIgatewayで有効になっており、ラムダ関数の応答コールバックパターンに「Access-Control-Allow-Origin」ヘッダーが含まれていることを確認することです。