Cookie—客户端存储数据技术

     在项目中，有一个功能是这样的，前端页面设计中，我们有一个后退操作，保证回退之后依然存在之前设定的信息，其实实现这个的功能的方式有很多，例如我们可以采用回退过程携带参数，也可以页面加载显示隐藏的信息，这些在以往的系统实现过程中都已经应用过了，今天采用一种新的方式，Cooike方式，我们将信息保存到Cookie中，不管是回退还是随便跳转到任何一个之前的页面都可以从Cookie中获取相应的值，然后进行显示到页面上。Cookie存储数据采用“名-值”对儿的方式进行，将数据存入Cookie采用setCookie（name,value）形式，如下，例如将姓名放入到Cookie中：setCookie("userName",userName);将数据从Cookie中取出采用getCookie(name,value)形式，如下，将考试名称从Cookie中取出：userName
= getCookie("userName");
    下面我们写一个js文件来保存Cookie和获取Cookie以及删除Cookie：CookieHead.js

/**
* 设置Cookie函数
* name:Cookie的名称
* value:Cookie的值
* expires:设置失效时间
*/
function setCookie(name,value){
var Days=30*12;
var expires=new Date();
expires.setTime(expires.getTime()+Days*24*60*6*1000);
document.cookie=name+"="+escape(value)+";expires="+expires.toGMTString();
}
/**
* 获取Cookie函数
* name:Cookie的名称
*/
function getCookie(name){
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
if(arr != null){
return unescape(arr[2]);
}else{
return null;
}
}
/**
* 删除Cookie
* @param name
* 当前时间为失效时间
*/
function delCookie(name){
var exp = new Date(); //当前时间
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null) document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}

    以上就是对于Cookie保存客户端数据进行的一个简单应用，现在我们从根本上来接触Cookie，Cookie和Session不同，属于客户端进行保存特定数据的一种技术，如果我们将信息保存到浏览器中的Cookie中，当我们再次进入的时候浏览器会自动识别我们的信息，比如服务器在客户端保存用户的登录信息，比如登录名和密码，这些信息的数据量并不会很大，服务器端需要的时候可以从已经保存到的客户端进行读取，然后将信息传回到客户端。下面是一个Cookie传送的示意图：



    使用Cookie是存在生命周期的，Cookie一般只存在于页面端，所有，一旦我们的浏览器页面关闭，Cookie也就随机消失了，当然了，如果不关闭浏览器页面，如果超过设置的Cookie的存活时间，Cookie也会自动消失。

    使用Cookie的好处一点是Cookie存在生命周期，我们自动设置生命周期的长短来决定会话保存的时间。另外Cookie是一种客户端技术，不需要服务器端的资源，由客户端直接发送给服务器直接读取，增加了数据传送的效率。当然，任何一种技术的出现都会存在一定的危险，Cookie也不例外，首先一些浏览器对Cookie的字节大小进行了限制，还有就是篡改Cookie对我们的计算机和程序都存在安全性的威胁，所以使用Cookie一定要权衡利弊。