javascript与cookie 的问题详解


Posted in Javascript onNovember 11, 2013

原来用 js 读写 cookie 一直没有注意一个问题:
相同的 key 值,不同的 domain (locahost.dev.xxx.com, dev.xxx.com, xxx.com 等) 是可以同时存在于Cookie 里的 , document.cookie 能把这几个 cookie 都读出来,但是没有 domain 信息. 我也试着找用什么方法能把 cookie 的 domain 信息读取出来,可是很不幸, 没有找到(不知道你有没有什么方法能把 domain 信息给读出来, 如有,请赐教)
出现这个问题的场景:
刚开始的时候,是想让 本地(localhost.dev.xxx.com) 和 dev (dev.xxx.com) 与 uat (xxx.com) 环境的 cookie 互不影响, 我跟据 location.hostname 生成 cookieDomain

1 var cookieDomain = document.domain;   2 3  var tmp = location.hostname.split(.);   4 5  if(tmp.length > 2)6 7 cookieDomain = tmp.slice(1).join(.);
写 cookie 的时候,我把 domain 设为这个 cookieDomain , 这样一来, 不同的坏境的 cookie 就会写到不同的 domain 下面, 看似互不影响.
但是在取的时候, 可以取出来N个相同的 key 的 cookie 值来! 而我只取第一次出现的 cookie, 这样就造成了取出的值很有可能是错的. 就这个问题, 客户单位像狗皮膏药一样贴住我了!跟他们解释了N次,说你们对外只提供一个网址, 浏览者的电脑不会出现取值错误的情况(因为只有一个  domain ). 可是牙的每次BUG汇总里,总会把这个问题列出来! 所有解释等于对牛弹琴.
木折, 那我就把所有用 js 写的 cookie 写到根域名下吧, 省得这帮家伙叫来叫去,大问题不关注,小问题看贼细贼,本末倒置!

(function(){    // 清除旧版本的 cookie
    if(CTSZ.Cookie.get("cookieVersion") != Params.cookieVersion){
        var tmps = Params.orgDomain.split(.);
        var domain;
        var len = tmps.length;
        for(var i=0;i<= len - 3; i++){
            tmps.shift();
            domain = tmps.join(.);
            CTSZ.Cookie.empty("/", domain);
        }
        CTSZ.Cookie.set("cookieVersion", Params.cookieVersion, Params.cookieExpires, "/", Params.cookieDomain);
    }
})();

    $.Cookie = {};
    (function ($) {
        $.getExpires = function (y, m, d, h, i, s, ms) {
            var date = new Date();
            y = isNaN(y) ? date.getFullYear() : y;
            m = isNaN(m) ? date.getMonth() : m - 1;
            d = isNaN(d) ? date.getDate() : d;
            h = isNaN(h) ? date.getHours() : h;
            i = isNaN(i) ? date.getMinutes() : i;
            s = isNaN(s) ? date.getSeconds() : s;
            ms = isNaN(ms) ? date.getMilliseconds() : ms;
            return new Date(y, m, d, h, i, s, ms).toUTCString();
        }
        $.getExpiresByUTCString = function (UTCString) {
            var s = new Date(UTCString).toUTCString();
            if (s == NaN || s == Invalid Date)
                return null; // IE,Opera NaN , FF,Safari Invalid Date;
            else
                return s;
        }
        $.set = function (k, v, expires, path, domain, secure) {
            var cookie = k + = + encodeURIComponent(v);
            if (expires) cookie += ";expires=" + expires;
            if (path) cookie += ";path=" + path;
            if (domain) cookie += ";domain=" + domain;
            if (secure) cookie += ";secure";
            document.cookie = cookie;
        }
        /*
        以前是把所有 cookie 都取出放到一个对象里,在 get 的时候,直接从那个对象里取来,现在想想,那样并不正确。因为假如某个 cookie 的过期时间过了,那个对象并没有更新。
        */
        $.get = function (k) {
            var cks = document.cookie.split(;);
            var t;
            for (var i = 0; i < cks.length; i++) {
                t = cks[i].split(=);
                if (k == t[0].trim()) return t.length >= 2 ? decodeURIComponent(t[1]) : "";
            }
            return null;
        }
        $.remove = function (k, path, domain) {
            $.set(k, , $.getExpires(new Date().getFullYear() - 1), path, domain);
        }
        $.empty = function (path, domain) {
            var cks = document.cookie.split(;);
            var t;
            for (var i = 0; i < cks.length; i++) {
                $.remove(cks[i].split(=)[0].trim(), path, domain);
            }
        }
    })($.Cookie);
