cookie的读写以及前后端操作

井梅 2018-10-10

展开全文

1、cookie的读写方式

1.1 cookie 客户端读取

常规cookie读取方法

 function getCookies(cookiename){
    var value = document.cookie.match(new RegExp("(^| )" + cookiename + "=([^;]*)(;|$)"));
    return null != value ? decodeURIComponent(value[2]) : null;

};

1.2 cookie 服务器端读取

//java
Cookie cookies = request.getCookies();

//php
$_COOKIE["cookiename"];

1.3 cookie 客户端写入

常规cookie写入方法

  function setcookie(name,value,day){
    var expdate=new Date();  
    var outms=day*24*60*60*1000;//过期时间，以天为单位'1’表示一天  
    expdate.setTime(expdate.getTime()+outms); 
document.cookie = name+"="+encodeURIComponent(value)+";path=/;domain="+getPath('domain').slice(1)+";expires="+expdate.toGMTString();  
};

1.4 cookie服务器端写入

java代码

//java的写法
response.setHeader("SET-COOKIE", key + "="+ value + ";Path=/;domain="+ domain + ";date="+date);

//php 中的写法
setcookie(name,value,expire,path,domain,secure)
//参数        描述
//name      必需。规定 cookie 的名称。
//value     必需。规定 cookie 的值。
//expire    可选。规定 cookie 的有效期。
//path      可选。规定 cookie 的服务器路径。
//domain    可选。规定 cookie 的域名。
//secure    可选。规定是否通过安全的 HTTPS 连接来传输 cookie。

2、javascript 中的编码方式

2.1 encodeURI / decodeURI

该函数可把字符串作为 URI 进行编码
不会对下列字符编码 ASCII字母数字 ~!@#$&*()=:/,;?+’

2.2 encodeURIComponent /decodeURIComponent

函数可把字符串作为 URI 组件进行编码。
不会对下列字符编码 ASCII字母数字 ~!*()’

2.3 escape unescape

函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。
不会编码的字符：@*/+

2.4 三种编码方式对比结论

encodeURIComponent比encodeURI编码的范围更大。
escape 编码的字符串可以直接显示，但需要处理
如：

//a的值定义如下
var a= "%u,,%u1231sdfsdf\123sdfnsdfs!@#$%^&张三丰时代发生地方+——）（*&";

//将a编码后，b的值
var b= escape(a);
//"%25u%2C%2C%25u1231sdfsdfSsdfnsdfs%21@%23%24%25%5E%26%u5F20%u4E09%u4E30%u65F6%u4EE3%u53D1%u751F%u5730%u65B9+%u2014%u2014%uFF09%uFF08*%26"

//转换成Unicode表示法,替换后的可以直接汉字等字符,如"%u65F6"和"\u65F6"直接在控制台打印出来是不一样的
var c = b.replace(/%u/g,'\\u');
//"%25u%2C%2C%25u1231sdfsdfSsdfnsdfs%21@%23%24%25%5E%26\u5F20\u4E09\u4E30\u65F6\u4EE3\u53D1\u751F\u5730\u65B9+\u2014\u2014\uFF09\uFF08*%26"

//解码传输的都是英文常规字符，不回有其他的特殊字符
var d = unescape(c);
//"%u,,%u1231sdfsdfSsdfnsdfs!@#$%^&\u5F20\u4E09\u4E30\u65F6\u4EE3\u53D1\u751F\u5730\u65B9+\u2014\u2014\uFF09\uFF08*&"

//数据又回来了
console.log(d)
//%u,,%u1231sdfsdfSsdfnsdfs!@#$%^&张三丰时代发生地方+——）（*&

我们在cookie的操作，到底用哪个来编码比较合适呢，如果key=value 只是字符串可以用escape, 如果value里面的内容含有链接等建议使用encodeURIComponent

//escape
escape('http://www./zt/youth/index.html')
//结果："http%3A//www./zt/youth/index.html"
//encodeURIComponent
encodeURIComponent('http://www./zt/youth/index.html')
//结果："http%3A%2F%2Fwww.%2Fzt%2Fyouth%2Findex.html

3、前端cookie操作集成

集成cookie的读取,cookie的写入，cookie的删除

var cookie=function(name, key, day, domain){
    var len = arguments.length;
    if(len == 1){
        var value = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
        //如果前后端cookie操作一直，这句话可以不加，这里是做为防止后端是escape编码，前端直接用decodeURIComponent解码报错
        if(value != null && value[2]!='' && /%u[a-z0-9]{4}/g.test(value[2])) value[2] = unescape(value[2]);
        return null != value ? decodeURIComponent(value[2]) : null
    }
    //domain操作
    var mydomain =function(){ 
        var hostname = window.location.hostname,
        array = hostname.split('.'),
        length =  array.length;
        return array[length-3]+"."+ array[length-2] + '.' +array[length-1];
    }
    var domain = domain || mydomain;
    var day = day || 30; 
    if(key == '') day = 0;
    var expdate = new Date();
    expdate.setTime(expdate.getTime()+day*24*60*60*1000);//过期时间，以天为单位'1’表示一天  
    document.cookie = name + "=" + key + ";path=/;domain=" + domain + ";expires=" + expdate.toGMTString(); 
}