在HTML5中，新加入了一個localStorage特性，這個特性主要是用來作為本地儲存來使用的，解決了cookie儲存空間不足的問題(cookie中每條cookie的儲存空間為4k)，localStorage中一般瀏覽器支援的是5M大小，這個在不同的瀏覽器中localStorage會有所不同。
二、localStorage的優勢與侷限
localStorage的優勢
1、localStorage擴充了cookie的4K限制
2、localStorage會可以將第一次請求的資料直接儲存到本地，這個相當於一個5M大小的針對於前端頁面的資料庫，相比於cookie可以節約頻寬，但是這個卻是隻有在高版本的瀏覽器中才支援的
localStorage的侷限
1、瀏覽器的大小不統一，並且在IE8以上的IE版本才支援localStorage這個屬性
2、目前所有的瀏覽器中都會把localStorage的值型別限定為string型別，這個在對我們日常比較常見的JSON物件型別需要一些轉換
3、localStorage在瀏覽器的隱私模式下面是不可讀取的
4、localStorage本質上是對字串的讀取，如果儲存內容多的話會消耗記憶體空間，會導致頁面變卡
5、localStorage不能被爬蟲抓取到
localStorage與sessionStorage的唯一一點區別就是localStorage屬於永久性儲存，而sessionStorage屬於當會話結束的時候，sessionStorage中的鍵值對會被清空
這裡我們以localStorage來分析
Cookie和LocalStorage都提供了在客戶端儲存資料的能力，但它們在設計目的、功能和使用場景上有顯著的不同。這些差異導致了即使有了Cookie，LocalStorage仍然非常有用。以下是幾個關鍵點，解釋為什麼LocalStorage在存在Cookie的情況下仍然重要：
- 儲存容量
- Cookie的儲存容量相對較小，通常每個域名限制在4KB左右。這使得Cookie不適合儲存大量資料。
- LocalStorage提供了更大的儲存空間，通常至少5MB。這讓它成為儲存較大資料集，如使用者設定、應用狀態等的理想選擇。
- 生命週期
- Cookie可以設定過期時間，過期後會自動刪除。這對於實現如會話管理等功能非常有用。
- LocalStorage資料沒有過期時間，資料會一直存在直到被明確刪除，或者使用者清除瀏覽器資料。這使得LocalStorage適合長期儲存。
- 伺服器互動
- Cookie隨每個HTTP請求自動傳送到伺服器，這對於進行身份驗證或跟蹤使用者會話很有用，但可能增加不必要的網路負載。
- LocalStorage僅在客戶端儲存，不隨HTTP請求傳送到伺服器，減少了網路流量並提高了效能，特別是在不需要伺服器知道儲存內容的情況下。
- 安全性
- Cookie支援設定為
HttpOnly，可以減少XSS攻擊的風險，但如果不當使用，仍可能受到CSRF攻擊。 - LocalStorage較容易受到XSS攻擊，因為儲存的資料可以透過客戶端指令碼訪問，但它不涉及HTTP請求，因此不受CSRF攻擊的影響。
- API和使用簡易性
- LocalStorage提供了一個簡單易用的API，使得在客戶端儲存和訪問資料變得更加方便。相比之下，Cookie的API相對原始，處理起來可能更復雜。
總的來說，LocalStorage提供了一種在客戶端儲存大量資料、不隨每個請求傳送到伺服器、並且容易使用的解決方案。這些特性使得它成為Cookie的重要補充，特別是在處理大量不需要伺服器知道的客戶端資料時。儘管如此，開發者在使用這些技術時應該注意它們的安全性和效能影響。