首頁 > web前端 > js教程 > 前端中怎樣設定cookie

前端中怎樣設定cookie

php中世界最好的语言
發布: 2018-05-24 11:02:54
原創
4050 人瀏覽過

這次帶給大家前端中怎麼設定cookie,前端中設定cookie的注意事項有哪些,以下就是實戰案例,一起來看一下。

cookie

是什麼:是一種用來在客戶端硬碟上儲存資訊的手段。

為什麼要用? :可以用來儲存一些訊息,實現一些特殊的效果。例如實現多少天內免登陸,或儲存一些小資料。

cookie中的一些欄位意義:

  1. key=value(鍵=值) 是cookie的一個鍵值對,一般是根據key拿到對應的value

  2. expires(過期時間)設定該cookie的過期時間,也是用';' 來隔開,expires=GMT的時間字串,例如要30天免登陸,就可以設定過期時間為今天開始的30天之後的日期。如果不設定過期時間,預設瀏覽器關閉該cookie就消失了。

  3. path(路徑) cookie並不是在哪裡都能夠取得的。在網站中分成許多目錄,可能很多目錄中不需要使用到cookie,所以可以設定cookie的路徑,這樣比較安全,避免任意目錄都能存取到該cookie。透過path=/E:javascript/test 這樣只能在該目錄下才能取得到該cookie

  4. domain(網域)預設該cookie在該cookie所在網域下才能夠存取到,但有時候a.chaijinsong.com需要存取b.chaijinsong.com下的cookie,這時候就需要設定domain=chaijinsong.com。這樣兩個子網域都可以存取該cookie

  5. secure(安全性) 預設secure是為false的,即透過http協定來傳輸,但是如果secure=true 的話,就只能t透過https來進行傳輸

怎麼用? :
document.cookie; //获取cookie
"aaa=aaa;bbb=bbb" //类似于这种格式,但是并不是字符串。
//设置cookie,也可以用来进行删除cookie,即将过期时间设置为过去的时间,最后一个参数可以传负数来实现
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;
}
setCookie('cjs','cjs',30); //设置 name为cjs,value为cjs的一个cookie,并且时间为30天。
setCookie('cjs','cjs',-1); //让该cookie过期,然后在document.cookie中就没有cjs=cjs这个cookie了。但是其他key=value还存在
//获取某个key的cookie
function getCookie(key){
    let arr1 = document.cookie.split(';');
    for(let i=0;i<arr1.length;i++){
        let arr2 = arr1[i].split('=');
        if(key.trim() === arr2[0].trim()){
            return (arr2[1]);
        }
    }
    return "";
}
getCookie('cjs'); //因为上面已经将cjs这个cookie干掉了,所以这里得到为 ""
登入後複製

注意:在google瀏覽器上本地html檔案開啟直接給cookie賦值是不允許的,但是firefox可以。所以想要測試的話先在本地開伺服器,讓後再使用本地ip存取該檔案。進行cookie的操作。

相信看了本文案例你已經掌握了方法,更多精彩請關注php中文網其它相關文章!

推薦閱讀:

使用CSS實作乒乓球對打動畫

使用CSS實作乒乓球對打動畫

以上是前端中怎樣設定cookie的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板