sessionStorage
プロパティで、セッション Storage
オブジェクトにアクセスできます。sessionStorage は Window.localStorage
に似ています。唯一の違いは、localStorage に保存されたデータに期限がないのに対して、sessionStorage に保存されたデータはページのセッションが終了するときに消去されます。ページのセッションはブラウザを開いている限り、ページの再読み込みや復元を越えて持続します。新しいタブやウィンドウにページを開くと、新しいセッションが開始します。これは、セッション Cookie の動作とは異なります。
構文
// sessionStorage にデータを保存する sessionStorage.setItem('key', 'value'); // sessionStorage に保存したデータを取得する var data = sessionStorage.getItem('key'); // sessionStorage に保存したデータを削除する sessionStorage.removeItem('key')
値
Storage
オブジェクト。
例
以下のスニペットは、現在のドメインのセッション Storage
オブジェクトにアクセスして、Storage.setItem()
を使用してデータアイテムを追加します。
sessionStorage.setItem('myCat', 'Tom');
以下の例はテキストフィールドの内容を自動的に保存して、ブラウザが意図せず再開されたときに、記入した内容を失わないようにテキストフィールドの内容を復元します。
// 追跡するテキストフィールドを取得する var field = document.getElementById("field"); // 自動保存された値があるかを確認する // (これはページが意図せず再開された場合にのみ存在する) if (sessionStorage.getItem("autosave")) { // テキストフィールドの内容を復元する field.value = sessionStorage.getItem("autosave"); } // テキストフィールドの変更をリッスンする field.addEventListener("change", function() { // セッションストレージオブジェクトに結果を保存する sessionStorage.setItem("autosave", field.value); });
注記: 詳細な使用例は Web Storage API を使用する の記事を参照してください。
仕様
仕様書 | 策定状況 | コメント |
---|---|---|
Web Storage (Second edition) sessionStorage の定義 |
勧告 |
ブラウザ実装状況
機能 | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
---|---|---|---|---|---|
localStorage | 4 | 3.5 | 8 | 10.50 | 4 |
sessionStorage | 5 | 2 | 8 | 10.50 | 4 |
機能 | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
基本サポート | 2.1 | ? | 8 | 11 | iOS 3.2 |
すべてのブラウザで、localStorage および sessionStorage が受け入れる容量は異なります。さまざまなブラウザのストレージ容量を報告しているページがあります。
注記: iOS 5.1 より Safari Mobile は localStorage データを cache フォルダに保存しており、概して空き容量が少ない場合に OS の要求により、時々クリーンアップを受けます。