ホームページ >ウェブフロントエンド >jsチュートリアル >フェッチ使用時の「No Access-Control-Allow-Origin」エラーを回避するにはどうすればよいですか?

フェッチ使用時の「No Access-Control-Allow-Origin」エラーを回避するにはどうすればよいですか?

DDD
DDDオリジナル
2024-12-14 10:17:10138ブラウズ

How Can I Bypass

フェッチ リクエストでの CORS の使用

フェッチを使用してクロスオリジン リソースにアクセスしているときに、「アクセス制御なし」というエラーが発生するのが一般的です。 「許可元」エラー。これにより、クロスオリジン制限により、クライアント側の JavaScript が応答にアクセスできなくなります。

Fetch に { mode: 'no-cors' } を渡す

期待に反して, { mode: 'no-cors' } では問題は軽減されません。代わりに、応答本文とヘッダーのコンテンツへの JavaScript アクセスを厳密にブロックします。

解決策: CORS プロキシ

これを克服するには、CORS プロキシを使用できます。プロキシは、クライアントとターゲット Web サイトの間に存在します。リクエストを受け取り、ターゲット サイトに転送し、応答を受け取ります。重要なのは、プロキシが「Access-Control-Allow-Origin」応答ヘッダーを追加することです。これにより、クライアント コードが応答にアクセスできるようになります。

Postman がエンドポイントにアクセスできる理由

Postman は「Access-Control-Allow-Origin」ヘッダーなしでエンドポイントへのアクセスを許可しますが、Web ブラウザーはクロスオリジンを強制します 制限。このヘッダーは、クライアント側の JavaScript が応答と対話するために必須です。

CORS の無効化に関する誤解

「CORS を無効にする」ことを目的とする場合、実際に意図されているのは次のとおりです。同一オリジンポリシーを無効にします。実際、CORS は、特定のクロスオリジン アクセスを許可することでこのポリシーを緩和する方法を提供します。

いつ使用するか { mode: 'no-cors' }

{ mode: 'no-cors' } は特定のシナリオでのみ考慮する必要があります:

  • コンテンツの埋め込みHTML 要素は JavaScript を使用しますが、その属性を介して直接ではありません。
  • Service Worker と Cache Storage API を使用してリソースをキャッシュします。

ただし、これらの場合にも制限があり、考慮すべき重要な要素。

以上がフェッチ使用時の「No Access-Control-Allow-Origin」エラーを回避するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。