Help us understand the problem. What is going on with this article?

CookieとWebStorageとSessionについてのまとめ

CookieとWebStorageの違いまとめ

アプリを作ってるとCookieとWeb Storageどっちがいいんだろうなんてことがあったりするので、良い機会なのでまとめておくことにします。
Web StorageにはSessionStorageとLoacalStorageの二種類があるので、全部対比してみます。

項目 Cookie Local Storage Session Storage
保存場所 ブラウザ ブラウザ ブラウザ
データの型 文字列のみ 文字列のみ 文字列のみ
有効期限 任意に設定 消さない限り半永久的 セッションやタブを閉じるまで
保存容量 最大4KB 5MB~10MB 5MB~10MB
サーバにデータ送信 自動送信する しない しない
操作する人 サーバー側の言語が多い(php等) jsのみ jsのみ

ざっとこんな感じですかね?

WEBストレージは、保存容量が大きいですね。幅があるのはブラウザによって違うからです。あとはサーバー側にいちいちデータの通信をしないところがクッキーとの大きな違いですね。
ちなみに、ローカルストレージはオリジン単位(プロトコル://ドメイン名:ポート番号)でデータを保存するので、当然、別ウィンドウやブラウザを閉じてもデータは共有され続けます。一方、セッションストレージは同じドメインのサイトを別々のウィンドウで開いていても、それぞれが別のsessionStorageとなることに注意っす。

クッキーはWEBストレージより有効期限が自由に設定できますね。

クッキーはサーバー側からクライアントに対してクッキーをセットするようにレスポンスを返す必要があるので、サーバー側の言語で書かれることが多いです。一方、WEBストレージは完全にクライアント側の操作なので基本的に値の取得だろうとセットだろうとjsでしか操作しません。

Sessionについて

SessionとCookieってどう違うんですかという質問がちょこちょこありますのでこっちも書いておこうかと。(Sessionは本来Cookieをもとに成り立っている仕組みだからそもそも質問自体がちょっと変だったりするのですが、かくいう僕も昔はちんぷんかんぷんだったので気持ちわかりまくります)

Sessionとは「ある一連の処理の始まりから終わりまで」を意味する概念で、(例えばログインしてもろもろの操作してログアウトするまで)一連の流れを管理できるように「クッキー」や「ファイル」などを使ってユーザ識別する仕組みのことっす。
本来HTTP通信はステートレスなのでHTTP通信単体では情報の維持ができません。オンラインショッピングとかログインしてあれこれだとかユーザに紐づいた処理をするには、こういう仕組みが必要になるわけです。

Sessionの管理方法は色々とあるらしいんですけど、一般的なのはCookieとファイルを用いた管理方法ですかね。
仕組みとしては、sessionIDという一意のIDをユーザのクッキーに保存し、さらにそのIDに紐づくセッションファイルをサーバーのハードディスク上に作成します。(PHPならsession_startという関数がこれをしてくれる)
その後の通信ではクッキーにsessionIDがあるかどうかを常に確認し、追加のセッション情報を保存するときはIDに紐づくセッションファイルにどんどん値を追加していくことになる感じですね。

ただ、もちろん方法はこれだけじゃないです。
例えば、クッキーを用いずにGetパラメタにSessionIDを仕込んだり、ファイルじゃなくてRedisなどのKVSに、SessionIDに紐づくデータを格納したりする場合もあります。

まあ要するに、「ユーザに対して一意のIDを割り振ってユーザ識別を可能にして、そのIDに紐づくデータを一定期間内サーバー上で保存する」ことが達成できればいいわけですね。

そんなわけで、Sessionとクッキーやウェブストレージは全然別物で、Sessionはある一連の処理の流れをステートレスなHTTP通信の中で達成するための仕組みで、クッキーやウェブストレージは単にクライアント側に値を保存する機能のことですね。

強いてセッションとクッキーとの違いはと尋ねられたら

クッキーは、
・情報の保存場所はサーバー側になる。(ただしsessionIDの管理でクッキーを使うならブラウザも使うことになる)
・有効期限のデフォルトは24分程度(可変)

こんな感じになりますかね?
僕自身もそこまで詳しいわけではありませんので、ご指摘あったらお願い致します。

ではでは!!

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした