CORS (Cross-Origin Resource Sharing) の概要 CORS とは何ですか?

CORS (Cross-Origin Resource Sharing) は、Web ブラウザーによって実装されるセキュリティ機能で、Web アプリケーションが Web ページを提供したドメインとは異なるドメインにリクエストを行うことを許可または制限します。 。簡単に言うと、CORS は、あるドメイン上のリソースに別のドメインの Web ページからアクセスできるかどうかを決定します。

デフォルトでは、Web ブラウザーは同一生成元ポリシーを適用し、Web ページがそのページを提供したドメインとは異なるドメインにリクエストを送信することをブロックします。これは、悪意のある Web サイトが他の Web サイト上の機密データにアクセスするのを防ぐために行われます。ただし、場合によっては、Web アプリケーションが別の送信元 (ドメイン、プロトコル、ポート) からリソースを要求する必要がある場合、CORS が役に立ちます。

CORS の動作

あるドメイン上の Web アプリケーションが別のドメインからデータをリクエストする必要がある場合、リクエストの発信元を示す特定のヘッダーを含む HTTP リクエストを送信します。要求されたリソースをホストするサーバーは、応答で適切な CORS ヘッダーを送信することで、要求を許可するかどうかを決定する必要があります。

たとえば、http://example.com でホストされるフロントエンド アプリケーションを構築していて、http://api.example2.com からデータをフェッチする必要がある場合、CORS ヘッダーによりサーバーは api.example2 にアクセスできます。 com を使用して、example.com.

からのリクエストを許可するかどうかを指定します。

一般的な使用例

CORS は通常、次のシナリオで必要になります。

サードパーティ API アクセス: 最新の Web アプリケーションの多くは、認証、支払い処理、ソーシャル メディア統合などのサービスを外部 API に依存しています。 CORS は、これらの API が異なるドメインでホストされている場合に必要です。

フロントエンドとバックエンドの通信: Web アプリケーションのフロントエンドとバックエンドが異なるドメインまたはサブドメインでホストされている場合、それらの間の通信を許可するために CORS が使用されます。

CDN (コンテンツ配信ネットワーク): Web サイトは多くの場合、画像、スタイルシート、JavaScript ファイルなどの静的アセットを提供するために CDN を使用します。 CORS により、メイン サイトは、別のオリジンでホストされている CDN からこれらのリソースをリクエストできます。

CORS の主要なパラメーターとインジケーター

Access-Control-Allow-Origin: このヘッダーは CORS で最も重要であり、どのオリジンがリソースへのアクセスを許可されているかを示します。次のように設定できます:

特定のオリジン (Access-Control-Allow-Origin: https://example.com)
ワイルドカード (Access-Control-Allow-Origin: *)。任意のオリジンがリソースにアクセスできるようにします。ただし、これは認証情報を含むリクエストでは許可されません。
Access-Control-Allow-Methods: リソースへのアクセス時にどの HTTP メソッド (GET、POST、PUT、DELETE など) を許可するかを指定します。例:
アクセス制御許可メソッド: GET、POST、PUT

Access-Control-Allow-Headers: 実際のリクエストを行うときに使用できる HTTP ヘッダーをリストします。たとえば、リクエストに X-Custom-Header のようなカスタム ヘッダーが含まれている場合は、ここで指定する必要があります:
Access-Control-Allow-Headers: X-Custom-Header、Content-Type

Access-Control-Allow-Credentials: リクエストに Cookie、HTTP 認証、クライアント側の証明書などの資格情報を含めることができるかどうかを示します。これは、認証が必要な API にとって重要です。例: Access-Control-Allow-Credentials: true

Access-Control-Expose-Headers: ブラウザーが要求側クライアントに公開するヘッダーを指定します。デフォルトでは、ブラウザーは Cache-Control や Content-Type などの限られたヘッダー セットのみを公開しますが、Access-Control-Expose-Headers を使用すると追加のヘッダーを利用できるようになります。

Access-Control-Max-Age: プリフライト リクエスト (以下を参照) の結果をブラウザーがキャッシュできる期間を定義します。プリフライト リクエストの数を減らすことにより、パフォーマンスの向上に役立ちます。例:
Access-Control-Max-Age: 86400 (24 時間)

プリフライト リクエスト: 特定の種類のリクエスト、特にサーバー データを変更するリクエスト (PUT や DELETE など) の場合、ブラウザは HTTP OPTIONS メソッドを使用してプリフライト リクエストを送信します。これにより、実際のリクエストが安全に送信できるかどうかがサーバーに確認されます。プリフライト リクエストに対するサーバーの応答によって、ブラウザが実際のリクエストを続行するかどうかが決まります。

CORS が必要になるのはいつですか?

CORS は次の場合に必要です。

クロスオリジンリクエストは、フロントエンドとバックエンドが異なるドメインまたはポートから提供されている場合、またはアプリケーションから外部 API にアクセスしている場合に行われます。

CDN またはサードパーティ サービスでホストされているリソースへのアクセス: たとえば、CDN からフォント、画像、またはその他のアセットを読み込む場合、サイトがそれらにアクセスできるようにサーバーに CORS ヘッダーが含まれている必要があります。

セキュリティ上の懸念: CORS を有効にするとクロスオリジン リクエストが許可されますが、アプリケーションが悪意のある攻撃にさらされないように慎重に構成する必要があります。信頼できるオリジンのみを許可し、機密性の高い操作は認証トークンなどの追加のセキュリティ手段で保護する必要があります。

結論

CORS は、異なるオリジン間でリソースを安全かつ制御された共有を確保するための重要なメカニズムです。適切に構成すると、ユーザーをセキュリティ リスクから保護しながら、最新の Web アプリケーションがサードパーティのサービスや API と対話できるようになります。 CORS ヘッダーの構成方法を理解し、それらがいつ、なぜ必要になるかを知ることは、API、CDN、またはマルチドメイン アプリケーションを扱う Web 開発者にとって不可欠です。

以上がCORS (Cross-Origin Resource Sharing) の概要 CORS とは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。