JavaScript的cookie與webstora是什么-創(chuàng)新互聯(lián)

本篇內(nèi)容主要講解“JavaScript的cookie與webstora是什么”，感興趣的朋友不妨來(lái)看看。本文介紹的方法操作簡(jiǎn)單快捷，實(shí)用性強(qiáng)。下面就讓小編來(lái)帶大家學(xué)習(xí)“JavaScript的cookie與webstora是什么”吧!

創(chuàng)新互聯(lián)是一家專注于成都網(wǎng)站設(shè)計(jì)、成都網(wǎng)站制作與策劃設(shè)計(jì),羅湖網(wǎng)站建設(shè)哪家好?創(chuàng)新互聯(lián)做網(wǎng)站,專注于網(wǎng)站建設(shè)十載,網(wǎng)設(shè)計(jì)領(lǐng)域的專業(yè)建站公司;建站業(yè)務(wù)涵蓋:羅湖等地區(qū)。羅湖做網(wǎng)站價(jià)格咨詢:18980820575

cookie

由于http是無(wú)狀態(tài)的協(xié)議，一旦客戶端和服務(wù)器的數(shù)據(jù)交換完畢，就會(huì)斷開(kāi)連接，再次請(qǐng)求，會(huì)重新連接，服務(wù)器單從網(wǎng)絡(luò)連接上是沒(méi)有辦法知道用戶身份的。cookie就是為了解決此問(wèn)題而產(chǎn)生的，每次新的用戶請(qǐng)求時(shí)，便給用戶頒發(fā)一個(gè)獨(dú)一無(wú)二的身份證，下次訪問(wèn)，必須帶上身份證，這樣服務(wù)器就會(huì)知道是哪個(gè)用戶進(jìn)行了訪問(wèn)，針對(duì)不同用戶，做出不同的響應(yīng)cookie是一個(gè)很小的純文本文件（最多為4K），是瀏覽器儲(chǔ)存在用戶的機(jī)器上的。儲(chǔ)存一些服務(wù)器需要的信息，每次請(qǐng)求站點(diǎn)，會(huì)發(fā)送相應(yīng)的cookie，這些cookie可以用來(lái)辨別用戶身份信息等作用。

cookie的屬性字段

通過(guò)上面的實(shí)例可以知道，給cookie賦值時(shí)是不會(huì)覆蓋cookie的原有的值，當(dāng)?shù)忍?hào)前的屬性名相同時(shí)，才會(huì)將原來(lái)相同屬性名的值覆蓋為后來(lái)設(shè)置的值。注意，cookie的兩個(gè)字段之間是通過(guò)一個(gè)分號(hào)和空格分隔，而不是只有一個(gè)分號(hào)
當(dāng)要給cookie設(shè)置非自定義的屬性字段時(shí)，需要通過(guò)字符串追加的方式
例如：

let expireDate = new Date();
document.cookie += ";expires=" + expireDate.toString();

注意： ";expires="中的分號(hào)必須有，如果字段前不加分號(hào)則會(huì)認(rèn)為這是一個(gè)自定義字段

domain

非頂級(jí)域名，如二級(jí)域名或者三級(jí)域名，設(shè)置的cookie的domain只能為頂級(jí)域名或者二級(jí)域名或者三級(jí)域名本身，不能設(shè)置其他二級(jí)域名的cookie，否則cookie無(wú)法生成。
頂級(jí)域名只能設(shè)置domain為頂級(jí)域名，不能設(shè)置為二級(jí)域名或者三級(jí)域名，否則cookie無(wú)法生成。
二級(jí)域名能讀取設(shè)置了domain為頂級(jí)域名或者自身的cookie，不能讀取其他二級(jí)域名domain的cookie。所以要想cookie在多個(gè)二級(jí)域名中共享，需要設(shè)置domain為頂級(jí)域名，這樣就可以在所有二級(jí)域名里面或者到這個(gè)cookie的值了。
頂級(jí)域名只能獲取到domain設(shè)置為頂級(jí)域名的cookie，其他domain設(shè)置為二級(jí)域名的無(wú)法獲取。
總的來(lái)說(shuō)就是，上級(jí)域名不能訪問(wèn)下級(jí)域名的cookie，下級(jí)域名可以讀取自身及上級(jí)域名的cookie，同級(jí)域名的cookie不共享，即同級(jí)域名之間不能互相訪問(wèn)對(duì)方的cookie，只能訪問(wèn)自身的cookie。

path

path字段為可以訪問(wèn)此cookie的頁(yè)面路徑。 比如domain是abc.com,path是/test，那么只有/test路徑下的頁(yè)面可以讀取此cookie。
expires/Max-Age
expires/Max-Age 字段為此cookie超時(shí)時(shí)間。若設(shè)置其值為一個(gè)時(shí)間，那么當(dāng)?shù)竭_(dá)此時(shí)間后，此cookie失效。不設(shè)置此字段時(shí)，默認(rèn)值是Session，即當(dāng)瀏覽器關(guān)閉(注意：不是瀏覽器標(biāo)簽頁(yè)，而是整個(gè)瀏覽器) 后，此cookie失效。
let expireDate = new Date("2019-5-26T09:00:00");
document.cookie += ";expires=" + expireDate.toString();
若要?jiǎng)h除某條cookie則設(shè)置此條cookie的expires為當(dāng)前時(shí)間之前的時(shí)間的即可
let expireDate = new Date("1970-01-01T00:00:00");
document.cookie += ";expires=" + expireDate.toString();

