JavaScript cookie

  • 2019-06-15
  • 143
  • 0
  • 0

一、认识cookie

  1. cookie : 存储在本地的一个数据,当用户访问了某个网站(网页)的时候,我们就可以通过cookie来向访问者电脑上存储数据。
  2. 不同的浏览器存放的cookie位置不一样,也是不能通用的。
  3. cookie的存储是以域名形式进行区分的,每个域名对应一个cookie存储地址。
  4. cookie的数据可以设置名字的。
  5. 一个域名下存放的cookie的个数是有限制的,不同的浏览器存放的个数不一样。
  6. 每个cookie存放的内容大小也是有限制的,不同的浏览器存放大小不一样。
  7. 默认存储时间就是当前会话。
  8. cookie可以设置多个,只有同名cookie能够覆盖原来的cookie。

二、访问cookie

要在服务器环境下,通过document.cookie来获取当前网站下的cookie的时候,得到的字符串形式的值,他包含了当前网站下所有的cookie。他会把所有的cookie通过一个分号+空格的形式串联起来。

consol.log( document.cookie );

三、存储cookie

document.cookie = '数据名=值'; //不设置时间 ,当前会话结束

四、设置cookie过期时间

  1. cookie默认是临时存储的,当浏览器关闭进程的时候自动销毁,如果我们想长时间存放一个cookie。需要在设置这个cookie的时候同时给他设置一个过期的时间。过期时间必须是一个日期对象转换成的字符串(时间戳.toGMTString())
  2. document.cookie = ‘数据名=值; expires=过期时间’;
  3. 把时间设置为过期时间,cookie会被删除。
document.cookie = 'name=abc;expires='+date.toGMTString();//date=>new Date();时间对象

var date = new Date(new Date().getTime() + 30 * 60 * 1000);//30分钟后过期的cookie
document.cookie = 'name=abc;expires='+date.toGMTString();

五、封装cookie

var cookieArr = [
    {
        name : 'test1',
        value : '30分钟',
        time : 30
    },
    {
        name : 'test2',
        value : '50分钟',
        time : 50
    },
    {
        name : 'test3',
        value : '30天',
        time : 30 * 24 * 60
    },
    {
        name : 'test4',
        value : '30秒',
        time : 0.5
    }
];

setCookie(cookieArr);//数组的形式
setCookie({
    name : 'obj',
    value : 'dasjd=/\\||;',
    time : 10
});//json的形式

/*
*   设置一个cookie //
* */
function setCookie(data) {
    if(is_array(data)){
        for(var i = 0,iL = data.length;i < iL;i++){
            setCookie(data[i]);
        }
    }else{
        var _date = new Date(new Date().getTime() + data.time * 60 * 1000).toGMTString();
        document.cookie = data.name+'='+encodeURIComponent(data.value)+';expires='+_date;
    }
    //var _date = new Date(new Date().getTime() + data.time * 60 * 1000).toGMTString();
    //document.cookie = data.name+'='+data.value+';expires='+_date;
}

/*
* 删除一个cookie
* */
function delCookie(_name) {
    setCookie({
        name : _name,
        value : '',
        time : -1//设置一个过期时间
    });
}

/*
*  获取一个cookie
* */
function getCookie(_name) {
    var data = document.cookie.match(new RegExp('\\b'+_name+'=([^;]+)(;|$)'));
    return data ? decodeURIComponent(data[1]) : '';
}

//判断是否为一个数组
function is_array(arr) {
     return  arr != null && typeof arr == 'object' && typeof arr.length == 'number'
}

评论

还没有任何评论,你来说两句吧