Javascript 相关文章推荐
JavaScript获取路径设计源码
May 22 Javascript
浅谈javascript语法和定时函数
May 03 Javascript
详细谈谈javascript的对象
Jul 31 Javascript
jQuery实现的导航下拉菜单效果示例
Sep 05 Javascript
JavaScript 实现的checkbox经典实例分享
Oct 16 Javascript
AngularJS使用带属性值的ng-app指令实现自定义模块自动加载的方法
Jan 04 Javascript
jQuery插件DataTables分页开发心得体会
Aug 22 jQuery
vue服务端渲染的实例代码
Aug 28 Javascript
关于预加载InstantClick的问题解决方法
Sep 12 Javascript
vue中父子组件注意事项,传值及slot应用技巧
May 09 Javascript
Promise扫盲贴
Jun 24 Javascript
微信小程序 根据不同用户切换不同TabBar
Apr 21 Javascript
JavaScript设置首页和收藏页面的小例子
Nov 11 #Javascript
JS将表单导出成EXCEL的实例代码
Nov 11 #Javascript
AJAX跨域请求json数据的实现方法
Nov 11 #Javascript
Javascript弹出窗口的各种方法总结
Nov 11 #Javascript
探讨js中的双感叹号判断
Nov 11 #Javascript
js时间戳格式化成日期格式的多种方法
Nov 11 #Javascript
JavaScript中判断对象类型的几种方法总结
Nov 11 #Javascript
You might like
隐藏X-Space个人空间下方版权方法隐藏X-Space个人空间标题隐藏X-Space个人空间管理版权方法
2007/02/22 PHP
thinkphp视图模型查询提示ERR: 1146:Table 'db.pr_order_view' doesn't exist的解决方法
2014/10/30 PHP
php实现的ping端口函数实例
2014/11/12 PHP
php5与php7的区别点总结
2019/10/11 PHP
php 使用html5 XHR2实现上传文件与进度显示功能示例
2020/03/03 PHP
JavaScript setTimeout和setInterval的使用方法 说明
2010/03/25 Javascript
Javascript之旅 对象的原型链之由来
2010/08/25 Javascript
Extjs中通过Tree加载右侧TabPanel具体实现
2013/05/05 Javascript
jquery中attr和prop的区别分析
2015/03/16 Javascript
javascript实现别踩白块儿小游戏程序
2015/11/22 Javascript
JavaScript SHA1加密算法实现详细代码
2016/10/06 Javascript
easyui导出excel无法弹出下载框的快速解决方法
2016/11/10 Javascript
JavaScript实现的CRC32函数示例
2016/11/23 Javascript
Bootstrap输入框组件使用详解
2017/06/09 Javascript
JavaScript中最常用的10种代码简写技巧总结
2017/06/28 Javascript
iview给radio按钮组件加点击事件的实例
2017/09/30 Javascript
深入理解Angularjs 脏值检测
2018/10/12 Javascript
微信小程序设置滚动条过程详解
2019/07/25 Javascript
JavaScript 双向链表操作实例分析【创建、增加、查找、删除等】
2020/04/28 Javascript
[00:35]2016完美“圣”典风云人物:冷冷宣传片
2016/12/08 DOTA
Python3读取文件常用方法实例分析
2015/05/22 Python
使用Python求解最大公约数的实现方法
2015/08/20 Python
python检测主机的连通性并记录到文件的实例
2018/06/21 Python
python 统计数组中元素出现次数并进行排序的实例
2018/07/02 Python
python 重命名轴索引的方法
2018/11/10 Python
Python实现TCP通信的示例代码
2019/09/09 Python
Python实现哲学家就餐问题实例代码
2020/11/09 Python
深入浅出CSS3 background-clip,background-origin和border-image教程
2011/01/27 HTML / CSS
HTML5 video 视频标签使用介绍
2014/02/03 HTML / CSS
中国海淘族值得信赖的海淘返利网站:55海淘
2017/01/16 全球购物
会计专业应届生求职信
2013/11/24 职场文书
自荐信写法介绍
2014/01/25 职场文书
初一学生评语大全
2014/04/24 职场文书
幼儿园六一亲子活动方案
2014/08/26 职场文书
关于车尾的标语大全
2015/08/11 职场文书
一文搞懂Java中的注解和反射
2022/06/21 Java/Android