cookie是網(wǎng)站為了標(biāo)示用戶身份而儲(chǔ)存在用戶本地終端（Client Side）上的數(shù)據(jù)（通常經(jīng)過加密）。

cookie數(shù)據(jù)始終在同源的http請求中攜帶（即使不需要），都會(huì)在瀏覽器和服務(wù)器間來回傳遞。

sessionStorage和localStorage不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器，僅在本地保存。

存儲(chǔ)大小：

cookie數(shù)據(jù)大小不能超過4k。

sessionStorage和localStorage 雖然也有存儲(chǔ)大小的限制，但比cookie大得多，可以達(dá)到5M或更大。

有期時(shí)間：

localStorage 存儲(chǔ)持久數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失除非主動(dòng)刪除數(shù)據(jù)；

sessionStorage 數(shù)據(jù)在當(dāng)前瀏覽器窗口關(guān)閉后自動(dòng)刪除。

cookie 設(shè)置的cookie過期時(shí)間之前一直有效，即使窗口或?yàn)g覽器關(guān)閉

cookie的弊端

cookie雖然在持久保存客戶端數(shù)據(jù)提供了方便，分擔(dān)了服務(wù)器存儲(chǔ)的負(fù)擔(dān)，但還是有很多局限性的。

第一：每個(gè)特定的域名下最多生成20個(gè)cookie

1.IE6或更低版本最多20個(gè)cookie

2.IE7和之后的版本最后可以有50個(gè)cookie。

3.Firefox最多50個(gè)cookie

4.chrome和Safari沒有做硬性限制

IE和Opera 會(huì)清理近期最少使用的cookie，F(xiàn)irefox會(huì)隨機(jī)清理cookie。

cookie的最大大約為4096字節(jié)，為了兼容性，一般不能超過4095字節(jié)。

IE 提供了一種存儲(chǔ)可以持久化用戶數(shù)據(jù)，叫做userdata，從IE5.0就開始支持。每個(gè)數(shù)據(jù)最多128K，每個(gè)域名下最多1M。這個(gè)持久化數(shù)據(jù)放在緩存中，如果緩存沒有清理，那么會(huì)一直存在。

安全性問題。如果cookie被人攔截了，那人就可以取得所有的session信息。即使加密也與事無補(bǔ)，因?yàn)閿r截者并不需要知道cookie的意義，他只要原樣轉(zhuǎn)發(fā)cookie就可以達(dá)到目的了。

有些狀態(tài)不可能保存在客戶端。例如，為了防止重復(fù)提交表單，我們需要在服務(wù)器端保存一個(gè)計(jì)數(shù)器。如果我們把這個(gè)計(jì)數(shù)器保存在客戶端，那么它起不到任何作用。

cookie的優(yōu)點(diǎn)

極高的擴(kuò)展性和可用性

1.通過良好的編程，控制保存在cookie中的session對象的大小。

2.通過加密和安全傳輸技術(shù)（SSL），減少cookie被破解的可能性。

3.只在cookie中存放不敏感數(shù)據(jù)，即使被盜也不會(huì)有重大損失。

4.控制cookie的生命期，使之不會(huì)永遠(yuǎn)有效。偷盜者很可能拿到一個(gè)過期的cookie。

簡潔畫圖：

---

瀏覽器本地存儲(chǔ)

在較高版本的瀏覽器中，js提供了sessionStorage和globalStorage。在HTML5中提供了localStorage來取代globalStorage。

