はじめに
Web APIについて理解が曖昧だったため、「プロになるための Web技術入門」を参考に、備忘録としてまとめました。
Web APIに関する主要技術・プロトコル
シンプルクロスオリジンリクエスト
①GETメソッドやHEADメソッドなどのサーバ側に影響を及ぼさないメソッド
②HTMLフォームで送信可能なPOSTリクエスト
- プリフライトリクエスト（事前確認リクエスト）は送信しない
- 送信されるヘッダは
Originのみ
サーバープッシュ
サーバ側を基点としてクライアント側へ情報を送信すること。
リアルタイム通知などに使用される。
キャッシュ
ブラウザはHTTP通信で取得したデータをデバイス上に保存し、次回以降同様のデータが必要になったときは、保存したデータを再利用する仕組み。
- 通信量の削減
- リロード時の通信量の削減とページ表示の体感速度が向上
- キャッシュには有効期限を設定することができ、その設定はサーバ側で指定可能
Webブラウザが備えるキャッシュの仕組みは ブラウザキャッシュ と呼ばれる。
Comet（ロングポーリング）
ブラウザがサーバにHTTPリクエストを送信すると、サーバ側は意図的にレスポンスを保留し、情報が変化したタイミングでレスポンスを返す仕組み
ブラウザはレスポンスが返ってきたらすぐに再度リクエストを送信し、レスポンスが返ってくるのを待つ。
ポーリング：定期的にサーバに問い合わせを行うこと
Cometの課題
- 高頻度な更新には不向き（再接続が必要なため）
- 通信が切断されやすい
- 情報がリアルタイムで変化する状況では、再接続のタイミングで変化した情報は取得できない（例：為替データ）
HTTPストリーミング
一度のリクエストに対して、サーバから複数回に分けてレスポンスを返す方式。
チャンク転送
リクエストやレスポンスを小さな塊（チャンク）に分割して転送する機能
SSE（Server-sent-events）
- サーバーからクライアントへの一方向通信
- 接続を維持しながらデータを送信できる
- クライアントかサーバのいずれかが通信を止めない限り通信は続く
| タグの種類 | 説明 |
|---|---|
| id | イベントを識別するためのID |
| event | イベントの種類 |
| data | サーバから通知される情報の本体 |
| 一つのイベントの中で複数出力可能 | |
| retry | クライアントが再接続するまでの待ち時間（ミリ秒） |
WebSocket
初めにHTTPで接続を開始し、その後 Upgrade ヘッダーを用いてWebSocketプロトコルへ切り替え（アップグレード）を行う。
- 双方向かつリアルタイムな通信を実現するためのプロトコル
- 送受信に伴うオーバーヘッドが少ない
- プロトコルのアップグレードを行い、HTTPとは別の接続で通信する
WebSocketの課題
- 同時接続数の制限
- プロキシサーバによる通信を妨げる問題
- 負荷分散の問題
- 認証の問題
SSEとWebSocketの違い
| 特徴 | SSE | WebSocket |
|---|---|---|
| 通信方向 | サーバ ⇨ クライアント | 双方向 |
| プロトコル | HTTPベース | 独自プロトコル（Upgrade） |
| 再接続 | 自動で可能 | 手動または実装次第 |
| 主な用途 | 通知、チャット | 株価、ゲーム |
おわりに
今後もWeb APIやリアルタイム通信の理解を深めていきます！