🔖
【初学者によるまとめ】この一冊で全部わかるWeb技術の基本 「Chapter3」＞「13 Cookie（クッキー）」
目的：「イラスト図解式 この一冊で全部わかるWeb技術の基本」の要点を自分なりにまとめアウトプットして理解力の向上に努める。
| 注意点 |
|---|
| 🤔 ←この絵文字の文章は個人的な見解になります。的外れなこともあるかと思います。 |
| 例）🤔<(感想、考察、疑問点など) |
（参考書籍）
（参考サイト）
:::note info
HTTPはステートレスなプロトコルなので処理結果前後の"状態"を保持する仕組みが無い
⇒Cookieというデータを用いる
:::
Cookieのやりとり
[サーバー]
- 接続してきたWebブラウザに対して、コンテンツなどと合わせてCookieを送信する
- Cookieに載せた情報はWebブラウザに保存してもらう
- Cookieにはブラウザに保存してもらいたい情報を載せる
（ECサイトにおいて買い物カゴに入れた商品群など）
- Cookieにはブラウザに保存してもらいたい情報を載せる
[ブラウザ]
- サーバーから送信されたCookieはWebブラウザ側で保存
- 接続の際に保存したCookieをサーバーに送信することで、Webサーバーに「誰が接続してきたか」を識別する
（画像１：Cookieの送受信の全体像）
（画像２：HTTPレスポンス/リクエストに含まれるCookie）
| 名称 | 詳細 | 種別 |
|---|---|---|
| Set-Cookie | 状態を保持・管理するための情報（Cookie） | レスポンスヘッダーフィールド |
| Cookie | Webサーバーから受け取ったCookieの値 | リクエストヘッダーフィールド |
メッセージヘッダーの利用
- Cookieの送信にはHTTPメッセージの"メッセージヘッダー"を利用し、Cookieに関する様々な情報を載せられる
- レスポンス時には「Set-Cookie」ヘッダーに情報を載せる
- リクエスト時には「Cookie」ヘッダーに情報を載せる
| 属性 | 詳細 | |
|---|---|---|
| name | Cookieの名前 | string型 |
| name=value | Cookieの名前とその値 | string型 |
| expires=date | Cookieの有効期限を「日付・時刻」で指定 |
number型※この属性を指定しなかった場合に"セッションCookie"となる |
| max-age=seconds | Cookieの有効期限を「秒数」で指定 |
number型※"expires"と"max-age"の両方が指定されている場合は"max-age"が使用される |
| secure | HTTPS（暗号化通信）の時のみCookieを送信するという条件指定 | boolean型 |
| httponly | JavaScript経由(Document.cookieなど)でのCookieへの参照可否の指定 | boolean型 |
| domain=DOMAIN_NAME | Cookieが利用されるドメイン名（サイトURL） | string型 |
| path=PATH | Cookieを送受信したいサーバー上のリソースのパス |
string型・指定したパスにアクセスした場合にCookieを送信する ※未指定の場合はCookieを発行したリソースに対してのみCookieを送信する点に注意 |
セッションCookie
〇Cookieには有効期限を設定できる（expires）
- "有効期限が設定されていないCookie" … Webブラウザが閉じられると同時に削除される
- この場合のCookieを
セッションCookieという
- この場合のCookieを
- "有効期限が設定されているCookie" … Webブラウザが閉じても同時に削除されない
有効期限が来るまでWebブラウザ上に残る- Cookieはブラウザの識別の役割があるため第三者に盗まれると'なりすまし'のリスクが伴う
⇒セキュリティの観点からECサイトの買い物カゴは セッションCookie が利用される
- Cookieはブラウザの識別の役割があるため第三者に盗まれると'なりすまし'のリスクが伴う
[個人的疑問・所感など]
・楽天市場の買い物カゴは少なくとも セッションCookie ではなかったのだけれどメジャーではないのかな？
・Twitchなどを確認してもクッキーの path 属性は'/'だったので 'path=/' が一般的（特定のリソースに限定してCookieを送信するというのがあまり無い？）
Discussion