size

Size字段 此cookie大小。
httpOnly
若此屬性為true，則只有在http請(qǐng)求頭中會(huì)帶有此cookie的信息，而不能通過(guò)document.cookie來(lái)訪問(wèn)此cookie，設(shè)置為true可以減少受到Xss***的風(fēng)險(xiǎn)
secure
secure 字段 設(shè)置是否只能通過(guò)https來(lái)傳遞此條cookie
localstorage/sessionstorage
webstorage并不是要替代cookie，而是為了彌補(bǔ)隨著web的發(fā)展，cookie在存儲(chǔ)限制（存儲(chǔ)容量最多為4k），安全性（在http協(xié)議中明文傳輸）存在的缺點(diǎn)而提出的
兩者的API是相同的

function  intro

setItem(key, value) 以鍵值對(duì)的形式保存一條數(shù)據(jù)
getItem(key)    根據(jù)鍵來(lái)獲得值
removeItem(key) 根據(jù)鍵來(lái)刪除一條數(shù)據(jù)
key(index)  根據(jù)索引獲得鍵的名稱
clear() 刪除全部數(shù)據(jù)
兩者都有l(wèi)ength屬性

sessionStorage.setItem("name", "Jack");
sessionStorage.setItem("phone", "18856894523");
console.log(sessionStorage.getItem('name')); // Jack
console.log(sessionStorage.key(0)); // name
console.log(sessionStorage.length); // 2
sessionStorage.removeItem('phone');
console.log(sessionStorage.length); // 1
sessionStorage.clear();    
console.log(sessionStorage.length); // 0

兩者的比較

localStorage和sessionStorage都是用來(lái)存儲(chǔ)客戶端臨時(shí)信息的對(duì)象。均只能存儲(chǔ)字符串類型的對(duì)象，雖然規(guī)范中可以存儲(chǔ)其他原生類型的對(duì)象，但是目前為止沒(méi)有瀏覽器對(duì)其進(jìn)行實(shí)現(xiàn)。
localStorage生命周期是永久，除非用戶顯示在瀏覽器提供的UI上清除localStorage信息，否則這些信息將永遠(yuǎn)存在。
sessionStorage生命周期為當(dāng)前窗口或標(biāo)簽頁(yè)，一旦窗口或標(biāo)簽頁(yè)被永久關(guān)閉了，sessionStorage存儲(chǔ)的數(shù)據(jù)就被清空了。
不同瀏覽器無(wú)法共享localStorage或sessionStorage中的信息。
相同瀏覽器的不同頁(yè)面（頁(yè)面屬于相同域名和端口）間可以共享相同的localStorage
不同頁(yè)面或標(biāo)簽頁(yè)間無(wú)法共享sessionStorage的信息。注意，頁(yè)面及標(biāo)簽頁(yè)僅指頂級(jí)窗口，如果一個(gè)標(biāo)簽頁(yè)包含多個(gè)iframe標(biāo)簽且屬于同源頁(yè)面，那么他們之間是可以共享sessionStorage的。
使用window.open打開(kāi)頁(yè)面和改變localtion.href方式都可以獲取到sessionStorage內(nèi)部的數(shù)據(jù)

cookie 與 webstorage的區(qū)別

存儲(chǔ)限制
每個(gè)domain中只能存儲(chǔ)最多20條cookie，cookie數(shù)據(jù)不能超過(guò)4K
webStorage也有存儲(chǔ)大小的限制，但是比cookie大得多，可以達(dá)到5M或更大
數(shù)據(jù)的有效期
sessionStorage：僅在當(dāng)前的瀏覽器窗口關(guān)閉有效；
localStorage：始終有效，除非用戶手動(dòng)刪除
cookie：cookie過(guò)期時(shí)間之前一直有效，即使窗口和瀏覽器關(guān)閉

作用域

sessionStorage：不在不同的瀏覽器窗口中共享，即使是同一個(gè)頁(yè)面；
localStorage：同源窗口共享
cookie：同源窗口共享

到此，相信大家對(duì)“JavaScript的cookie與webstora是什么”有了更深的了解，不妨來(lái)實(shí)際操作一番吧！這里是創(chuàng)新互聯(lián)網(wǎng)站，更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢，關(guān)注我們，繼續(xù)學(xué)習(xí)！

網(wǎng)頁(yè)名稱：JavaScript的cookie與webstora是什么-創(chuàng)新互聯(lián)
文章位置：http://muchs.cn/article38/dhghpp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁(yè)設(shè)計(jì)公司、網(wǎng)站營(yíng)銷、用戶體驗(yàn)、外貿(mào)建站、外貿(mào)網(wǎng)站建設(shè)、移動(dòng)網(wǎng)站建設(shè)

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)