javascript 操做Cookie
一、javascript說明javascript
Cookie 基礎知識html
- cookie 是有大小限制的，每一個 cookie 所存放的數據不能超過4kb，若是 cookie 字符串的長度超過4kb，則該屬性將返回空字符串。
- 因爲 cookie 最終都是以文件形式存放在客戶端計算機中，因此查看和修改 cookie 都是很方便的，這就是爲何常說 cookie 不能存放重要信息的緣由。
- 每一個 cookie 的格式都是這樣的：<cookie名>=<值>；名稱和值都必須是合法的標示符。
- 每一個網站下面最多保存20個cookie,20個cookie是20個鍵值對，
- cookie 是存在 有效期的。在默認狀況下，一個 cookie 的生命週期就是在瀏覽器關閉的時候結束。若是想要 cookie 能在瀏覽器關掉以後還可使用，就必需要爲該 cookie 設置有效期，也就是 cookie 的失效日期。
- alert(typeof document.cookie) 結果是 string，曾經我覺得是array，還鬧過笑話…囧
- cookie 有域和路徑這個概念。域就是domain的概念，由於瀏覽器是個注意安全的環境，因此不一樣的域之間是不能互相訪問 cookie 的(固然能夠經過特殊設置的達到 cookie 跨域訪問)。路徑就是routing的概念，一個網頁所建立的 cookie 只能被與這個網頁在同一目錄或子目錄下得全部網頁訪問，而不能被其餘目錄下得網頁訪問（這句話有點繞，一會看個例子就好理解了）。
- 其實建立cookie的方式和定義變量的方式有些類似，都須要使用 cookie 名稱和 cookie 值。同個網站能夠建立多個 cookie ，而多個 cookie 能夠存放在同一個cookie 文件中。
- Cookie 常見問題
-
- cookie 存在兩種類型：
- 你瀏覽的當前網站自己設置的 cookie
- 來自在網頁上嵌入廣告或圖片等其餘域來源的 第三方 cookie (網站可經過使用這些 cookie 跟蹤你的使用信息)
- 剛剛基礎知識裏面有說到 cookie 生命週期的問題，其實 cookie 大體可分爲兩種狀態：
- 臨時性質的cookie。當前使用的過程當中網站會儲存一些你的我的信息，當瀏覽器關閉後這些信息也會從計算機中刪除
- 設置失效時間的cookie。就算瀏覽器關閉了，這些信息業依然會在計算機中。如 登陸名稱和密碼，這樣無須在每次到特定站點時都進行登陸。這種cookie 可在計算機中保留幾天、幾個月甚至幾年
- cookie 有兩種清除方式：
- 經過瀏覽器工具清除 cookie (有第三方的工具，瀏覽器自身也有這種功能)
- 經過設置 cookie 的有效期來清除 cookie
- 注：刪除 cookie 有時可能致使某些網頁沒法正常運行
- 瀏覽器能夠經過設置來接受和拒絕訪問 cookie。
- 出於功能和性能的緣由考慮，建議儘可能下降 cookie 的使用數量，而且要儘可能使用小 cookie。
- 關於cookie編碼的細節問題將會在cookie高級篇中單獨介紹。
- 假如是本地磁盤中的頁面，chrome的控制檯是沒法用JavaScript讀寫操做 cookie 的，解決辦法…換一個瀏覽器。
javascript設置cookiejava
document.cookie="username=zhangsan";//設置cookiechrome
設置cookie的有效期跨域
咱們在開始說cookie的生命週期也就是有效期和失效期，即cookie的存在時間。在默認狀況下,cookie會在瀏覽器關閉的時候自動清除，可是咱們能夠經過expires倆設置cookie的有效期，語法以下：數組
document.cookie="name=value;expires=date";瀏覽器
上面的時間生成方法以下：安全
var d=new Date();//獲得當前時間服務器
d.setDate(d.getDate()+30);//d.getDate()獲得本地月份的某一天，接着加上30,就是但願cookie能在本地保存30天，而後經過使用setDate()來設置時間cookie
d.toDateString();//將其轉化爲字符創，並返回結果
下面經過一個完整的函數來講一下：
function
setCookie(c_name, value, expiredays){
var
exdate=new
Date();
exdate.setDate(exdate.getDate() + expiredays);
document.cookie=c_name+ "="
+ escape(value) + ((expiredays==null) ? ""
: ";expires="+exdate.toGMTString());
}
使用方法：setCookie('username','Darren',30)
在這兒也能夠不使用三目運算符，
var tmp+=c_name+"="+escape(value);
if(expiredays)
tmp+=" ;expires="+exdate.toDateString();
上面例子是咱們安裝天數來設置cookie的，若是想要安裝小時設置cookie，則以下：
exdate.setHours(exdate.getHours()+expiredays);
其餘，年，月，分同上。
|
Cookie 高級篇
一.cookie 路徑概念
在基礎知識中有提到 cookie 有域和路徑的概念，如今來介紹路徑在 cookie 中的做用。
cookie 通常都是因爲用戶訪問頁面而被建立的，但是並非只有在建立 cookie 的頁面才能夠訪問這個 cookie。
默認狀況下，只有與建立 cookie 的頁面在同一個目錄或子目錄下的網頁才能夠訪問，這個是由於安全方面的考慮，形成不是全部頁面均可以隨意訪問其餘頁面建立的 cookie。舉個例子：
在 "http://www.cnblogs.com/Darren_code/" 這個頁面建立一個cookie，那麼在"/Darren_code/"這個路徑下的頁面如： "http://www.cnblogs.com/Darren_code/archive/2011/11/07/Cookie.html"這個頁面默認就能取到cookie信息。
可在默認狀況下， "http://www.cnblogs.com"或者 "http://www.cnblogs.com/xxxx/" 就不能夠訪問這個 cookie（光看沒用，實踐出真理）。
那麼如何讓這個 cookie 能被其餘目錄或者父級的目錄訪問類，經過設置 cookie 的路徑就能夠實現。例子以下：
|
1
2
|
document.cookie = "name=value;path=path"
document.cookie = "name=value;expires=date;path=path"
|
紅色字體path就是 cookie 的路徑，最經常使用的例子就是讓 cookie 在跟目錄下,這樣不論是哪一個子頁面建立的 cookie，全部的頁面均可以訪問到了:
|
1
|
document.cookie = "name=Darren;path=/"
|
二.cookie 域概念
路徑能解決在同一個域下訪問 cookie 的問題，我們接着說 cookie 實現同域之間訪問的問題。語法以下：
|
1
|
document.cookie = "name=value;path=path;domain=domain"
|
紅色的domain就是設置的 cookie 域的值。
例如 "www.qq.com" 與 "sports.qq.com" 公用一個關聯的域名"qq.com"，咱們若是想讓 "sports.qq.com" 下的cookie被 "www.qq.com" 訪問，咱們就須要用到 cookie 的domain屬性，而且須要把path屬性設置爲 "/"。例：
|
1
|
document.cookie = "username=Darren;path=/;domain=qq.com"
|
注：必定的是同域之間的訪問，不能把domain的值設置成非主域的域名。
三.cookie 安全性
一般 cookie 信息都是使用HTTP鏈接傳遞數據，這種傳遞方式很容易被查看，因此 cookie 存儲的信息容易被竊取。假如 cookie 中所傳遞的內容比較重要，那麼就要求使用加密的數據傳輸。
因此 cookie 的這個屬性的名稱是「secure」，默認的值爲空。若是一個 cookie 的屬性爲secure，那麼它與服務器之間就經過HTTPS或者其它安全協議傳遞數據。語法以下：
|
1
|
document.cookie = "username=Darren;secure"
|
把cookie設置爲secure，只保證 cookie 與服務器之間的數據傳輸過程加密，而保存在本地的 cookie文件並不加密。若是想讓本地cookie也加密，得本身加密數據。
注：就算設置了secure 屬性也並不表明他人不能看到你機器本地保存的 cookie 信息，因此說到底，別把重要信息放cookie就對了，囧…
四.cookie 編碼細節
本來來想在常見問題那段介紹cookie編碼的知識，由於若是對這個不瞭解的話編碼問題確實是一個坑，因此仍是詳細說說。
在輸入cookie信息時不能包含空格，分號，逗號等特殊符號，而在通常狀況下，cookie 信息的存儲都是採用未編碼的方式。因此，在設置 cookie 信息之前要先使用escape()函數將 cookie 值信息進行編碼，在獲取到 cookie 值得時候再使用unescape()函數把值進行轉換回來。如設置cookie時：
|
1
|
document.cookie = name + "="+ escape (value)
|
再看看基礎用法時提到過的getCookie()內的一句：
|
1
|
return
unescape(document.cookie.substring(c_start,c_end))
|
這樣就不用擔憂由於在cookie值中出現了特殊符號而致使 cookie 信息出錯了。
讀取Cookie
function GetCookie(cname) {
if (document.cookie.length > 0) {//首先判斷cookie是否存在
c_start = document.cookie.indexOf(cname + "="); //經過String對象的indexOf()來檢查這個cookie是否存在，不存在就爲 -1
if (c_start != -1) {
c_start = c_start + cname.length + 1; //最後這個+1其實就是表示"="號啦，這樣就獲取到了cookie值的開始位置
c_end = document.cookie.indexOf(";", c_start); //其實我剛看見indexOf()第二個參數的時候猛然有點暈，後來想起來表示指定的開始索
if (c_end == -1)
c_end = document.cookie.length;
return unescape(document.cookie.substring(c_start, c_end)); //經過substring()獲得了值。想了解
}
}
return "";
}
//注：讀取cookie的方法還能夠對cookie進行分割字符創，使用數組，或者使用正則
經過分隔分號加空格符號，就能夠得到各個 cookie，再經過分隔等號，就能夠得出各個 cookie 的名稱和值。
cookie 的子鍵，只是表如今 cookieValue 上，一個子鍵的結構是：子鍵名稱=子鍵值，多個子鍵之間用 & 鏈接起來。好比：
cookieName1=子鍵名稱1=子鍵值1&子鍵名稱2=子鍵值2
document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/paTH/";
同名的 cookie，不一樣的 domain 或不一樣的 path，屬不一樣的 cookie；
同名的 cookie，相同的 domain 且相同的 path，不一樣的 expires，屬同一個 cookie。
cookie 有路徑－－path，表示哪些路徑下的文件有權限讀取該 cookie。
path 應該以 "/" 結尾，同名 cookie，不一樣 path，屬不一樣的 cookie
document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/paTH/";
|
document.cookie = "N1=1; path=/path/";
document.cookie = "N1=2; path=/paTH/";
|
這是兩個不一樣的 cookie，由於 path 屬性值大小寫不一樣，若是咱們在地址欄輸入的是 path，那麼就讀取第一個 N1，若是咱們輸入的是 paTH，那麼就讀取第二個 N1
path 不可讀
同 expires 同樣，path 只可寫，不可讀。
path 不可更改
同 expires 不同，若是咱們試圖更改 path，那麼實際上咱們是另外寫了一個 cookie，而不是更改了 path 值。
path 權限有繼承性
假如指定了 /test/ 目錄有權限讀取某 cookie，那麼 /test/ 之下的目錄 /test/t/ 也有權限讀取該 cookie。
cookie 有失效日期－－expires，若是尚未過失效期，即便從新啓動電腦，cookie 仍然不會丟失，若是沒有指定 expires 值，那麼在關閉瀏覽器時，cookie 即失效。
在 JS(JavaScript) 中使用 expires 時應該和 cookie 同時寫入，如：
|
1
|
document.cookie = "clr=red; expires="
+ expiresDate;
|
而以下寫法是不正確的：
|
1
2
3
|
document.cookie = "clr=red";
document.cookie = "expires="
+ expiresDate;
|
document.cookie = "expires=" + expiresDate;
這樣寫會造成兩個 cookie，第二個 cookie 的名稱是 expires，兩個 cookie 均沒有指定失效日期。
expires 不可讀
設置多個cookie
//設置多個cookie
function SetMultiCookie() {
var d = new Date();
d.setFullYear(2013, 1, 10);
var d1 = new Date();
d1.setFullYear(2013, 8, 15);
var d2 = new Date();
d2.setMonth(6, 10);
document.cookie = "username=zhan" + ";expires=" + d.toDateString();
document.cookie = "uname=wangwu123;"+";;expires=" + d.toDateString()+";";
document.cookie = "firstname=zhangsan "+";;"+";expires=" + d1.toDateString()+";";
document.cookie = "lastname=qiangqi"+";"+";;expires=" + d2.toDateString();
}
function SetOneCookie() {
var d = new Date();
d.setFullYear(2013, 1, 10);
var d1 = new Date();
d1.setFullYear(2013, 8, 15);
var d2 = new Date();
d2.setMonth(6, 10);
document.cookie += "username=zhan" + ";expires=" + d.toDateString();
document.cookie += "uname=wangwu123;"+";;expires=" + d.toDateString()+";";
document.cookie += "firstname=zhangsan "+";;"+";expires=" + d1.toDateString()+";";
document.cookie += "lastname=qiangqi"+";"+";;expires=" + d2.toDateString();
}
function GetMultiCookie() {
var cookies = document.cookie;
alert(cookies);//若是是多個cookie則每一個cookie使用";"分割，一個cookie則直接讀取
alert(cookies.length);
}
刪除cookie，則是經過設置一個過時的時間，或者給一個空值在從新寫一下
- 1. javascript cookie 操做
- 2. javascript操做cookie
- 3. 用 JavaScript 操做 Cookie
- 4. Javascript 中 cookie 操做方式
- 5. JS操做cookie
- 6. Jquery操做cookie
- 7. js操做cookie
- 8. Django--cookie操做
- 9. javascript操做cookie函數寫法
- 10. cookie操做詳解
- 更多相關文章...
- • PHP Cookie - PHP教程
- • JavaScript 指南 - 網站建設指南
- • RxJava操作符（十）自定義操作符
- • RxJava操作符（四）Combining
-
每一个你不满意的现在，都有一个你没有努力的曾经。