javascript封装 Cookie 应用接口


Posted in Javascript onAugust 07, 2015

本文章记录本人在学习 Cookie 中看书理解到的一些东西,加深记忆和并且整理记录下来,方便之后的复习。

封装函数

在默认的情况下存取Cookie是一件比较麻烦的事情。由于Cookie是通过字符串来存储信息的,所以容易导致在执行赋值运算的时需要转换读取信息的数据类型。而且Cookie信息的字符串本身就令人讨厌,在经常使用Cookie信息的 Web 应用中格外的不方便。所以需要自行的封装一个Cookie函数来提供开发效率!

定义一个函数Cookie(),这个函数能够写入指定的Cookie信息,删除指定的Cookie信息,也能够读取指定名称的Cookie值,另外,在该函数中还可以制定Cookie信息的有效期、有效路径、作用域和安全性选项设置。完整的代码:

var Cookie = function(name, value, options) {
    // 如果第二个参数存在
    if (typeof value != 'undefined') {
      options = options || {};
      if (value === null) {
        // 设置失效时间
        options.expires = -1;
      }
      var expires = '';
      // 如果存在事件参数项,并且类型为 number,或者具体的时间,那么分别设置事件
      if (options.expires && (typeof options.expires == 'number' || options.expires.toUTCString)) {
        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.toUTCString();
      }
      var path = options.path ? '; path=' + options.path : '', // 设置路径
        domain = options.domain ? '; domain=' + options.domain : '', // 设置域 
        secure = options.secure ? '; secure' : ''; // 设置安全措施,为 true 则直接设置,否则为空

      // 把所有字符串信息都存入数组,然后调用 join() 方法转换为字符串,并写入 Cookie 信息
      document.cookie = [name, '=', encodeURIComponent(value), expires, path, domain, secure].join(''); 
    } else { // 如果第二个参数不存在
      var CookieValue = null;
      if (document.cookie && document.cookie != '') {
        var Cookie = document.cookie.split(';');
        for (var i = 0; i < Cookies.length; i++) {
          var Cookie = (Cookie[i] || "").replace( /^\s+|\s+$/g, "");
          if (Cookie.substring(0, name.length + 1) == (name + '=')) {
            CookieValue = decodeURIComponent(Cookie.substring(name.length + 1));
            break;
          }
        }
      }
      return CookieValue;
    }
  };

如何使用

写入Cookie信息:

// 简单写入一条 Cookie 信息
cookie("user", "baidu");
// 写入一条 Cookie 信息,并且设置更多选项
cookie("user", "baidu", {
  expires: 10, // 有效期为 10 天
  path: "/", // 整个站点有效
  domain: "www.baidu.com", // 有效域名
  secure: true // 加密数据传输
});

2.读取Cookie信息:

cookie("user");

3.删除Cookie信息:

cookie("user", null);

再给大家分享一个封装好的代码

//向cookie写入数据
function writeCookie(name, value, days) {
 // 定义有效日期(cookie的有效时间)
 var expires = "";

 // 为有效日期赋值
 if (days) {
  var date = new Date();
	//设置有效期(当前时间+时间段)
  date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));//时间段为毫秒数 
  expires = "; expires=" + date.toGMTString();
 }

 // 给cookie赋值 name, value和expiration date(有效期)
 document.cookie = name + "=" + value + expires + "; path=/";
}
//读取cookie数据
function readCookie(name) {
 var searchName = name + "=";
 var cookies = document.cookie.split(';');
 for(var i=0; i < cookies.length; i++) {
  var c = cookies[i];
  while (c.charAt(0) == ' ')
   c = c.substring(1, c.length);
  if (c.indexOf(searchName) == 0)
   return c.substring(searchName.length, c.length);
 }
 return null;
}
//清楚所有的cookie
function eraseCookie(name) {
 // 将时间设置成-1将清除存储在cookie中的数据
 writeCookie(name, "", -1);
}

最后,如果文章有什么错误和疑问的地方,请指出。与sf各位共勉!

