JavaScript學習篇--本地存儲

在客戶端運行的js是不能操做用戶電腦磁盤中的文件的（這是爲了保護客戶端運行的安全）。

一、js中的本地存儲：

使用js向瀏覽器的某一個位置中存儲一些內容，瀏覽器即便關閉了，存儲的信息也不會銷燬，當在從新打開瀏覽器的時候咱們依然能夠獲取到上一次存儲的信息。

本地存儲的方案：

傳統：

cookie：把信息存儲到客戶端的瀏覽器中（可是項目服務器端也是能夠獲取cookie的）

session：把信息存儲到服務器上的（服務器存儲）

HTML5：webstorage

localstorage：永久存儲在客服端的本地。

sessionstorage：信息的會話存儲，會話窗口存在信息也存在，會話窗口關閉信息也就消失了。

二、cookie localstorage sessionstorage

->webStorage

setltem([key],[value]):像客服端的本地存儲一條記錄，存儲的[value]須要是字符串格式的，若是編寫的不是字符串，瀏覽器會默認的轉化爲字符串而後在進行存儲；同源下存儲的[key]是不會重複的，若是以前有的話，是把存儲的信息值進行修改。若是存儲的value是一個對象，須要先使用JSON.stringify()進行轉化。

getltem([key]):獲取以前存儲的值；

removeltem([key]):移除KEY對應的存儲記錄

clear():把當前源下的全部的存儲記錄都移除掉

localStorage.length:獲取存儲的記錄條數

localStorage.key(0):獲取索引爲0這一項的KEY是什麼。

localStorage.setltem('age',7);

localStorage.getltem('age');

localStorage.removeltem('age');

localStorage.clear();

localStorage和sessionStorage的區別

localStorage屬於永久存儲在本地，無論是刷新頁面仍是關掉頁面或者關閉瀏覽器，存儲的內容都不會消失，只有咱們本身手動的去刪除纔會消失（無論是殺毒軟件仍是瀏覽器自帶的清除歷史記錄功能都不能把localStorage存儲的內容清除掉）

sessionStorage屬於臨時的會話存儲，只要當前的頁面不關閉，信息就能夠存儲下來，可是頁面一旦關閉，存儲的信息就會自動清除（F5刷新頁面只是把當前的DOM結構等進行從新的渲染，會話並無關閉）

cookie

document.cookie = 'age = 7'

cookie和localStorage的區別

1）、cookie

cookie存儲內容的大小是有限制的，通常同源下只能存儲4kb的內容；localStorage存儲的內容也有大小限制，通常同源下只能存儲5MB

cookie存儲的內容是有過時時間的，而localStorage是永久存儲到本地，使用殺毒軟件或者瀏覽器自帶的清除垃圾的功能都有可能把存儲的cookie給刪除掉

用戶可能處於安全的角度禁用cookie（無痕瀏覽器），可是不能禁止localStorage

真實的項目中的本地存儲都使用哪些東西？

記住用戶名密碼或者自動登陸；用戶的部分信息，當用戶登陸成功後咱們會把用戶的一些信息記錄到本地的cookie中，這樣在項目中的任何頁面均可以知道當前登陸的用戶是哪個了；購物車..（存儲少許信息或者是須要瀏覽器兼容的都須要使用cookie來進行存儲）

2）、localStorage

在pc端咱們能夠用其存儲某一個js或者css中的源代碼；還能夠把一些不須要常常更新的數據存儲到本地，存儲的時候能夠設置一個存儲的事件，之後從新刷新頁面，看一下時間有沒有超過預約的時間，若是已通過時了，咱們重新獲取最新數據，沒超過咱們仍是繼續使用本地數據。

本地存儲都是明文存儲

對於重要的信息咱們通常不要存儲到本地，若是非要存儲的話咱們須要把存儲的信息進行加密

可逆轉加密：加密完成還能夠解密回來

不可逆轉加密：MD5