JavaScript Cookie
什麼是 Cookies？
Cookies 是一些資料, 儲存在你電腦上的文字檔案中。
當 web 伺服器向瀏覽器發送 web 頁面時，在連線關閉後，服務端不會記錄使用者的信息。
Cookies 的功能就是用來解決 "如何記錄客戶端的使用者資訊":
當使用者造訪 web 頁面時，他的名字可以記錄在 cookie 中。
在使用者下次造訪該頁面時，可以在 cookie 中讀取使用者存取記錄。
Cookies 以名/值對形式存儲，如下所示:
username=John Doe
當瀏覽器從伺服器上請求web 頁面時， 屬於該頁面的cookies 會被加入到該請求中。服務端透過這種方式來獲取用戶的資訊。
document cookie 屬性定義
cookie 屬性可設定或查詢與目前文件相關的所有 cookie。語法如下：
document.cookie [ = name1=value1; expire=GMT_String; path=; domain=;]
設定cookie 值
現在要設定兩個cookie：
user_id=2;
user_name=admin;
JavaScript 程式碼如下：
document.cookie = "user_id=2";
document.cookie = "user_name=admin";
設定cookie 過期時間，路徑及作用域
下面的範例設定過期時間為一天，路徑為網站根目錄，所有此網域下的cookie 都共用：
//取得目前時間
var date=new Date();
date.setTime(date.getTime()+24*3600*1000);
document.cookie = "user_id=2;path=/;domain=.5idev.com;expire=" +date.toGMTString();
設定cookie 有特殊符號
在cookie 的名稱或值中不能使用分號（;） 、逗號（,）、等號（=）以及空格，當值中需要保留這些符號時，需要用escape() 函數編碼，它能將一些特殊符號使用十六進位表示。
document.cookie = "test="+escape("JavaScript cookie test");
而在取出值以後再使用unescape() 進行解碼從而得到原來的cookie 值，這種方法還能有效避免中文亂碼等。
取得 cookie 值
透過 document.cookie 可以直接取得目前頁面 cookie 的值，得到的是一個字串。下面的範例讀取目前頁面的 cookie（如果有的話）：
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <p>与本文档相关的 cookies（如果存在的话）：</p> <script type="text/javascript"> document.write(document.cookie) </script> </body> </html>
檢測 cookie 值的函數
最後，我們可以建立一個偵測 cookie 是否建立的函數。
如果設定了 cookie，將顯示一個問候資訊。
如果沒有設定cookie，將會顯示一個彈跳窗用於詢問訪客的名字，並呼叫setCookie 函數將訪客的名字儲存365 天：
function checkCookie()
{
var username=getCookie("username");
if (username!="")
{
alert("Welcome again " + username);
}
else
{
username = prompt("Please enter your name:","");
if (username!="" && username!=null)
{
setCookie("username",username,365);
}
}
}#使用JavaScript 建立Cookie
JavaScript 可以使用 document.cookie 屬性來建立、讀取、並刪除cookies。
JavaScript 中，建立cookie 如下所示：
document.cookie="username=John Doe";
您也可以為cookie 新增一個過期時間（以UTC 或GMT 時間）。預設情況下，cookie 在瀏覽器關閉時刪除：
##document.cookie="username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 GMT";
您可以使用path 參數告訴瀏覽器cookie 的路徑。預設情況下，cookie 屬於目前頁面。document.cookie="username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
#使用JavaScript 讀取Cookie
在JavaScript 中, 可以使用以下程式碼來讀取cookies：var x = document.cookie;
提示：document.cookie 將以字串的方式傳回所有的cookies，類型格式： cookie1=value; cookie2=value; cookie3=value;
#
使用JavaScript 修改Cookie
在JavaScript 中，修改cookies 類似於建立cookies，如下所示：
document.cookie= "username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";
舊的cookie 將會被覆寫。
使用 JavaScript 刪除 Cookie
刪除 cookie 非常簡單。您只需要設定expires 參數為先前的時間即可，如下所示，設定為Thu, 01 Jan 1970 00:00:00 GMT:
document.cookie = "username=; expires= Thu, 01 Jan 1970 00:00:00 GMT";
#注意，當您刪除時不必指定cookie 的值。
完整實例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php.cn</title>
</head>
<head>
<script>
function setCookie(cname,cvalue,exdays){
var d = new Date();
d.setTime(d.getTime()+(exdays*24*60*60*1000));
var expires = "expires="+d.toGMTString();
document.cookie = cname+"="+cvalue+"; "+expires;
}
function getCookie(cname){
var name = cname + "=";
var ca = document.cookie.split(';');
for(var i=0; i<ca.length; i++) {
var c = ca[i].trim();
if (c.indexOf(name)==0) return c.substring(name.length,c.length);
}
return "";
}
function checkCookie(){
var user=getCookie("username");
if (user!=""){
alert("Welcome again " + user);
}
else {
user = prompt("Please enter your name:","");
if (user!="" && user!=null){
setCookie("username",user,30);
}
}
}
</script>
</head>
<body onload="checkCookie()"></body>
</html>
