原创

JQuery使用Cookie进行本地存取

温馨提示:
本文最后更新于 2023年03月04日,已超过 207 天没有更新。若文章内的图片失效(无法正常加载),请留言反馈或直接联系我

Cookie 存储在本地,容量最大4k,在同源的http请求时携带传递,损耗带宽,可设置访问路径,只有此路径及此路径的子路径才能访问此cookie,在设置的过期时间之前有效。

本文使用JQuery技术使用cookie,这里则需要一个插件js才可以使用,文字用到js.cookie.min.js

引入cdn js.cookie.min.js

<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>

创建一个cookie,在整个网站有效:

Cookies.set('name', 'value')

创建一个从现在起7天过期的cookie,在整个网站有效:

Cookies.set('name', 'value', { expires: 7 });

.创建一个过期的cookie,有效于当前页面的路径:

Cookies.set('name', 'value', { expires: 7, path: '' });

读取cookie:

Cookies.get('name'); // => 'value'
Cookies.get('nothing'); // => undefined

读取所有可见的cookie:

Cookies.get(); // => { name: 'value' }

注意:不可能通过传递cookie属性来读取特定的cookie(可能会,也可能不会)在编写cookie时使用过):

Cookies.get('foo', { domain: 'sub.example.com' }); // `domain` won't have any effect...!

名称为foo的cookie只能在。Get()如果从调用代码的地方可见;域和/或路径属性在读取时不会产生影响。

删除cookie:

Cookies.remove('name');

删除对当前页面路径有效的cookie:

Cookies.set('name', 'value', { path: '' });
Cookies.remove('name'); // fail!
Cookies.remove('name', { path: '' }); // removed!

重要!当删除cookie时,如果你不依赖默认属性,你必须传递与设置cookie时完全相同的路径和域属性:

Cookies.remove('name', { path: '', domain: '.yourdomain.com' });

注意:删除一个不存在的cookie不会引发任何异常,也不会返回任何值。

如果存在与名称空间cookie发生冲突的危险,noConflict方法将允许您定义一个新的名称空间并保留原来的名称空间。这在第三方站点上运行脚本时尤其有用例如,作为小部件或SDK的一部分。

// Assign the js-cookie api to a different variable and restore the original "window.Cookies"
var Cookies2 = Cookies.noConflict();
Cookies2.set('name', 'value');

注:。当使用AMD或CommonJS时,noConflict方法是不必要的,因此它不会在这些环境中暴露。

js-cookie为cookie提供不引人注目的JSON存储。在创建cookie时,您可以在值中传递数组或对象文字而不是字符串。如果你这样做,jscookie将根据JSON存储对象的字符串表示形式。stringify

Cookies.set('name', { foo: 'bar' });

当使用默认cookie读取cookie时。获取api,你会收到存储在cookie中的字符串表示:

Cookies.get('name'); // => '{"foo":"bar"}'Cookies.get(); // => { name: '{"foo":"bar"}' }<br/>

读cookie的时候。getJSON api,您将收到根据JSON存储在cookie中的字符串的解析表示。解析:

Cookies.getJSON('name'); // => { foo: 'bar' }Cookies.getJSON(); // => { name: { foo: 'bar' } }
正文到此结束
该篇文章的评论功能已被站长关闭
本文目录