1.什么是Cookie？

1.1簡(jiǎn)介

主要用于存儲(chǔ)訪問過的網(wǎng)站數(shù)據(jù)，存儲(chǔ)瀏覽器的信息到本地計(jì)算機(jī)中，用于客戶端和服務(wù)器端的通訊

Cookie 是為了解決“如何記住用戶信息”而發(fā)明的：

• 當(dāng)用戶訪問網(wǎng)頁(yè)時(shí)，他的名字可以存儲(chǔ)在 cookie 中。
• 下次用戶訪問該頁(yè)面時(shí)，cookie 會(huì)“記住”他的名字。

注意:如果瀏覽器完全禁止cookie,大多數(shù)網(wǎng)站的基本功能都將無法正常使用，chrome瀏覽器不支持本地文件的cookie的讀取

1.2特點(diǎn)

• 以文本形式保存(.txt)
• cookie存儲(chǔ)信息不安全（不能存放重要的信息）
• cookie中有域（domain）和路徑的概念,瀏覽器是一個(gè)比較安全的環(huán)境，所以不同的域之間不能直接訪問（js的同源策略限制）

2.JavaScript操作Cookie

2.1基礎(chǔ)操作

JavaScript 可以用 document.cookie 屬性創(chuàng)建、讀取、刪除 cookie。

document.cookie='name=托馬'
console.log(document.cookie)

Cookie的常用屬性：

• name cookie的名字(鍵)
• value cookie存放的值
• expires：指cookie過期的時(shí)間（該時(shí)間為世界時(shí)間  UTC時(shí)間）也稱為格林威治時(shí)間
• max-age:指cookie最大的存活有效期（單位：秒）
• domain: 指的是cookie當(dāng)前的域
• path:指cookie當(dāng)前的路徑
• size:指cookie存放的大小
• secure:指cooke的安全屬性

注意：expires和max-age的默認(rèn)值為session代表關(guān)閉瀏覽器，該cookie則清空、失效

2.2設(shè)置失效時(shí)間

需求：設(shè)置一個(gè)60分鐘后失效的Cookie

function setCookie(name,val,min){
    var now=new Date();
    //設(shè)置時(shí)間
    now.setMinutes(now.getMinutes()+min)

    //設(shè)置Cookie
    document.cookie=name+'='+val+';expires='+now.toUTCString()
}
setCookie('托馬','火',60)

控制臺(tái)顯示的失效時(shí)間

系統(tǒng)當(dāng)前時(shí)間：

一個(gè)小時(shí)候的時(shí)間應(yīng)該為16:55，但控制臺(tái)輸出的是08:55,因?yàn)檫@個(gè)時(shí)間是世界時(shí)間 （UTC時(shí)間），也稱為格林威治時(shí)間。

百度一下查得：

所以8:55+8:00=16:55，我們?cè)O(shè)置的失效時(shí)間成功。

提前清除緩存：

function setCookie(name,val,min){
   var now=new Date();
      //設(shè)置時(shí)間
      now.setMinutes(now.getMinutes()+min)

      //設(shè)置Cookie
      document.cookie=name+'='+val+';expires='+now.toUTCString()
  }
  setCookie('托馬','火',1)

//通過一次性定時(shí)器提前清除Cookie
setTimeout(function(){
	setCookie('托馬','',-1)
},3000)
//	setCookie('托馬','',-1)
//第一個(gè)參數(shù)一定要對(duì)應(yīng)，不然找不到這個(gè)Cookie
//第二個(gè)參數(shù)可寫可不寫
//第三個(gè)參數(shù)設(shè)置為-1

演示結(jié)果：

總結(jié)

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

最新評(píng)論