javascript中的cookie题目

在他处看到一篇好文章,想记录在本身的进修笔记中,原文作者看到我转载假如介怀,联络我立马就删除,附上原文链接:
http://blog.csdn.net/sunhengzhe/article/details/46694039

首先要明白一下cookie的观点,由于HTTP协定是一种无状况协定,也就是说一旦服务器和客户端的数据交流终了后,他们之间的衔接就会被断开,再次交流数据的时刻就须要再次竖立衔接,这就意味着服务器没法从衔接上推断客户端。
为了处理这个题目,W3C引入了cookie机制。cookie就比如一个身份证,客户端要求服务器的时刻,服务器将这个身份证颁布给客户端,客户端(浏览器)将这个身份证保留在当地,当下次衔接服务器时,客户端照顾这个身份证要求服务器,服务器依据身份证即可肯定用户身份。
cookie不仅客户端能接见到,由于客户端要求服务器的时刻会将cookie放在要求头里带到服务器,所以服务器也能对cookie举行操纵,这里议论运用javascript在客户端对cookie举行操纵的要领。

一、写入cookie

写入cookie主要设置五个字段,内容、有效期、域名、途径、是不是平安传输。

内容

cookie是以键值对情势保留的,要新建一个名为name,值为zhangsan的cookie就是“name=zhangsan”,只需将这个cookie赋值给document.cookie即可:

document.cookie = "name=zhangsan";  //增加cookie

document.cookie有读和写两种情势,上面这个情势就是写情势,写情势代表增加cookie,且一次只能增加一条cookie,要增加多条则须要挪用屡次。如

document.cookie = "name=zhangsan;age=10"; //无效,只增加了name,疏忽age
document.cookie = "age=10";  //增加age

有效期

默许情况下,cookie在封闭浏览器的时刻就会被消灭,想让cookie寄存更长时候能够经由历程设置expires字段完成。
expires字段须要的值是GMT(格林威治时候)花样的日期型字符串,能够用Date对象获得:

var date = new Date();
//将时候设置成30分钟今后
date.setTime(date.getTime() + 30 * 60 * 1000);
//name=zhangsan将在30分钟后逾期
document.cookie = "name=zhangsan;expires="+date.toGMTString();

想调解逾期时候,只须要修正setTime一行的代码。

域名

处于平安性的斟酌,cookie是具有不可跨域性的,用户接见百度的时刻,百度为客户端颁布了一个cookie,用户再去接见谷歌,谷歌给客户端颁布一个cookie,那末百度和谷歌是不能接见到相互的cookie的。
然则平常来说,我们接见baidu.com的时刻会发明,你是能够接见到map.baidu.com的cookie的,这是由于给cookie设置了domian属性,由于map.baidu.com和baidu.com具有一样的域名baidu.com,所以能够为cookie设置domian值为baidu.com

document.cookie = "name=zhangsan;domain=baidu.com";

途径

一样原理,blog.csdn.net是接见不到blog.csdn.net/sunhengzhe内里的cookie的(但反过来能够),为了使上级目次接见到下级目次,在blog.csdn.net/sunhengzhe里新建cookie时,能够为cookie设置path属性,平常能够直接将其设置为根目次

document.cookie = "name=zhangsan;path=/";

平安传输

cookie是保留在客户端当地的,所以检察cookie是很轻易,这也暴露了cookie的不平安性,所以平常cookie不寄存如暗码等主要信息,secure属性并非用来设置cookie内容的平安性的,而是用于传输历程当中的平安,设置secure后,只保证 cookie 与服务器之间的数据传输历程加密,而保留在当地的 cookie文件并不加密。所以假如是想让当地保留的cookie也加密的话,最幸亏保留cookie值的时刻就保留加密后的数据。

document.cookie = "name=zhangsan;secure";

二、读取cookie

读取cookie运用到document.cookie的读形式,返回的就是一切的cookie,中心用分号离隔。

document.cookie = "name=zhangsan";  //写
document.cookie = "age=10";  //写
console.log(document.cookie);  //输出 name=zhangsan; age=10

三、删除、修正cookie

cookie并不供应删除、修正的要领,假如想修正某项cookie,只需增加一个同名cookie,新的值将掩盖旧的值。

document.cookie = "name=zhangsan";
document.cookie = "name=lisi";  //name被修正为lisi

要删除cookie,只需将该cookie有效期设置到当前时候之前即可。

var date = new Date();
//设置为前一毫秒(多前都能够)
date.setTime(date.getTime() - 1);
//删除name
document.cookie = "name=lisi;expires=" + date.toGMTString();

四、封装操纵cookie的要领

运用原生要领对cookie操纵是有些贫苦的,我们能够将其封装起来,name代表键名,value代表值,不填则为读取名为name的值,option代表设置值若有效期等。个中有效期单元为天。

function cookie(name, value, options) {
    if (typeof value != 'undefined') {
        options = options || {};
        //假如值为null, 删除cookie
        if (value === null) {
            value = '';
            options = {
                expires: -1
            };
        }
        //设置有效期
        var expires = '';
        if (options.expires && (typeof options.expires == 'number' || options.expires.toGMTString)) {
            var date;
            if (typeof options.expires == 'number') {
                date = new Date();
                date.setTime(date.getTime() + (options.expires * 24 * 60 * 60 * 1000));
            } else {
                date = options.expires;
            }
            expires = ';expires=' + date.toGMTString();
        }
        var path = options.path ? ';path=' + (options.path) : '';
        var domain = options.domain ? ';domain=' + (options.domain) : '';
        var secure = options.secure ? ';secure' : '';
        //设置cookie
        document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join('');
    } else {
        //读取cookie
        if (document.cookie.length > 0) {
            var start = document.cookie.indexOf(name + "=")
            if (start != -1) {
                start = start + name.length + 1;
                var end = document.cookie.indexOf(";", start);
                if (end == -1){
                    end = document.cookie.length;
                }
                return decodeURIComponent(document.cookie.substring(start, end));
            }
        }
        return ""
    }
}

cookie("name", "zhangsan"); //增加name=zhangsan
cookie("name", null); // 删除name
cookie("age", "10", {
    expires: 30
}); // 增加age=10且有效期30天
    原文作者:jm_1231
    原文地址: https://segmentfault.com/a/1190000004189877
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