【サーバーNo.49】今更聞けない!プリフライトリクエストをサクッと解説

サーバー サーバー
この記事は約4分で読めます。

プリフライトリクエストについて知識のない方でも理解できるよう、この記事ではわかりやすく解説します。プリフライトリクエストがなぜ重要で、どのような状況で利用されるのかを具体例を交えながら説明します。

プリフライトリクエストとは?

プリフライトリクエストは、クロスオリジンリクエスト(異なるドメイン間のリクエスト)を行う際に、ブラウザが送信先サーバーに事前に送信する確認のリクエストです。これにより、送信先がリクエストを受け入れるかどうかを確認することができます。これがクロスオリジンリソースシェアリング(CORS)の一部として機能します。

わかりやすい具体的な例1

例えば、ウェブページがユーザーから入力されたデータを別のドメインに送信する場合、まずブラウザはプリフライトリクエストを送信します。これは「このデータを送信しても問題ないですか?」とサーバーに確認するようなものです。サーバーが適切なレスポンスヘッダーを返すと、ブラウザは実際のデータ送信を行います。これにより、安全性が確保されます。

わかりやすい具体的な例2

また、オンラインショッピングサイトが外部の決済サービスを利用する際にもプリフライトリクエストが使われます。ユーザーが購入を確定すると、ブラウザはまず決済サービスのサーバーにプリフライトリクエストを送信し、データのやり取りが許可されているかを確認します。これにより、不正なアクセスやクロスサイトスクリプティングから守られます。

プリフライトリクエストはどのように考案されたのか

プリフライトリクエストは、ウェブのセキュリティを強化するために考案されました。特に、CORSの導入に伴い、異なるドメイン間でのデータのやり取りが頻繁に行われるようになったため、セキュリティ上の懸念が高まりました。

考案した人の紹介

プリフライトリクエストは、ウェブ技術の標準化を進めるW3C(World Wide Web Consortium)によって提案されました。W3Cは、ウェブのセキュリティと相互運用性を向上させるための規格を策定し、インターネットの発展に寄与しています。

考案された背景

プリフライトリクエストが考案された背景には、ウェブアプリケーションがAPIを通じて異なるドメインとデータをやり取りする必要が増えてきたことがあります。これにより、クロスオリジンのリクエストがより安全に行えるようにするために、この技術が開発されました。

プリフライトリクエストを学ぶ上でつまづくポイント

プリフライトリクエストは、初心者がCORSを学ぶ際に最もつまづきやすい部分です。特に、リクエストヘッダーの理解や、どのような条件でプリフライトリクエストが発生するのかが難しい点です。また、ブラウザが自動で送信するため、開発者は時としてこのリクエストを見逃しがちです。

プリフライトリクエストの構造

プリフライトリクエストは、OPTIONSメソッドを使用して送信され、Access-Control-Request-MethodAccess-Control-Request-Headersといったヘッダーを含みます。これにより、ブラウザが実際のリクエストを送信する前にサーバーが対応可能かどうかを確認します。

プリフライトリクエストを利用する場面

プリフライトリクエストは、クロスオリジンのPUTDELETEメソッドを使用する場合に多く利用されます。また、特定のカスタムヘッダーを使用する場合にも発生します。

利用するケース1

例えば、ウェブアプリケーションがデータを外部のAPIに送信して更新する際、PUTメソッドが使用されます。この際、プリフライトリクエストが送信され、サーバーがそのメソッドを許可しているかを確認します。

利用するケース2

もう一つのケースとして、ユーザーがファイルをアップロードする際に、カスタムヘッダーを使用する場合があります。プリフライトリクエストを通じて、サーバーがそのカスタムヘッダーを受け入れるかどうかを確認します。

さらに賢くなる豆知識

プリフライトリクエストが送信されるタイミングは、ブラウザによって異なる場合があります。また、プリフライトリクエストが不要となる条件も存在し、たとえば単純なGETリクエストや、標準的なヘッダーのみを使用する場合にはプリフライトリクエストが省略されることがあります。

あわせてこれも押さえよう!

  • CORS
  • クロスオリジンリソースシェアリング(CORS)は、異なるドメイン間でリソースを共有するための仕組みです。

  • OPTIONSメソッド
  • OPTIONSメソッドは、サーバーが許可しているHTTPメソッドを問い合わせるためのリクエストです。

  • Access-Control-Allow-Originヘッダー
  • このヘッダーは、どのオリジンがリクエストを許可されているかを指定します。

  • Access-Control-Allow-Methodsヘッダー
  • サーバーが許可しているHTTPメソッドを指定するヘッダーです。

  • Access-Control-Allow-Headersヘッダー
  • サーバーが許可しているリクエストヘッダーを指定するためのヘッダーです。

まとめ

プリフライトリクエストを理解することで、ウェブアプリケーションのセキュリティや、クロスオリジンのデータ通信をより安全に行うための知識が深まります。これにより、より安全で信頼性の高いウェブサービスを提供することが可能になります。