我的驗(yàn)證碼過期了，怎樣才能重新驗(yàn)證？瀏覽器阻止了所有cooki如何巧妙給localStorage設(shè)置過期時(shí)間？我們知道，HTML5增加了許多新功能，其中之一就是本地存儲(chǔ)。但是目前很多開發(fā)者并沒有很好的

我的驗(yàn)證碼過期了，怎樣才能重新驗(yàn)證？

瀏覽器阻止了所有cooki

如何巧妙給localStorage設(shè)置過期時(shí)間？

我們知道，HTML5增加了許多新功能，其中之一就是本地存儲(chǔ)。但是目前很多開發(fā)者并沒有很好的利用這個(gè)特性。

什么是本地存儲(chǔ)？簡(jiǎn)單來說，HTML5引入本地存儲(chǔ)是為了避免瀏覽器和服務(wù)器之間不必要的數(shù)據(jù)傳輸，本地存儲(chǔ)屬于Web存儲(chǔ)。很多時(shí)候，有一些數(shù)據(jù)需要存儲(chǔ)在客戶端。在這種情況下，非常適合使用本地存儲(chǔ)，因?yàn)楸镜卮鎯?chǔ)可以存儲(chǔ)的數(shù)據(jù)容量比Cookie大得多。

本地存儲(chǔ)在不同的瀏覽器中有不同的支持級(jí)別和數(shù)據(jù)容量。一般可以存儲(chǔ)5M左右的數(shù)據(jù)，而Cookie只能存儲(chǔ)4K數(shù)據(jù)。

以Chrome瀏覽器為例，打開調(diào)試模式(在頁面右擊檢查應(yīng)用)就可以看到本地存儲(chǔ)數(shù)據(jù)。

本地存儲(chǔ)的特點(diǎn)本地存儲(chǔ)本地存儲(chǔ)它有很多特點(diǎn)，主要包括以下幾點(diǎn):

它只存儲(chǔ)在客戶端，不會(huì)與服務(wù)器端通信；

存儲(chǔ)的所有數(shù)據(jù)都是字符串?dāng)?shù)據(jù)(所有數(shù)據(jù)都會(huì)自動(dòng)轉(zhuǎn)換成字符串進(jìn)行存儲(chǔ))；

是永久存儲(chǔ)(除非人工清理)；

還有就是同源策略，不同網(wǎng)站不能共享本地存儲(chǔ)。

本地存儲(chǔ)如何設(shè)置過期時(shí)間？如上所述，本地存儲(chǔ)的一個(gè)特點(diǎn)是永久存儲(chǔ)，默認(rèn)沒有過期時(shí)間。與Cookie不同，它可以設(shè)置TTL。那么如何模擬本地存儲(chǔ)過期時(shí)間呢？這里給出的方案的思想是這樣的:

1.在設(shè)置密鑰時(shí)，我們?cè)趦?nèi)容后添加一個(gè)過期時(shí)間戳(比如用特定符號(hào)隔開)，或者每個(gè)密鑰對(duì)應(yīng)附加一個(gè)過期時(shí)間密鑰，比如一個(gè)名為keyName expires的密鑰；

2.獲取密鑰時(shí)，判斷是否有對(duì)應(yīng)的擴(kuò)展密鑰(即過期的時(shí)間密鑰)。如果有，判斷當(dāng)前時(shí)間是否大于過期時(shí)間戳。如果是，就刪除鍵。

那個(gè) 這是我的看法。你怎么看待這個(gè)問題？歡迎在下方評(píng)論區(qū)交流~我是科技領(lǐng)域的創(chuàng)作者，有十年互聯(lián)網(wǎng)行業(yè)經(jīng)驗(yàn)。歡迎關(guān)注我了解更多科技知識(shí)！