本地存储cookie的封装，提供简单的API

wwq0327 发布于2019-08-21 12:36 / 2133人阅读

摘要：本地存储的封装，提供简单的，没有对做兼容处理，因为俺主要用于，，移动端等先进浏览器里面跑。安装下载地址设置的值，生存时间半个小时获取的值，显示删除清空获取所有批量设置的值过期时间路径域以及安全。如果想让本地也加密，得自己加密数据。

本地存储cookie的封装，提供简单的AIP，没有对IE做兼容处理，因为俺主要用于chrome，Safari，Firefox、移动端等先进浏览器里面跑。如果您有需求，可以自行解决，共享出来。目前俺用不上，所以不想兼容IE。。。

安装 bower

$ bower install icookie
$ bower info icookie # Run bower info icookie to list the available versions.

npm

$ npm install cookiejs

Github下载地址

cookie APIs

cookie("test","tank",1800)  //设置 cookie 的值，生存时间半个小时
cookie("test")              //获取 cookie 的值，显示tank
cookie("test",null)         //删除cookie test
cookie()                    //清空cookie

cookie.set("test","tank",1800)  //====cookie("test","tank",1800)
cookie.get("test")              //====cookie("test")
cookie.remove("test")           //====cookie("test",null)
cookie.clear()                  //====cookie()

cookie.all()                    //获取所有 cookie

批量设置cookie的值

cookie.set({
   name1: "value1",
   name2: "value2"
});

expires过期时间、 path路径、 domain域、以及 secure安全。

cookie("test","123",{
    "expires": 7,
    "path": "/",
    "domain":""
});
cookie({"test":"123"},{
    "expires": 7,
    "path": "/",
    "domain":""
});

key	value	default value
expires	过期时间(天)。指定cookie的生命期。具体是值是过期日期。如果想让cookie的存在期限超过当前浏览器会话时间，就必须使用这个属性。当过了到期日期时，浏览器就可以删除cookie文件，没有任何影响。	浏览器关闭过期
domain	域。指定关联的WEB服务器或域。值是域名，比如pc175.com。这是对path路径属性的一个延伸。如果我们想让 catalog.pc175.com 能够访问shoppingcart.pc175.com设置的cookies，该怎么办? 我们可以把domain属性设置成“pc175.com”，并把path属性设置成“/”。tag：不能把cookies域属性设置成与设置它的服务器的所在域不同的值。	默认本域
path	路径。指定与cookie关联的WEB页。值可以是一个目录，或者是一个路径。如果http://www.pc175.com/devhead/index.html 建立了一个cookie，那么在http://www.pc175.com/devhead/目录里的所有页面，以及该目录下面任何子目录里的页面都可以访问这个cookie。这就是说，在http://www.pc175.com/devhead/stories/articles 里的任何页面都可以访问http://www.pc175.com/devhead/index.html建立的cookie。但是，如果http://www.pc175.com/zdnn/ 需要访问http://www.pc175.com/devhead/index.html设置的cookes，该怎么办？这时，我们要把cookies 的path属性设置成“/”。在指定路径的时候，凡是来自同一服务器，URL里有相同路径的所有WEB页面都可以共享cookies。现在看另一个例子：如果想让 http://www.pc175.com/devhead/filters/ 和http://www.pc175.com/devhead/stories/共享cookies，就要把path设成“/devhead”。	默认 /
secure	安全。指定cookie的值通过网络如何在用户和WEB服务器之间传递。这个属性的值或者是“secure”，或者为空。缺省情况下，该属性为空，也就是使用不安全的HTTP连接传递数据。如果一个 cookie 标记为secure，那么，它与WEB服务器之间就通过HTTPS或者其它安全协议传递数据。不过，设置了secure属性不代表其他人不能看到你机器本地保存的cookie。换句话说，把cookie设置为secure，只保证cookie与WEB服务器之间的数据传输过程加密，而保存在本地的cookie文件并不加密。如果想让本地cookie也加密，得自己加密数据。	false

set

设置 cookie 的值，设置时间

cookie.set(name,value,options)
效果相同cookie(name,value,options)

cookie("test","tank",30)    //设置cookie，并设置过期时间30天

cookie("test","123",{       //设置cookie，并设置过期时间7天，路径、域
    "expires": 7,
    "path": "/",
    "domain":""
});

cookie({"test":"123","test2":"456"},{  //批量设置
    "expires": 7,
    "path": "/",
    "domain":""
});

get

获取 cookie 的值

cookie.get(name)
效果相同cookie(name)

store.get("wcj1") //获取wcj1的字符串数据
store("wcj1") //功能同上

clear

清空cookie

cookie.clear()
效果相同cookie()

cookie()
cookie.clear(

remove

删除cookie

cookie.remove(name)
效果相同cookie(name,null)

cookie.remove("test") //删除cookie test
cookie("test",null) //这样也是 删除cookie test

云服务器 GPU云服务器提供api接口的网站有哪些云存储提供的服务 js的本地存储适合存储在ECS本地SSD盘的数据类型

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/87675.html

一文带你看懂cookie，面试前端不用愁

摘要：的属性在浏览器的控制台中，可以直接输入来查看。可以在浏览器的控制台中看出哪些是类型的，下带绿色对勾的即是，如图只要是类型的在控制台通过是获取不到的，也不能进行修改。当会话过期或被放弃后，服务器将终止该会话。在中，用取代了。本文由云+社区发表在前端面试中，有一个必问的问题：请你谈谈cookie和localStorage有什么区别啊？ localStorage是H5中的一种浏览器本地存...

notebin 2019-08-23 13:59 评论0 收藏0
Web存储之LocalStorage初探

摘要：存储之初探的发布和定稿为前端界带来巨大的变化，新增的和特性给业务带来了更多可能性，让用户体验拥有了更可能的丰富。只读返回一个整数，表示存储在对象中的数据项数量。会在过期时间之后销毁。安全性方面，中一般不建议存储敏感信息。 Web存储之LocalStorage初探 HTML5的发布和定稿为前端界带来巨大的变化，新增的API和特性给业务带来了更多可能性，让用户体验拥有了更可能的丰富。 · ...

wpw 2019-08-21 10:51 评论0 收藏0
详解Cookie，localStorage与seesionStorage

摘要：缺点数量和长度受限制，数量部分不同的浏览器不一样，长度是不能超过，否则会被截掉。更容易受到安全攻击。不会在每个请求中被携带。遵循同源政策，保存数据会相对来说安全些。的优缺点基本上和是相同的，同属于，返回的也都是一个对象。前言这些api的发展历程？这些api各自的优缺点是什么？这些api的使用场景？怎么用就不说了，因为直接看文档就可以了参考了很多篇文章，现在把所看的内容总...

Rango 2019-08-26 11:53 评论0 收藏0