javascript 操作cookies及正確使用cookies的屬性
更新時(shí)間:2009年10月15日 22:36:04 作者:
在 JS(JavaScript) 操作cookies比較復(fù)雜,在 ASP 里面我們只需要知道 cookie 的名稱、cookie 的值就行了,而 JS 里面,我們面對(duì)的是 cookie 的字符串,你自己編寫(xiě)這個(gè)字符串寫(xiě)入客戶端,然后自己解析這個(gè)字符串。
一、從寫(xiě) cookie 說(shuō)起。
var the_date = new Date("December 31, 2020");
var expiresDate = the_date.toGMTString();
document.cookie = "userDefineCSS=" + escape(title) + "; expires=" + expiresDate;
第一句是日期對(duì)象;
第二句將日期格式轉(zhuǎn)換成 GMT 格式;編者者: GMT 即格林威治標(biāo)準(zhǔn)時(shí)間,現(xiàn)在也稱 UTC 即全球標(biāo)準(zhǔn)時(shí)間。
第三句是將 cookie 內(nèi)容寫(xiě)入客戶端。
其中 expires 是系統(tǒng)使用的,表示 cookie 的失效日期(也可以省略),expires 不可讀。
escape 是對(duì) cookie 值進(jìn)行編碼,這是為了處理中文、空格等而設(shè)立的。
二、取 cookie 是比較簡(jiǎn)單的。
function GetCSS()
{
var cookieStr = document.cookie; //取 cookie 字符串,由于 expires 不可讀,所以 expires 將不會(huì)出現(xiàn)在 cookieStr 中。
if (cookieStr == "")
{
return "main1"; //沒(méi)有取到 cookie 字符串,返回默認(rèn)值
}
var cookieValue = cookieStr.split("; "); //將各個(gè) cookie 分隔開(kāi),并存為數(shù)組,多個(gè) cookie 之間用分號(hào)加空隔隔開(kāi),不過(guò)前面我們只使用了一個(gè) cookie,它的值與 expires 之間也是用分號(hào)加空格隔開(kāi)的
var varName = "userDefineCSS";
var startPos = -1;
var endPos = -1;
for (var i=0; i<cookieValue.length; i++)
{
startPos = cookieValue[i].indexOf(varName);
if (startPos != 0)
{
continue; //當(dāng)前 cookie 不是名稱為 varName 的 cookie,判斷下一個(gè) cookie
}
startPos += varName.length + 1; //當(dāng)前 cookie 就是名稱為 varName 的 cookie,由于有等號(hào),所以 +1
endPos = cookieValue[i].length;
var css = unescape(cookieValue[i].substring(startPos, endPos));
return css;
}
return "main1";
}
由于寫(xiě) cookie 時(shí)使用了 escape,所以返回 cookie 值時(shí)使用 unescape 進(jìn)行解碼。
正確使用cookies的屬性
首先看看cookies的結(jié)構(gòu)
我們這里所說(shuō)的 cookie 結(jié)構(gòu)并非其存儲(chǔ)結(jié)構(gòu),而是其表現(xiàn)結(jié)構(gòu),主要通過(guò)研究其表現(xiàn)結(jié)構(gòu)來(lái)實(shí)現(xiàn) JS(JavaScript) 對(duì) cookie 的操作。
cookie 的表現(xiàn)結(jié)構(gòu)較為簡(jiǎn)單,每個(gè) cookie 由 cookie 名稱 和 cookie 值組成,用等號(hào)表示二者關(guān)系,各個(gè) cookie 之間用分號(hào)加空格隔開(kāi)。正如前面所說(shuō) expires、path、domain 均不可讀,所以在表現(xiàn)結(jié)構(gòu)中也沒(méi)有體現(xiàn)出來(lái)。
cookieName1=cookieValue1; cookieName2=cookieValue2[...; cookieNamen=cookieValuen]
通過(guò)分隔分號(hào)加空格符號(hào),就可以獲得各個(gè) cookie,再通過(guò)分隔等號(hào),就可以得出各個(gè) cookie 的名稱和值。
cookie 的子鍵,只是表現(xiàn)在 cookieValue 上,一個(gè)子鍵的結(jié)構(gòu)是:子鍵名稱=子鍵值,多個(gè)子鍵之間用 & 連接起來(lái)。比如:
cookieName1=子鍵名稱1=子鍵值1&子鍵名稱2=子鍵值2
如果是 ASP 文件,我們會(huì)發(fā)現(xiàn) cookie 結(jié)構(gòu)中有這樣一段字符串:ASPSESSIONIDQSTDRATQ=24位字符
關(guān)于此,查看:http://www.aspxuexi.com/aspbasic/cookie/2006-6-10/Session_Cookie.htm
同名的 cookie,不同的 domain 或不同的 path,屬不同的 cookie;
同名的 cookie,相同的 domain 且相同的 path,不同的 expires,屬同一個(gè) cookie。
cookie 有路徑--path,表示哪些路徑下的文件有權(quán)限讀取該 cookie。
path 應(yīng)該以 "/" 結(jié)尾,同名 cookie,不同 path,屬不同的 cookie
document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/path";
document.cookie = "N1=3; path=path/";
如上代碼,前兩句使用的是絕對(duì)路徑,即相對(duì)于站點(diǎn)根目錄的網(wǎng)頁(yè)目錄,第三句使用的是相對(duì)路徑,相對(duì)于當(dāng)前目錄的。
第一句和第二句在于結(jié)尾不同,雖然他們所表達(dá)的權(quán)限相同,但是由于 path 字符串不同,會(huì)形成兩個(gè)同名的 cookie,容易造成混亂,我們建議不要使用第二句這種格式,因?yàn)橄到y(tǒng)默認(rèn)也是以 "/" 結(jié)尾的。
所以如上述是三個(gè) cookie,之間不會(huì)相互覆蓋。
path 屬性值有大小寫(xiě)之分,應(yīng)與瀏覽器中的地址欄的輸入一致
document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/paTH/";
這是兩個(gè)不同的 cookie,因?yàn)椤ath 屬性值大小寫(xiě)不同,如果我們?cè)诘刂窓谳斎氲氖?path,那么就讀取第一個(gè) N1,如果我們輸入的是 paTH,那么就讀取第二個(gè) N1
path 不可讀
同 expires 一樣,path 只可寫(xiě),不可讀。
path 不可更改
同 expires 不一樣,如果我們?cè)噲D更改 path,那么實(shí)際上我們是另外寫(xiě)了一個(gè) cookie,而不是更改了 path 值。
path 權(quán)限有繼承性
假如指定了 /test/ 目錄有權(quán)限讀取某 cookie,那么 /test/ 之下的目錄 /test/t/ 也有權(quán)限讀取該 cookie。
cookie 有失效日期--expires,如果還沒(méi)有過(guò)失效期,即使重新啟動(dòng)電腦,cookie 仍然不會(huì)丟失,如果沒(méi)有指定 expires 值,那么在關(guān)閉瀏覽器時(shí),cookie 即失效。
在 JS(JavaScript) 中使用 expires 時(shí)應(yīng)該和 cookie 同時(shí)寫(xiě)入,如:
document.cookie = "clr=red; expires=" + expiresDate;
而如下寫(xiě)法是不正確的:
document.cookie = "clr=red";
document.cookie = "expires=" + expiresDate;
這樣寫(xiě)會(huì)形成兩個(gè) cookie,第二個(gè) cookie 的名稱是 expires,兩個(gè) cookie 均沒(méi)有指定失效日期。
expires 不可讀
這就是為什么,我們?cè)?ASP 中使用 response.Write request.cookies("cname").expires 會(huì)出錯(cuò),同樣在 JS(JavaScript) 中使用 document.cookie 也不會(huì)顯示出 expires。
expires 值應(yīng)該使用 GMT 格式的時(shí)間
var the_date = new Date("December 31, 2020");
var expiresDate = the_date.toGMTString(); //轉(zhuǎn)換成 GMT 格式。
var the_date = new Date("December 31, 2020");
var expiresDate = the_date.toGMTString();
document.cookie = "userDefineCSS=" + escape(title) + "; expires=" + expiresDate;
第一句是日期對(duì)象;
第二句將日期格式轉(zhuǎn)換成 GMT 格式;編者者: GMT 即格林威治標(biāo)準(zhǔn)時(shí)間,現(xiàn)在也稱 UTC 即全球標(biāo)準(zhǔn)時(shí)間。
第三句是將 cookie 內(nèi)容寫(xiě)入客戶端。
其中 expires 是系統(tǒng)使用的,表示 cookie 的失效日期(也可以省略),expires 不可讀。
escape 是對(duì) cookie 值進(jìn)行編碼,這是為了處理中文、空格等而設(shè)立的。
二、取 cookie 是比較簡(jiǎn)單的。
function GetCSS()
{
var cookieStr = document.cookie; //取 cookie 字符串,由于 expires 不可讀,所以 expires 將不會(huì)出現(xiàn)在 cookieStr 中。
if (cookieStr == "")
{
return "main1"; //沒(méi)有取到 cookie 字符串,返回默認(rèn)值
}
var cookieValue = cookieStr.split("; "); //將各個(gè) cookie 分隔開(kāi),并存為數(shù)組,多個(gè) cookie 之間用分號(hào)加空隔隔開(kāi),不過(guò)前面我們只使用了一個(gè) cookie,它的值與 expires 之間也是用分號(hào)加空格隔開(kāi)的
復(fù)制代碼 代碼如下:
var varName = "userDefineCSS";
var startPos = -1;
var endPos = -1;
for (var i=0; i<cookieValue.length; i++)
{
startPos = cookieValue[i].indexOf(varName);
if (startPos != 0)
{
continue; //當(dāng)前 cookie 不是名稱為 varName 的 cookie,判斷下一個(gè) cookie
}
startPos += varName.length + 1; //當(dāng)前 cookie 就是名稱為 varName 的 cookie,由于有等號(hào),所以 +1
endPos = cookieValue[i].length;
var css = unescape(cookieValue[i].substring(startPos, endPos));
return css;
}
return "main1";
}
由于寫(xiě) cookie 時(shí)使用了 escape,所以返回 cookie 值時(shí)使用 unescape 進(jìn)行解碼。
正確使用cookies的屬性
首先看看cookies的結(jié)構(gòu)
我們這里所說(shuō)的 cookie 結(jié)構(gòu)并非其存儲(chǔ)結(jié)構(gòu),而是其表現(xiàn)結(jié)構(gòu),主要通過(guò)研究其表現(xiàn)結(jié)構(gòu)來(lái)實(shí)現(xiàn) JS(JavaScript) 對(duì) cookie 的操作。
cookie 的表現(xiàn)結(jié)構(gòu)較為簡(jiǎn)單,每個(gè) cookie 由 cookie 名稱 和 cookie 值組成,用等號(hào)表示二者關(guān)系,各個(gè) cookie 之間用分號(hào)加空格隔開(kāi)。正如前面所說(shuō) expires、path、domain 均不可讀,所以在表現(xiàn)結(jié)構(gòu)中也沒(méi)有體現(xiàn)出來(lái)。
cookieName1=cookieValue1; cookieName2=cookieValue2[...; cookieNamen=cookieValuen]
通過(guò)分隔分號(hào)加空格符號(hào),就可以獲得各個(gè) cookie,再通過(guò)分隔等號(hào),就可以得出各個(gè) cookie 的名稱和值。
cookie 的子鍵,只是表現(xiàn)在 cookieValue 上,一個(gè)子鍵的結(jié)構(gòu)是:子鍵名稱=子鍵值,多個(gè)子鍵之間用 & 連接起來(lái)。比如:
cookieName1=子鍵名稱1=子鍵值1&子鍵名稱2=子鍵值2
如果是 ASP 文件,我們會(huì)發(fā)現(xiàn) cookie 結(jié)構(gòu)中有這樣一段字符串:ASPSESSIONIDQSTDRATQ=24位字符
關(guān)于此,查看:http://www.aspxuexi.com/aspbasic/cookie/2006-6-10/Session_Cookie.htm
同名的 cookie,不同的 domain 或不同的 path,屬不同的 cookie;
同名的 cookie,相同的 domain 且相同的 path,不同的 expires,屬同一個(gè) cookie。
cookie 有路徑--path,表示哪些路徑下的文件有權(quán)限讀取該 cookie。
path 應(yīng)該以 "/" 結(jié)尾,同名 cookie,不同 path,屬不同的 cookie
document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/path";
document.cookie = "N1=3; path=path/";
如上代碼,前兩句使用的是絕對(duì)路徑,即相對(duì)于站點(diǎn)根目錄的網(wǎng)頁(yè)目錄,第三句使用的是相對(duì)路徑,相對(duì)于當(dāng)前目錄的。
第一句和第二句在于結(jié)尾不同,雖然他們所表達(dá)的權(quán)限相同,但是由于 path 字符串不同,會(huì)形成兩個(gè)同名的 cookie,容易造成混亂,我們建議不要使用第二句這種格式,因?yàn)橄到y(tǒng)默認(rèn)也是以 "/" 結(jié)尾的。
所以如上述是三個(gè) cookie,之間不會(huì)相互覆蓋。
path 屬性值有大小寫(xiě)之分,應(yīng)與瀏覽器中的地址欄的輸入一致
document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/paTH/";
這是兩個(gè)不同的 cookie,因?yàn)椤ath 屬性值大小寫(xiě)不同,如果我們?cè)诘刂窓谳斎氲氖?path,那么就讀取第一個(gè) N1,如果我們輸入的是 paTH,那么就讀取第二個(gè) N1
path 不可讀
同 expires 一樣,path 只可寫(xiě),不可讀。
path 不可更改
同 expires 不一樣,如果我們?cè)噲D更改 path,那么實(shí)際上我們是另外寫(xiě)了一個(gè) cookie,而不是更改了 path 值。
path 權(quán)限有繼承性
假如指定了 /test/ 目錄有權(quán)限讀取某 cookie,那么 /test/ 之下的目錄 /test/t/ 也有權(quán)限讀取該 cookie。
cookie 有失效日期--expires,如果還沒(méi)有過(guò)失效期,即使重新啟動(dòng)電腦,cookie 仍然不會(huì)丟失,如果沒(méi)有指定 expires 值,那么在關(guān)閉瀏覽器時(shí),cookie 即失效。
在 JS(JavaScript) 中使用 expires 時(shí)應(yīng)該和 cookie 同時(shí)寫(xiě)入,如:
document.cookie = "clr=red; expires=" + expiresDate;
而如下寫(xiě)法是不正確的:
document.cookie = "clr=red";
document.cookie = "expires=" + expiresDate;
這樣寫(xiě)會(huì)形成兩個(gè) cookie,第二個(gè) cookie 的名稱是 expires,兩個(gè) cookie 均沒(méi)有指定失效日期。
expires 不可讀
這就是為什么,我們?cè)?ASP 中使用 response.Write request.cookies("cname").expires 會(huì)出錯(cuò),同樣在 JS(JavaScript) 中使用 document.cookie 也不會(huì)顯示出 expires。
expires 值應(yīng)該使用 GMT 格式的時(shí)間
var the_date = new Date("December 31, 2020");
var expiresDate = the_date.toGMTString(); //轉(zhuǎn)換成 GMT 格式。
相關(guān)文章
JS取request值以及自動(dòng)執(zhí)行使用示例
在網(wǎng)頁(yè)中JS函數(shù)自動(dòng)執(zhí)行常用三種方法,下面為大家詳細(xì)介紹下JS取request值以及自動(dòng)執(zhí)行使用,需要的朋友可以參考下2014-02-02
JavaScript 數(shù)組常見(jiàn)操作技巧 (二)
這篇文章主要介紹了JavaScript 數(shù)組常見(jiàn)操作技巧,上一篇文章已經(jīng)給大家分享了(一),下面緊接上一篇文章分享下面技巧,需要的小伙伴可以參考一下2022-02-02
使用gulp搭建本地服務(wù)器并實(shí)現(xiàn)模擬ajax
這篇文章主要給大家介紹了如何使用gulp搭建本地服務(wù)器并實(shí)現(xiàn)模擬ajax的相關(guān)資料,文中介紹的非常詳細(xì),相信對(duì)大家具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面來(lái)一起看看吧。2017-04-04
JSON.stringify轉(zhuǎn)換JSON時(shí)日期時(shí)間不準(zhǔn)確的解決方法
這篇文章主要介紹了JSON.stringify轉(zhuǎn)換JSON時(shí)日期時(shí)間不準(zhǔn)確的解決方法,即JSON數(shù)據(jù)中包含日期對(duì)象時(shí),在轉(zhuǎn)換時(shí)會(huì)轉(zhuǎn)換成國(guó)際時(shí)間,而不是中國(guó)的時(shí)區(qū),需要的朋友可以參考下2014-08-08
javascript?實(shí)現(xiàn)純前端將數(shù)據(jù)導(dǎo)出excel兩種方式
這篇文章主要介紹了javascript?實(shí)現(xiàn)純前端將數(shù)據(jù)導(dǎo)出excel兩種方式,文章圍繞主題展開(kāi)詳細(xì)的內(nèi)容介紹,具有一定的參考價(jià)值,需要的小伙伴可以參一下2022-07-07
vue2.0實(shí)戰(zhàn)之基礎(chǔ)入門(mén)(1)
這篇文章主要為大家詳細(xì)介紹了vue2.0實(shí)戰(zhàn)第一篇基礎(chǔ)入門(mén)的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-03-03
JS實(shí)現(xiàn)下拉框的動(dòng)態(tài)添加(附效果)
頁(yè)面初加載時(shí):選擇車類型后:選擇車顏色后:JS實(shí)現(xiàn)下拉框的動(dòng)態(tài)添加,網(wǎng)頁(yè)代碼如下:動(dòng)態(tài)添加下拉框 車類型:請(qǐng)選擇寶馬、奔馳 車顏色2013-04-04

