前回のCookieから少し追加。
LocalStorage
LocalStorageはHTML5で新しく導入された。
サイズはCookieのわずか4kbから増加し5MBに。開発者にとって使いやすくなり、使い方も簡単。
localStorageの詳細をいくつか。
セキュアページ(httpとhttps)のLocalStorge値の分離
ブラウザーはプロトコル、ホスト名、一意のポート(オリジン)に基づいてLocalStorage値を分離。
これによって悪意のあるサイトがLocalStorageにアクセスすることは出来ない。ホスト名の分離は当然。
けれど、プロトコル(httpとhttps)も分離されているのはなぜなのか.
分離の結果、http://example.comのLocalStorageに保存された値は、https://example.comのページからアクセスできなくなる。その逆も同様。
そのためサイト管理者は、サイトでhttpページとhttpsページの両方でアクセスできる場合に注意必要。
ユーザーのアクセスURLが切り替わった際に、情報を共有できないため思わぬ動作する可能性。
Firefoxは影響を受けない独自のGlobalStorageなるものがあるらしい。
ポルノモードで作成されたLocalStorageの値は分離
ブラウザーの起動には
通常モード以外にもプライベート、シークレット、セーフモード、まとめてポルノモードと呼ばれるものがある。
この方法で起動すると、LocalStorage用の新しい一時データベースが作成。
LocalStorageに保存されたすべての値はポルノモードでのブラウジングセッションが閉じられると破棄される。
LocalStorageはよりSessionStorageのような動作に。
ブラウザーのセッション再開ではポルノモードのセッションが再開されない。
ウィンドウを閉じた後にSessionStorageに作成されたコンテンツも消える。
ポルノモードでのセッション中にLocalStorage、SessionStorageに保存されたデータは、ウィンドウが閉じられるとすぐに失われる。
ポルノモードという名のとおり、一時的な保存で使用した跡に形跡は残さない。
LocalStorageは5MBを超えることはできない
技術的にLocalStorageは、
同じプロトコルとポートを使用する同じホストのサブドメインがLocalStorageオブジェクトにアクセスすることは禁止していない、つまり可能。
一部のブラウザでは「ex1.example.com」と「ex2.example.com」に独自の5MBのLocalStorageを設ける回避策を使用。
両方のサイトが同じオリジンにあるため、互いの値にアクセス可能。
example.comの共有ドメイン上のサイトがすべてStorageを共有することを意味する。セキュリティ上の脅威になりかねない。
技術的な回避策はあるが、Storageの仕様では明確に廃止。5MB以内に収めるのが現実的な使い方。
SessionStorage
値の保持
SessionStorageの値は、ブラウザーセッションが終了したときに破棄。通常、ウィンドウが閉じられたとき。
LocalStorageとは異なり、SessionStorageはユーザーのブラウザに値を長期間保存するようには設計されていない。
例外もあって、ブラウザーがセッションの復元機能を提供する場合。
ブラウザーはクラッシュから迅速に回復できるよう設計されており(ユーザーのストレスをためないため)、SessionStorageの値も復元される。
サーバーでは新しいセッションになるが、ブラウザーからは再起動後もクラッシュ前のセッションが継続される。
SessionStorageは、ユーザーフォームの値を一時的にバックアップ。
入力時にSessionStorageに入力を保存。
ページの読み込み時に復元。
ブラウザーのクラッシュや予期しないページの更新(誤ってリンクをクリックなど)からすばやく回復できるように。
クラッシュから回復する場合、通常ブラウザ自身で行う。
結果、ユーザーが再入力する手間を省く。
なかには再起動しても、値を保持するブラウザもあるよう。推奨されない。