【くっきー】

Cookie とは?

💡 Webサイトがブラウザに渡す「小さなメモ」
📌 このページのポイント
Cookieの仕組み ブラウザ (クライアント) サーバー (Web) ① 初回リクエスト(GET /) ② レスポンス + Set-Cookie: id=abc123 ③ Cookieを保存 id=abc123 → ローカル保存 Cookie保存領域 ④ 次回リクエスト + Cookie: id=abc123(自動送信) ⑤ Cookieを読み取り ユーザーを識別・状態復元
Cookieの仕組み
ひよこ ひよこ

Cookieって何のためにあるの?

ペンギン先生 ペンギン先生

HTTPは「ステートレス」(前回の通信を覚えていない)プロトコルだから、Cookieがないと「ログインしたのに次のページでログアウトされる」状態になるよ。CookieにセッションIDを保存することで「この人はさっきログインした人」と識別できるんだ

ひよこ ひよこ

Cookieの同意バナーってなに?

ペンギン先生 ペンギン先生

EU のGDPR(一般データ保護規則)で、トラッキング用Cookieの使用にはユーザーの同意が必要になったよ。だから多くのサイトで「Cookieを許可しますか?」というバナーが表示される。機能に必須なCookie(ログイン用)は同意不要だけど、広告トラッキング用は同意が必要なんだ

ひよこ ひよこ

おもしろい!サードパーティCookieの廃止って?

ペンギン先生 ペンギン先生

訪問しているサイト以外のドメインが設定するCookieがサードパーティCookie。広告ネットワークがユーザーの閲覧行動を追跡するのに使われてきた。プライバシー保護の流れでSafariは既にブロック、ChromeもPrivacy Sandboxへの移行を進めているよ

ひよこ ひよこ

Cookieのセキュリティ設定は?

ペンギン先生 ペンギン先生

①httpOnly(JavaScriptからアクセス不可→XSS対策)、②Secure(HTTPS通信時のみ送信)、③SameSite=Lax/Strict(別サイトからのリクエスト時に送信しない→CSRF対策)、④適切なExpires/Max-Age(有効期限)。セッションCookieには3つ全て設定するのがベストプラクティスだよ

ペンギン
まとめ:ざっくりこれだけ覚えればOK!
「Cookie」って出てきたら「Webサイトがブラウザに保存する小さなデータ」と思えればだいたいOK!
📖 おまけ:英語の意味
「HTTP Cookie」 = HTTPクッキー
💬 Magic Cookie(プログラム間で受け渡すデータ)が語源。お菓子のクッキーとは別物だよ
← 用語集にもどる