LocalStorage 是一個 HTML5 網絡存儲對象，用於將數據存儲在客戶端——即本地，在用戶的計算機上。 本地存儲的數據沒有到期日期，並且會一直存在，直到被刪除。 （相比之下，會話存儲是另一個 HTML5 網絡存儲 API，它會在瀏覽器關閉時刪除存儲的數據。）
本地存儲是純 JavaScript。 同樣，雖然它仍然在用戶的設備上生成純文本文檔，但本地存儲也允許存儲多達 5MB 的數據（與 4KB 的 cookie 相比）。 這使得本地存儲的許多有趣應用成為可能，例如管理內容以減少從服務器請求內容的需要，加快加載時間。
只讀的localStorage 屬性允許你訪問一個Document 源（origin）的對象 Storage；存儲的數據將保存在瀏覽器會話中。localStorage 類似 sessionStorage，但其區別在於：存儲在 localStorage 的數據可以長期保留；而當頁面會話結束——也就是說，當頁面被關閉時，存儲在 sessionStorage 的數據會被清除 。
localStorage 最主要的特點是：
- 在同源的所有標簽頁和窗口之間共享數據。
- 數據不會過期。它在瀏覽器重啟甚至系統重啟后仍然存在。
sessionStorage 對象的使用頻率比 localStorage 對象低得多。
屬性和方法是相同的，但是它有更多的限制：
- sessionStorage 的數據只存在於當前瀏覽器標簽頁。
具有相同頁面的另一個標簽頁中將會有不同的存儲。
但是，它在同一標簽頁下的 iframe 之間是共享的（假如它們來自相同的源）。 - 數據在頁面刷新后仍然保留，但在關閉/重新打開瀏覽器標簽頁后不會被保留。
使用 local storage 的一個例子：
創建一個 textarea 字段，每當其值發生變化時，可以將其“自動保存”。
因此，如果用戶不小心關閉了頁面，然后重新打開，他會發現之前未完成的輸入仍然保留在那里。
像這樣：
<!doctype html>
<textarea style="width:200px; height: 60px;" id="area" placeholder="Write here"></textarea>
<br>
<button onclick="localStorage.removeItem('area');area.value=''">Clear</button>
<script>
area.value = localStorage.getItem('area');
area.oninput = () => {
localStorage.setItem('area', area.value)
};
</script>
如果使用得當，本地存儲可以成為功能強大的輕量級數據存儲解決方案，但並非沒有問題。 以下是使用本地存儲可能不是一個好主意的幾個原因，具體取決於存儲的內容。
Why using LocalStorage might be a bad idea
本地存儲本質上並不比使用 cookie 更安全。理解了這一點后，該對象可用於存儲從安全角度來看無關緊要的數據。但是，以下是重新考慮使用本地存儲的幾個原因。
1. 如果一個站點容易受到 XSS 攻擊，LocalStorage 是不安全的
也許對使用本地存儲的最大反對是與之相關的安全漏洞。本地存儲具有許多與 cookie 相同的特征，包括相同的安全風險。其中之一是對跨站點腳本的易感性，它會竊取 cookie，讓黑客偽裝成具有站點登錄會話的用戶。將諸如密碼之類的敏感內容存儲在本地存儲文件中實際上可以簡化黑客的過程，因為他們不需要將 cookie 加載到自己的瀏覽器中。
2. 開發者無法控制本地存儲的數據
使用本地存儲，沒有服務器端存儲——沒有開發人員可以控制的數據庫。由於一些原因，這可能會出現問題，其中之一是開發人員無法在存儲代碼或信息后對其進行更新。用戶需要手動刪除文件，這需要首先找到它。或者，他們需要擦除瀏覽器緩存，從而丟失所有存儲的數據。
3.用戶清除其緩存
定期清除瀏覽器緩存有助於 cookie 更有效地發揮作用，這通常是人們在解決瀏覽器問題（如頁面加載不正確）時采取的第一步。
當使用本地存儲來支持站點的功能時，這是一個問題。如果用戶清除瀏覽器緩存，該信息將永久丟失。這使得本地存儲作為備用數據庫更有用。
LocalStorage 的替代方案
根據信息是否敏感，確實存在一些本地存儲的替代方案。不想使用本地存儲的開發人員可以嘗試下列這些方式：
對敏感信息使用服務器端會話
當涉及到敏感信息時，將數據存儲在服務器上有幾個優點。首先，開發人員可以保證其安全性，並且對單個會話有更多的控制權（如有必要，它們可以立即終止）。其次，數據在架構內受到保護，暴露的機會更少。
對於非敏感信息，選擇 IndexedDB
對於一心使用客戶端會話的開發人員，IndexedDB 使開發人員能夠構建可以本地存儲的應用程序。盡管它沒有像本地存儲那樣廣泛的瀏覽器支持，但它對於本地存儲非敏感數據仍然很有用。 IndexedDB 與本地存儲相比有一個主要優勢，因為它是一個成熟的數據庫，能夠處理更多類型的數據。
明智地處理數據存儲
如果精心部署，本地存儲可以提高站點性能並幫助創建更多輕量級應用程序。 但是，絕不能將本地存儲用於敏感信息，例如密碼或個人信息。 這樣做會產生安全風險。
對於需要加密和安全的信息，還有其他有效且方便的解決方案，例如服務器端會話。 由於網絡安全是一個如此重要的問題，因此沒有必要冒險。 因此，在使用 LocalStorage 時，請慎之又慎。
更多Jerry的原創文章，盡在："汪子熙":
