web-dev-qa-db-ja.com

Chrome CORSブロッキングAPI Gatewayラムダリクエスト

機能するもの

作成した簡単な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の問題はどのように解決されますか?

11
Radio

どうやら忍耐する必要がありました。誰かがこれに遭遇した場合に備えて:

APIGateway CORSの有効化にもかかわらず、Lambdaプロキシ統合が有効になっていると、CORS権限がラムダ関数に渡されます。最初のURI要求はAPIgatewayで受け入れられましたが、ラムダ応答にヘッダーがないため最終的に失敗しました。どういうわけか、これはCORSの代わりにCORBを引き起こしました。理由はわかりません。

答えは、CORSがAPIgatewayで有効になっており、ラムダ関数の応答コールバックパターンに「Access-Control-Allow-Origin」ヘッダーが含まれていることを確認することです。

16
Radio