質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

89.07%

Cross-Origin Read Blocking (CORB) blocked cross-origin response のエラー表示を消すためにはどうすれば良いでしょうか?

受付中

回答 0

投稿 編集

  • 評価
  • クリップ 1
  • VIEW 1,645

echizeyayota

score 17

いつもお世話になっています。
下記の質問についてご存知の方がいらっしゃいましたら、ご教示を願います。


【質問の主旨】

GitHubに公開したコードをローカル開発環境上で実行してPayPalの決済ボタンを押すと、コンソール画面上に下記のエラーが表示されます。

Cross-Origin Read Blocking (CORB) blocked cross-origin response https://www.sandbox.paypal.com/xoplatform/logger/api/logger with MIME type text/html.

このエラーを表示させないようにするためには、公開したコードのうち、どこをどう修正すれば良いでしょうか?

【質問の補足】

上記の質問に対して下記のとおり7点を補足説明いたします。

1.

GitHubのコードを実行すると、AMPの公式ドキュメントで示されている「インタラクティブな AMP ページを作成する」というECサイトのチュートリアルが表示されます。PayPalボタン以外の箇所はこのチュートリアルを写経しています。

2.

PayPalの決済ボタンはPayPal developerのSmart Payment Buttons Integrationに基づいて作成しました。

3.

ECサイトではありますが、「インタラクティブな AMP ページを作成する」とPayPalの決済ボタンの間に価格などの特別な紐付けをしていません。単にAMPとPayPalで示されているコードを足し合わせただけです。

4.

エラーが発生する理由はCORSのルールにもとづき、ポリシーが異なるURLの間でデータの受け渡しをする状態になっていないためであると推測しています。

5.

今回のエラーを表示させないためには、

fetch('https://hoge.com/fuga',{
    mode: 'cors'
})

のようなコードをどこかに記述すべきだと思いますが、どこにfetchメソッドを使った詳細なコードを書くのかよく分かりません。

6.

ローカル開発環境は、Node.jsを使用しています。

cd advanced-interactivity-in-amp → node app.js → localhost:3000 で表示画面を確認することができます。

(参考ページ)
https://amp.dev/ja/documentation/guides-and-tutorials/develop/interactivity/prereqs-setup?format=websites
https://github.com/echizenyayota/advanced-interactivity-in-amp/blob/developer_liquidation/app.js#L103-L105

7.

スタック・オーバーフローでも同様の質問をしていますが回答を得られないため、こちらでも質問をさせていただきました。


以上、ご確認のほどよろしくお願い申し上げます。

  • 気になる質問をクリップする

    クリップした質問は、後からいつでもマイページで確認できます。

    またクリップした質問に回答があった際、通知やメールを受け取ることができます。

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

まだ回答がついていません

15分調べてもわからないことは、teratailで質問しよう!

  • ただいまの回答率 89.07%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る