zoukankan      html  css  js  c++  java
  • 前台页面中的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=/”

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

  • 相关阅读:
    【C++】对象模型之Function
    linux扩展磁盘
    swift文件操作
    WEEK丢人周
    swift upload
    桌面管理器
    linux 撤销软件卸载
    声明Complex类,成员变量包括实部和虚部,成员方法包括实现由字符串构造复数、复数加法、减法,字符串描述、比较相等等操作
    eclipse踩坑
    QQ语音消息提取 amr文件解密
  • 原文地址:https://www.cnblogs.com/SevenWang/p/13874904.html
Copyright © 2011-2022 走看看