客戶端數據存儲機制cookie
在實際的Web應用中經常需要在客戶端存儲一些客戶信息一方面是為了改善用戶體驗(如存儲訪問密碼歷史表單信息)另一方面有效地減輕了服務器數據讀取壓力訪問者在第一次訪問頁面時設置cookie變量是存儲在客戶端計算機中當下次浏覽器請求某個頁面時就可以讀取cookie中存儲的值從而實現客戶端數據存取
下面將通過一個例子展示一個客戶端數據存儲的實際應用執行流程如下
()創建一個存儲訪問者名字的cookie;
()當訪問者首次訪問網站時訪問者會被要求填寫姓名信息該姓名信息會存儲於cookie中
()當訪問者再次訪問網站時浏覽器會顯示歡迎詞信息
在JavaScript創建cookie
創建一個可在cookie變量中存儲訪問者姓名的函數代碼如下
function setCookie(c_namevalueexpiredays)
{
var exdate=new Date() //實例化日期變量
exdatesetDate(exdategetDate()+expiredays) //設置日期變量
documentcookie=c_name+ = +escape(value)+
((expiredays==null) ? : ;expires=+exdatetoGMTString())
}
【代碼解讀】
setCookie()函數的功能是設置cookie的名稱值及失效時間首先將獲取當前的日期轉換為有效的日期然後設置cookie名稱值及失效時間並將該值存入documentcookie對象
從JavaScript取回cookie的值
從JavaScript取回cookie的值創建讀取客戶端cookie值的函數同時判斷當前cookie的狀態代碼如下
function getCookie(c_name)
{
if (documentcookielength>) //判斷當前cookie是否為空
{
c_start=documentcookieindexOf(c_name + =)
if (c_start!=)
{
c_startc_start=c_start + c_namelength+
c_end=documentcookieindexOf(;c_start)
if (c_end==) c_end=documentcookielength
return unescape(documentcookiesubstring(c_startc_end))
//返回客戶端cookie的值
}
}
return
}
【代碼解讀】
getCookie()函數首先會判斷documentcookie對象中是否存有cookie如果documentcookie對象存有某些cookie值那麼會繼續檢查指定的cookie是否已儲存如果滿足判斷條件就返回cookie存儲值否則返回空字符串
JavaScript流程控制
當完成了cookie的創建和讀取之後需要創建一個流程控制函數這個函數的作用是如果cookie已設置則顯示歡迎詞否則顯示提示框要求用戶輸入名字
function checkCookie() {
username=getCookie(username) //獲得cookie中的用戶名變量
if (username != null && username != ) {
alert(Welcome again +username+!) //彈出歡迎信息
} else {
username=prompt(Please enter your name:)
if (username != null && username != ) {
setCookie(usernameusername) //設置cookie
}
}
}
客戶端數據存儲示例的完整代碼如下
[] []
From:http://tw.wingwit.com/Article/program/PHP/201311/21526.html