Javascript 相关文章推荐
jQuery学习笔记之jQuery动画效果
Sep 09 Javascript
jquery使用append(content)方法注意事项分享
Jan 06 Javascript
node.js中的querystring.unescape方法使用说明
Dec 10 Javascript
小巧强大的jquery layer弹窗弹层插件
Dec 06 Javascript
微信js-sdk上传与下载图片接口用法示例
Oct 12 Javascript
jquery插件bootstrapValidator表单验证详解
Dec 15 Javascript
JS实现旋转木马式图片轮播效果
Jan 18 Javascript
vue单页面打包文件大?首次加载慢?nginx带你飞,从7.5M到1.3M蜕变过程(推荐)
Jan 16 Javascript
解决vue打包后vendor.js文件过大问题
Jul 03 Javascript
node获取客户端ip功能简单示例
Aug 24 Javascript
Vue项目中Api的组织和返回数据处理的操作
Nov 04 Javascript
微信小程序中的列表切换功能实例代码详解
Jun 09 Javascript
jQuery实现鼠标经过弹出提示信息的地图热点效果
Aug 07 #Javascript
jQuery与getJson结合的用法实例
Aug 07 #Javascript
《JavaScript函数式编程》读后感
Aug 07 #Javascript
jQuery过滤HTML标签并高亮显示关键字的方法
Aug 07 #Javascript
jquery实现先淡出再折叠收起的动画效果
Aug 07 #Javascript
C++中的string类的用法小结
Aug 07 #Javascript
Grunt入门教程(自动任务运行器)
Aug 06 #Javascript
You might like
Protoss兵种介绍
2020/03/14 星际争霸
Apache服务器无法使用的解决方法
2013/05/08 PHP
php的POSIX 函数以及进程测试的深入分析
2013/06/03 PHP
深入理解PHP之源码目录结构与功能说明
2016/06/01 PHP
ThinkPHP实现的rsa非对称加密类示例
2018/05/29 PHP
php app支付宝回调(异步通知)详解
2018/07/25 PHP
PHP使用XMLWriter读写xml文件操作详解
2018/07/31 PHP
JObj预览一个JS的框架
2008/03/13 Javascript
判断输入是否为空,获得输入类型的JS代码
2013/10/30 Javascript
JQuery 控制内容长度超出规定长度显示省略号
2014/05/23 Javascript
更快的异步执行(setTimeout多浏览器)
2014/08/12 Javascript
jquery获取radio值(单选组radio)
2014/10/16 Javascript
jQuery不使用插件及swf实现无刷新文件上传
2014/12/08 Javascript
javascript中几个容易混淆的概念总结
2015/04/14 Javascript
jQuery ajax方法传递中文时出现中文乱码的解决方法
2016/07/25 Javascript
Vue.js组件使用开发实例教程
2016/11/01 Javascript
教你快速搭建Node.Js服务器的方法教程
2017/03/30 Javascript
bootstrap手风琴折叠示例代码分享
2017/05/22 Javascript
微信小程序顶部可滚动导航效果
2017/10/31 Javascript
vue项目打包后上传至GitHub并实现github-pages的预览
2019/05/06 Javascript
vue实现滑动切换效果(仅在手机模式下可用)
2020/06/29 Javascript
微信小程序实现选择地址省市区三级联动
2020/06/21 Javascript
python爬虫实战之爬取京东商城实例教程
2017/04/24 Python
Mac 上切换Python多版本
2017/06/17 Python
Python3使用SMTP发送带附件邮件
2020/06/16 Python
Python实现的简单线性回归算法实例分析
2018/12/26 Python
python三方库之requests的快速上手
2019/03/04 Python
Python从函数参数类型引出元组实例分析
2019/05/28 Python
Python退出时强制运行一段代码的实现方法
2020/04/29 Python
解决django migrate报错ORA-02000: missing ALWAYS keyword
2020/07/02 Python
用python实现学生管理系统
2020/07/24 Python
使用OpenCV校准鱼眼镜头的方法
2020/11/26 Python
阿巴庭院:Abba Patio
2019/06/18 全球购物
初中生自我评价
2014/02/01 职场文书
企业与个人合作经营协议书
2014/11/01 职场文书
python如何利用traceback获取详细的异常信息
2021/06/05 Python