html5儲存資料，替代cookie
阿新 • • 發佈：2018-12-23
通常很多情況下我們都要用到資料的儲存，而什麼是資料儲存？
資料儲存是資料流在加工過程中產生的臨時檔案或加工過程中需要查詢的資訊。資料以某種格式記錄在計算機內部或外部儲存介質上。
通常用到的有這些：記住密碼、瀏覽記錄等HTML5 提供了兩種在客戶端儲存資料的新方法： //兩種方法用重新整理去測試是一樣的結果，但是關閉瀏覽器再開啟就不一樣了
- localStorage - 沒有時間限制的資料儲存
- sessionStorage - 針對一個 session 的資料儲存
之前，這些都是由 cookie 完成的。但是 cookie 不適合大量資料的儲存，因為它們由每個對伺服器的請求來傳遞，這使得 cookie 速度很慢而且效率也不高。
localStorage 方法（無論多久訪問都儲存著，下面是建立和訪問localStrorage方法）：
<script type="text/javascript"> localStorage.name="lili"; document.write("localStorage.name"); </script> //結果是彈出lili <!DOCTYPE HTML><html>
<body>
<script type="text/javascript">
if (localStorage.pagecount)
{
localStorage.pagecount=Number(localStorage.pagecount) +1;
}
else
{
localStorage.pagecount=1;
}
document.write("Visits: " + localStorage.pagecount + " time(s).");
</script>
<p>重新整理頁面會看到計數器在增長。</p>
<p>請關閉瀏覽器視窗，然後再試一次，計數器會繼續計數。
</body>
</html>
sessionStorage 方法:
sessionStorage 方法針對一個 session 進行資料儲存。當用戶關閉瀏覽器視窗後，資料會被刪除。
<!DOCTYPE HTML>
<html>
<body>
<script type="text/javascript">
if (sessionStorage.pagecount)
{
sessionStorage.pagecount=Number(sessionStorage.pagecount) +1;
}
else
{
sessionStorage.pagecount=1;
}
document.write("Visits " + sessionStorage.pagecount + " time(s) this session.");
</script>
<p>重新整理頁面會看到計數器在增長。</p>
<p>請關閉瀏覽器視窗，然後再試一次，計數器已經重置了 。</p>
</body>
</html>