1_Cookie(クッキー)の概要
Cookieは、Webサイトがユーザーのブラウザに保存させる小さなデータで、次回以降のアクセス時にそのサイトへ自動的に送信されます。

そもそもなんですけど、なぜCookieが必要なんですか?

もともとステートレス(状態を持たない)なWeb通信に「状態」を持たせる役割を果たします。

「Web通信のステートレスな状態」とやらがよく分かりません・・・

Web通信は「1回リクエスト→1回レスポンス」で完結し、サーバー側に前後のやり取りを覚えておく仕組みを持っていません。
Cookieを使うと、ブラウザに小さなデータ(例:セッションIDや設定値)を保存し、次のリクエストで毎回自動的に送信することで「状態」を追跡できます。まあ、中々イメージがつかないと思いますので、以下にCookieがない場合とある場合の通販サイトの挙動で解説したいと思います。
1-1_Cookieがない場合(例:通販サイト)
❶ビールの商品ページをリクエスト(利用者)
❷商品ページを返却(Webサイト)
❸商品をカートに追加(利用者)
❹カート内容の一覧ページをリクエスト(利用者)
❺一覧ページを返却(Webサイト)
❻一覧ページに追加したはずの商品がない(利用者)

❶❷❸と❹❺❻の流れについては、通信のまとまりとしては別であり、紐づける情報がないため、追加した商品がカート内容一覧ページに反映されない。
1-2_Cookieがある場合(例:通販サイト)
❶ビールの商品ページをリクエスト(利用者)
❷商品ページを返却(Webサイト)
❸商品をカートに追加(利用者)
❹カート内容の一覧ページをリクエスト(利用者)
❺Cookie情報を元に対象者を識別し、❹までの通信内容を踏まえたページを用意する(Webサイト)
❻一覧ページを返却(Webサイト)
❼追加した商品がカートに表示されている(利用者)

2_Cookieの役割
Cookie(クッキー)には、様々な情報を記入することが出来るので、その役割は様々です。以下に使用される役割の例を示します。
- 例1セッション管理
目的 : ログイン状態をページ移動しても維持する
具体例
●利用者がネットショップにログインして買い物かごを開き、別の商品ページへ移動してもログアウトされない 。
●ログイン後に表示される「こんにちは、○○さん!」の表示が、ページを切り替えても消えない - 例2ユーザー設定の保持
目的 : 言語選択や見た目テーマなど、自分好みの表示を覚えておく
具体例
●ニュースサイトで「English」を選択したら、次回アクセス時も最初から英語版が表示される。
●ブログで「ダークモード」をONにしたら、翌日もサイトが黒背景で表示される - 例3トラッキング・分析
目的: ページの閲覧数や行動パターンを集計し、サービス改善や広告に活用する
具体例
●訪問した記事タイトルの一覧をCookieで追い、気になるジャンルの記事を「あなたにおすすめ」として表示
●ショッピングサイトで「この商品を見た人はこんな商品もチェック」とリコメンドする
3_Cookieが利用されるまでの流れ
3-1_利用者のアクセス ~ WebサイトがCookie情報をページと共に返却
❶通販サイトのトップページをリクエスト(利用者)
❷sessionIDを発行(Webサイト)
❸通信のSet-CookieフィールドにsessionIDを含めて、トップページを返信する

3-2 Cookie情報の保存 ~ 毎回の通信で利用
❹Webサイトから変身されたCookie情報を、PCに保存(利用者)
❺別のページのリクエストの際に、cookie情報を通信に含めて送信(利用者)
❻sessionIDを識別することで、リクエスト元を判断(Webサイト)
❼これまでの通信と整合性を取った上で、ページを返却する(Webサイト)

コメント