HTTPに「記憶」を宿す魔法――Cookieの仕組みを紐解く
こんにちは!ネットワークの世界へようこそ。
Webサイトを見ているとき、ログインした状態が維持されたり、カートに入れた商品が消えなかったりするのは当たり前のように感じますよね。でも、実はHTTPというプロトコルは、本来「極めて物忘れの激しい性格」なんです。
今回は、そんなHTTPに「記憶」という魔法をかける技術、「Cookie(クッキー)」について、一緒に紐解いていきましょう。
—
1. なぜHTTPは「物忘れ」が激しいのか?
HTTP通信を「郵便配達」に例えてみましょう。
サーバーは郵便局員、ブラウザはあなたのお家です。HTTPの原則は「一問一答」。あなたが「このページを見せて」と手紙(リクエスト)を出し、局員が「はい、どうぞ」と荷物(レスポンス)を届けて終わり。局員は、次にあなたが別の手紙を送ってきたとき、「あ、さっきの人だ!」とは認識してくれません。
この「毎回初対面」の状態をステートレス(状態を持たない)と呼びます。これでは、ログイン後のページ移動すらできませんよね。そこで登場したのが、名札代わりの「Cookie」です。
—
2. Cookieの正体:サーバーから渡される「名札」
Cookieとは、サーバーからブラウザへ送られる「小さなメモ書き」のことです。
1. Set-Cookieヘッダー(サーバー→ブラウザ)
サーバーが「次はこれを見せてね」と、ブラウザにメモを渡します。
2. Cookieヘッダー(ブラウザ→サーバー)
次にブラウザがサーバーへ行くとき、ポケットからそのメモを取り出して、「私、これ持ってます!」と提示します。
実際のやり取りを見てみよう
サーバーが送る「Set-Cookie」は、こんな感じです。
サーバーからの応答(Set-Cookie)
Set-Cookie: session_id=abc123xyz; Max-Age=3600; Path=/
- `session_id=abc123xyz`: これが名札の中身(ID)です。
- `Max-Age=3600`: 「1時間(3600秒)経ったら捨ててね」という期限です。
—
3. セキュリティを守るための「重要属性」
Cookieは便利な反面、悪意のあるサイトに盗み見られる危険もあります。そこで、現代のWeb開発では「3つの盾」を使いこなすことが必須です。
① Secure(HTTPS通信の守り)
「このメモは、盗聴を防ぐ暗号化通信(HTTPS)のときだけ使ってね」という設定です。これがないと、フリーWi-Fiなどで通信が傍受されたとき、Cookieの中身が丸見えになってしまいます。
② HttpOnly(JavaScriptからの隠蔽)
「JavaScriptからはこのメモを触らせない」という設定です。これを設定しておくと、もしサイトに悪意のあるスクリプトが仕込まれても、Cookieを盗み出されるリスクを大幅に減らせます。
③ SameSite(クロスサイト攻撃への防御)
「別のサイトから飛んできたときに、このメモを見せていいか?」を決める設定です。
- `Strict`: そのサイトを開いている時のみ送信。
- `Lax`: リンクをクリックして移動した時などは送信(現代の標準)。
—
4. まとめて設定してみよう!
実際に開発現場でよく使う、安全性を高めたCookieのサンプルがこちらです。
セキュリティを考慮したSet-Cookieの例
Set-Cookie: user_session=token_value_here; \
Secure; \
HttpOnly; \
SameSite=Lax
- Secure: 暗号化された通信でしか送らない!
- HttpOnly: プログラム(JS)から盗み見させない!
- SameSite=Lax: 悪意ある外部サイトからの勝手なアクセスには反応しない!
—
最後に:一歩ずつ理解すれば怖くない
Cookieは、一見すると英単語が並ぶだけの無機質なものに見えます。でも、その本質は「物忘れが激しいHTTPに、どうやって信頼関係を築かせるか」という、エンジニアたちの工夫の結晶なんです。
デバッグの際は、ブラウザの開発者ツール(F12キー)を開いて、「Application」タブの「Cookies」を眺めてみてください。普段何気なく見ているWebサイトが、どんな「メモ」をあなたに渡しているのか、その裏側が見えてくるはずです。
ネットワークの世界は奥が深いですが、まずはこの「名札」の仕組みから、少しずつ手繰り寄せていきましょう。また次回の記事でお会いしましょう!
コメント