html`中的Web Storage包括了兩種存儲(chǔ)方式：sessionStorage和localStorage。

sessionStorage用于本地存儲(chǔ)一個(gè)會(huì)話（session）中的數(shù)據(jù)，這些數(shù)據(jù)只有在同一個(gè)會(huì)話中的頁面才能訪問并且當(dāng)會(huì)話結(jié)束后數(shù)據(jù)也隨之銷毀。因此sessionStorage不是一種持久化的本地存儲(chǔ)，僅僅是會(huì)話級別的存儲(chǔ)。

而localStorage用于持久化的本地存儲(chǔ)，除非主動(dòng)刪除數(shù)據(jù)，否則數(shù)據(jù)是永遠(yuǎn)不會(huì)過期的。

web storage和cookie的區(qū)別

Web Storage的概念和cookie相似，區(qū)別是它是為了更大容量存儲(chǔ)設(shè)計(jì)的。Cookie的大小是受限的，并且每次你請求一個(gè)新的頁面的時(shí)候Cookie都會(huì)被發(fā)送過去，這樣無形中浪費(fèi)了帶寬，另外cookie還需要指定作用域，不可以跨域調(diào)用。

除此之外，Web Storage擁有setItem,getItem,removeItem,clear等方法，不像cookie需要前端開發(fā)者自己封裝setCookie，getCookie。

但是cookie也是不可以或缺的：cookie的作用是與服務(wù)器進(jìn)行交互，作為HTT`規(guī)范的一部分而存在 ，而Web Storage僅僅是為了在本地“存儲(chǔ)”數(shù)據(jù)而生。

cookie 和session 的區(qū)別：

1、cookie數(shù)據(jù)存放在客戶的瀏覽器上，session數(shù)據(jù)放在服務(wù)器上。

2、cookie不是很安全，別人可以分析存放在本地的cookie并進(jìn)行cookie欺騙

考慮到安全應(yīng)當(dāng)使用session。

3、session會(huì)在一定時(shí)間內(nèi)保存在服務(wù)器上。當(dāng)訪問增多，會(huì)比較占用你服務(wù)器的性能，

考慮到減輕服務(wù)器性能方面，應(yīng)當(dāng)使用cookie。

4、單個(gè)cookie保存的數(shù)據(jù)不能超過4K，很多瀏覽器都限制一個(gè)站點(diǎn)最多保存20個(gè)cookie。

5、所以建議：

將登陸信息等重要信息存放為SESSION

其他信息如果需要保留，可以放在COOKIE中

---

大總結(jié)

客戶端存儲(chǔ)及他們的異同

（補(bǔ)充開頭部分：cookie, sessionStorage和localStorage等）

共同點(diǎn)：

都是保存在瀏覽器端，且同源的。

區(qū)別：

1.cookie數(shù)據(jù)始終在同源的http請求中攜帶（即使不需要），即cookie在瀏覽器和服務(wù)器間來回傳遞。而sessionStorage和localStorage不會(huì)自動(dòng)把數(shù)據(jù)發(fā)給服務(wù)器，僅在本地保存。

2.cookie數(shù)據(jù)還有路徑（path）的概念，可以限制cookie只屬于某個(gè)路徑下。

3.存儲(chǔ)大小限制也不同，cookie數(shù)據(jù)不能超過4k，同時(shí)因?yàn)槊看蝖ttp請求都會(huì)攜帶cookie，所以cookie只適合保存很小的數(shù)據(jù)，如會(huì)話標(biāo)識(shí)。sessionStorage和localStorage 雖然也有存儲(chǔ)大小的限制，但比cookie大得多，一般為5M左右。

4.數(shù)據(jù)有效期不同，sessionStorage僅在當(dāng)前瀏覽器窗口關(guān)閉前有效，自然也就不可能持久保持；localStorage始終有效（除非清除），窗口或?yàn)g覽器關(guān)閉也一直保存，因此用作持久數(shù)據(jù)；cookie只在設(shè)置的cookie過期時(shí)間之前一直有效，即使窗口或?yàn)g覽器關(guān)閉。

5.作用域不同，sessionStorage不在不同的瀏覽器窗口中共享，即使是同一個(gè)頁面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。

6.Web Storage 支持事件通知機(jī)制（storage事件），可以將數(shù)據(jù)更新的通知發(fā)送給監(jiān)聽者。Web Storage 的 api 接口使用更方便。

簡單測試：

如有不足之處，歡迎批評指正。