クライアントサイドストレージ – Web Storageについて(その2)
クライアントサイドストレージのWeb Storageについて、補足です。
前回の投稿では、localStorage のサンプルを書きましたが、
ここでは、localStorage と sessionStorage の両方を取り上げて違いを見ていきたいと思います。
前回の投稿では、両者の違いは、「有効期限」「スコープ」と書きましたが、
もう少し具体的に違いをあげていきたいと思います。
localStorage と sessionStorage の違いについて
localStorrageとsessionStorageの違いをわかりやすく比較する為あ、下記の表にまとめました。
| localStorage | sessionStorage | |
|---|---|---|
| 保存容量 | 5MB （ブラウザにより5～10MB） | 5MB （ブラウザにより5～10MB） |
| 有効期限 | 永続的 (または削除するまで) | ウィンドウやタブを閉じるまで (または削除するまで) |
| タブごとの挙動 | 別タブでも共有される | タブごとに保持。共有されない |
| スコープ | 同一出身ポリシーごと | 同一出身ポリシーごと |
| スコープ (別ウィンドウ、別タブ) | 別タブ、 別ウィンドウ からアクセス可能 | 別タブから可能 |
大きな違いは「有効期限」ですが、使用するブラウザのタブごとの挙動の違いも注意が必要です。
ただし、sessionStorageを使用し、別ウィンドウからアクセスした場合は、
アクセス不可ですが、画面内部にiframeを使用して同一出身ポリシーの画面にアクセスした場合は、
同一出身内のsessionStorageの内容にアクセスすることができます。