前台页面中的Cookie存取删除,以及Cookie的跨域问题

这周还是很忙,忙到只有今晚才有时间来写点什么东西!(其实下午在偷懒睡觉)

义正言辞的说,上回琢磨了后台的cookie,那这次说下前台的cookie吧。、

在前端的基础应用中,常常会有交互传值的部分。那么在Js中的Cookie怎么用呢,直接上代码比较好

  function getCookie(key) {
        //由于cookie是通过一个分号+空格的形式串联起来的,所以这里需要先按分号空格截断,变成 [name=Jack,pwd=123456,age=22]数组类型;
        var arr1 = document.cookie.split("; ");
        for (var i = 0; i < arr1.length; i++) {
        //通过=截断,把name=Jack截断成[name,Jack]数组;           
             var arr2 = arr1[i].split("=");
            if (arr2[0] == key) {
                return decodeURI(arr2[1]);
            }
        }
    }        

这个是 获取Cookie的方法 , 先把它存下来,等下要用。(我才不会说这是我抄过来的方法)

    var delCookie = function (name) {
        var exp = new Date();
        exp.setTime(exp.getTime() - 1);
        //获取cookie是否存在
        var value = getCookie(name);
        if (value != null) {
            document.cookie = name + "=" + value + ";expires=" + exp.toUTCString();
        }
    }

这个是 删除Cookie的方法

好了,两大方法已经写作完毕。  那么增删改查中的“增”怎么写呢?

document.cookie='name=SevenWang'

直接用document中的cookie后面拼字符串就可以。这简直就是弱爆了,不过呢 还是得用。

那么问题来了,过期时间和路径等之类的怎么设置?

document.cookie='name=SevenWang;expires={time};path=/'

你也看到了,直接;来进行相隔就可以,记得关键在于不要拼错字符串了呦、

那么这么写是不是感觉有点点麻烦?

其实可以直接把上面的语句写一个方法每次调用就行。但是,本着工匠精神,方法我就不给你写了,自己封装去吧,啊哈哈哈哈

(会不会某一天把自己坑到,小声哔哔)

关于跨域,这里提一嘴,重点留给你自己去思索(其实也没什么好思索的);

在一次写Cookie里发现了这个问题,明明在application中有我存好的Cookie,但是为什么怎么也获取不到Value

是方法写错了吗?仔细检查没问题。

百思不得其解,于是祭出了终级大杀器.....

查了半天没看明白,但是自己最后反映过来了

由于我要获取cookie value的页面和增加放cookie的页面不是同一个  文件目录/Views  下

而我也偷懒没有设置cookie的path,所以导致另一个页面获取不到cookie,

于是我这样子写了一下其余的留下来思索

document.cookie = “.......;path=/”

好了,今天就说这么多,下次写的时候再说吧。

原文地址:https://www.cnblogs.com/SevenWang/p/13874904.html