localStorageとsessionStorageの主な違いは、localStorageは有効期限のないデータを保存し、sessionStorageは1セッションのデータを保存することです。
ほとんどすべてのビジネス組織は、顧客に到達し、提供する製品やサービスを知らせるためにウェブサイトを使用しています。
ウェブサイトを開発するのに役立つ主な言語は、ハイパーテキストマークアップ言語の略であるHTMLです。
HTMLは、ウェブページの構造を構築するのに役立ちます。
CSSやJavaScriptなど、他のすべてのWeb技術は、HTMLをベースにしています。
さらに、HTMLにはさまざまなバージョンがあります。
HTMLの最新バージョンはHTML5です。
HTML5では、SVG、オーディオ、ビデオ、キャンバス、ジオロケーションなどの追加機能が提供されています。
また、HTML5は2つのウェブストレージ機能を提供し、ウェブアプリケーションがユーザーのブラウザ内でデータをローカルに保存することを可能にします。
これはより安全で、ウェブサイトのパフォーマンスに影響を与えることなく、大量のデータを保存することができます。
さらに、localStorageとsessionStorageは、クライアントマシン上にデータを保存するための2つのウェブストレージオブジェクトです。
localStorageとは
localStorageは、有効期限のないデータを保存するためのオブジェクトです。
したがって、このデータはブラウザを閉じても削除されることはありません。
つまり,ユーザはページのローカルストレージに時間制限なくアクセスすることができる. つまり、翌日でも、1週間後でも、1年後でも、データを取得することができるのです。
以下のコードを参照してください。
localStorage.setItem(“firstname”, “Ann”)。
document.getElementById(“result1”).innerHTML = localStorage.getItem(“firstname”)。
上記のコードでは、名前と値のペアを持つローカルストレージを作成しています。
名前は「firstname」、値は「Ann」です。
2行目でfirstnameの値を取得し、result1というidを持つ要素に挿入しています。
さらに、以下のようにすれば、”firstname” という localStorage の項目を削除することができます。
localStorage.removeItem(“firstname”)。
sessionStorageとは
sessionStorageの機能はlocalStorageと似ていますが、1セッション分のデータのみを保存します。
そのため、ユーザーがブラウザのタブを閉じると、データは削除されます。
そこで、セッションストレージにデータを追加しておくと便利です。
そのウィンドウで開かれた同じサイトのどのページからでもアクセスすることが可能です。
ユーザーがウィンドウを閉じると、セッションは失われます。
同様に、sessionStorageオブジェクトは、特定のセッションのデータを文字列で保存することができます。
localStorageとsessionStorageの違い
定義
localStorageは、HTML5で利用可能なWebストレージオブジェクトの一種で、有効期限なしでデータを保存することができます。
一方、sessionStorageは、HTML 5で利用可能なWebストレージオブジェクトの一種で、1セッション分のデータを保存することができます。
使用方法
さらに、localStorageは複数のウィンドウにまたがるストレージ用に設計されており、現在のセッションを越えて持続する。
一方、sessionStorageは、ユーザーが1つのトランザクションを実行することができますが、同時に異なるウィンドウで複数のトランザクションを実行することができます。
結論
簡単に説明すると、HTML 5 のウェブストレージは、クライアントマシンにデータを保存するための 2 つのストレージオブジェクト、localStorage と sessionStorage を提供します。
これらは、通常のクッキーよりも大量のデータをローカルに保存するのに役立ちます。
ただし、localStorageとsessionStorageの主な違いは、localStorageは有効期限のないデータを保存し、sessionStorageは1セッションのデータを保存することです。