問題タブ [cross-origin-embedder-policy]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
reactjs - ReactでSharedArrayBufferのヘッダーを設定する場所は?
Windows10 の localhost で create-react-app で作成した Web サイトを実行しています。Web サイトで ffmpeg を使用しようとすると、エラーが発生します
「SharedArrayBuffer が定義されていません」
Firefoxで。これを修正するには、COOP および COEP ヘッダーを「トップ ドキュメントに」追加する必要があることをどこでも見てきました。
問題は、「トップドキュメント」とは何か、どこで見つけることができるのかわかりません。
追加しようとしました：
どこかで見たように私のindex.htmlにありますが、機能していません。
ヘッダーを追加する必要があるドキュメントとその場所を教えてください。
javascript - API から画像の URL を埋め込むことができません
私は、API からレシピ情報を取得してページに表示するコーディング チュートリアルに従っています。
少し離れて戻ってくるまで、すべてが正常に機能していました。マークアップをページに挿入すると、取得リクエストからの画像 URL が正しく表示されません。
コンソールでは、API フェッチ リクエスト全体が完了し、データがそこにあることを示していますが、画像は埋め込まれていません。
次のエラーが表示されます。
私が使用している取得リクエストと埋め込みコードは次のとおりです。
取得コード:
埋め込みコード モジュール:
この問題を解決しようとして髪を引き裂いてきたので、これに関する助けに感謝します。
google-chrome - COEP ヘッダーの追加後に Recaptcha V2 が機能しない (クロス オリジン アイソレーション)
私は、webapp の一部の機能に SharedArrayBuffer を使用しています。Chrome バージョン 92 では、こちらの手順に従ってクロス オリジン分離を有効にし、次のヘッダーをルート ページとwasmファイルに追加しました。
その後、wasmファイルは正常にロードされました。
しかし、今はReCaptchaV2を追加できません。メイン スクリプトを取得する最初のリクエストは成功しましhttps://www.google.com/recaptcha/api.js...たが、後続の iframe にhttps://www.google.com/recaptcha/api2/anchor...よる URL の読み込みが Chrome によってブロックされています。(理由: This resource needs Cross-Origin-Resource-Policy: same-site/cross-origin header)
この問題をしばらく回避する方法の 1 つは、Chrome からトークンを取得SharedBufferArrayして、トライアル トークンを取得し、それを使用して使用できるようにすることです。https://developer.chrome.com/blog/enabling-shared-array-buffer/#origin-trialを参照してください。しかし、いくつかのオリジンを処理する必要があるため、これはスケーラブルなことではないかもしれません。
Cross Origin Isolation (COEP Headers) で ReCaptcha を使用する他の方法はありますか?