转 通过js获取cookie的实例及简单分析

今天review新人写的javascript代码的时候发现了很多的问题。这里以function getCookie(name){}为例。

其中比较典型的一个问题就是如何通过javascript获取cookie里面的一个值。 那么我们先来看看cookie到底长什么样子呢?
直接在浏览器地址栏输入: javascript:alert(document.cookie); 回车。(这行代码的意思是,让浏览器执行javascript语句: alert(document.cookie);)
结果是:uin=webryan; sessionid=10293123834; pgv_send=1; cur_page=index 这个样子。
注意:1.开始没有空格,2.分号后又空格 3.最后没有分号。那么我们获取cookie的方法就比较明确了。。

一种是用document.cookie.split(“; “)的方式把字符串分割成几个段,然后遍历整个数组。 把每个数组单元等号左边的和name对比是否相等,相等则取等号右边的值。

  1. function getCookie(name){
  2. var arr = document.cookie.split("; ");
  3. for(var i=0,len=arr.length;i<len;i++){
  4. var item = arr[i].split("=");
  5. if(item[0]==name){
  6. return item[1];
  7. }
  8. }
  9. return "";
  10. }
  1. function getCookie(name){
  2. var arr = document.cookie.split("; ");
  3. for(var i=0,len=arr.length;i<len;i++){
  4. var item = arr[i].split("=");
  5. if(item[0]==name){
  6. return item[1];
  7. }
  8. }
  9. return "";
  10. }

第二种就是直接在字符串中搜索关键字。由于分号有空格,加上防止出现搜索cookie name为“str”的value是,有一个test_str的cookie名称。这里我们先进行一次过滤。 然后在找到 ;str的位置,这样就不会出问题。具体情况如下

  1. function getCookie(name){
  2. var value="";
  3. var cookie = ";"+document.cookie.replace(/;\s+/g,";")+";"
  4. var pos = cookie.indexOf(";"+name+"=");
  5. if(pos>-1){
  6. var start = cookie.indexOf("=",pos);
  7. var end = cookie.indexOf(";",start);
  8. value = unescape(cookie.substring(start+1,end));
  9. }
  10. return value;
  11. }
  1. function getCookie(name){
  2. var value="";
  3. var cookie = ";"+document.cookie.replace(/;\s+/g,";")+";"
  4. var pos = cookie.indexOf(";"+name+"=");
  5. if(pos>-1){
  6. var start = cookie.indexOf("=",pos);
  7. var end = cookie.indexOf(";",start);
  8. value = unescape(cookie.substring(start+1,end));
  9. }
  10. return value;
  11. }

不同方法在不同时刻有不同的选择。 这个就是晓晓说的选型问题。

现在实际使用的代码是

  1. /**
  2. * cookie相关
  3. */
  4. $.cookie = {
  5. /**
  6. * 读取cookie
  7. *
  8. * @param {String} n=名称
  9. * @return {String} cookie值
  10. * @example
  11. * $.cookie.get('id_test');
  12. */
  13. get:function(n){
  14. var m = document.cookie.match(new RegExp( "(^| )"+n+"=([^;]*)(;|$)"));
  15. return !m ? "":unescape(m[2]);
  16. },
  17. /**
  18. * 设置cookie
  19. * @param {String} name cookie名称 --必填
  20. * @param {String} value cookie值 --必填
  21. * @param {String} domain 所在域名
  22. * @param {String} path 所在路径
  23. * @param {Number} hour 存活时间,单位:小时
  24. * @example
  25. * $.cookie.set('value1','cookieval',"id.qq.com","/test",24); //设置cookie
  26. */
  27. set:function(name,value,domain,path,hour){
  28. var expire = new Date();
  29. expire.setTime(expire.getTime() + (hour?3600000 * hour:30*24*60*60*1000));
  30. document.cookie = name + "=" + value + "; " + "expires=" + expire.toGMTString()+"; path="+ (path ? path :"/")+ "; " + (domain ? ("domain=" + domain + ";") : "");
  31. },
  32. /**
  33. * 删除指定cookie,复写为过期 !!注意path要严格匹配, /id 不同于/id/
  34. *
  35. * @param {String} name cookie名称
  36. * @param {String} domain 所在域
  37. * @param {String} path 所在路径
  38. * @example
  39. * $.cookie.del('id_test'); //删除cookie
  40. */
  41. del : function(name, domain, path) {
  42. document.cookie = name + "=; expires=Mon, 26 Jul 1997 05:00:00 GMT; path="+ (path ? path :"/")+ "; " + (domain ? ("domain=" + domain + ";") : "");
  43. },
  44. /**
  45. * 删除所有cookie -- 这里暂时不包括目录下的cookie
  46. * @example
  47. * $.cookie.clear(); //删除所有cookie
  48. */
  49. clear:function(){
  50. var rs = document.cookie.match(new RegExp("([^ ;][^;]*)(?=(=[^;]*)(;|$))", "gi"));
  51. // 删除所有cookie
  52. for (var i in rs){
  53. document.cookie = rs[i] + "=;expires=Mon, 26 Jul 1997 05:00:00 GMT; path=/; " ;
  54. }
  55. },
  56. /**
  57. * uin -- 针对业务,对外开源请删除
  58. *
  59. * @return {String} uin值
  60. * @example
  61. * $.cookie.uin();
  62. */
  63. uin:function(){
  64. var u = $.cookie.get("uin");
  65. return !u?null:parseInt(u.substring(1, u.length),10);
  66. }
  67. };
上一篇:Bzoj3930: [CQOI 2015] 选数 & COGS2699: [CQOI 2015] 选数加强版


下一篇:基于.NET CORE微服务框架 -surging 基于messagepack、protobuffer、json.net 性能对比