JavaScript cookie详解及简单实例应用

发布时间 - 2026-01-10 22:14:32    点击率:

JavaScript cookie详解

一、cookie基本介绍

    cookie是document的对象。cookie可以使得JavaScript代码能够在用户的硬盘上持久地存储数据,并且能够获得以这种方式存储的数据。cookie还可以用于客户端脚本化。

cookie数据可以自动地在Web浏览器好Web服务器之间传递。

    在浏览器中可以通过navigator.cookieEnabled属性检查浏览器的cookie功能是否被激活。

    二、cookie的基本属性    

    每个cookie都有四个可选的属性

    1.expires

        指定了cookie的生存期。将expires属性设定为未来的一个过期时间,即可让cookie在过期后失效。

    现在用max-age属性来代替它,max-age用秒来设置cookie的生命期。一旦超过了max-age的生命期,那个cookie就会被浏览器自动地从cookie文件中删除掉

    2.path

        指定了与cookie关联在一起的网页。默认情况下,cookie会和创建它的网页以及与这个网页处于同一个目录下的网页和处于该目录的子目录下的网页关联。

    这个主要设置了cookie对于网页的可见性。加入将path设置为www.a.com/list,那么www.a.com/list/a.html和www.a.com/list/b.html都可以访问cookie,但www.a.com/comtain不  能访问该cookie。但是如果将path设置为www.a.com/,那么www.a.com/list和www.a.com/contain都可以访问cookie。

    3.domain

        默认只有来自同一Web服务器的页面才能访问cookie,可以设置domain。例如把cookie的path设定为/,cookie设定为.example.com,则所有位于catalog.example.com和    orders.example.com的网页以及位于.example.com域名下其他服务器的网页都能访问这个cookie

    注意:不能讲一个cookie的域设置为服务器所在的域之外的域

    4.source

       source为一个布尔值,true由不安全的HTTP传输(默认);false只在浏览器和服务器通过HTTPS或其他的安全协议连接下才被传输。 

    三、cookie的应用

        一个cookie是一个字符串,有name=value这种结构组合而成。cookie的例子:

    version=1.0;max-age=3600      

    注意每段字符串之间不能包含逗号或者空格等,因此在写入cookie时需要使用encodeURIComponent去掉变量中的相关符号,读取时利用的decodeURIComponent 

    要创建一个能够持续存在一年的cookie:

document.cookie = “version=” + document.lastModified + “;max-age=” + (60*60*24*365); 

    四、总结

    虽然现在浏览器的存储技术越来越多,HTML5也为localStorage带来了更高的性能体验,但是cookie仍然可以为我们处理很多事务,方便小型数据的交流。合理的使用cookie,可以让我们的应用程序更加灵活。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!


# JavaScript  # cookie  # Js  # cookie详细介绍  # cookie详解及实例  # AngularJS入门教程之Cookies读写操作示例  # js中利用cookie实现记住密码功能  # JS中对Cookie的操作详解  # JS如何设置cookie有效期为当天24点并弹出欢迎登陆界面  # JavaScript数据存储 Cookie篇  # JS使用cookie设置样式的方法  # node.js cookie-parser 中间件介绍  # js基于cookie方式记住返回页面用法示例  # sso跨域写cookie的一段js脚本(推荐)  # javascript操作cookie  # 设置为  # 是一个  # 就会  # 都有  # 目录下  # 还可以  # 让我们  # 都能  # 可以通过  # 而成  # 希望能  # 带来了  # 更高  # 可选  # 只在  # 也为  # 谢谢大家  # 创建一个  # 不安全  # 要使 


相关栏目: 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571


相关推荐: Python自动化办公教程_ExcelWordPDF批量处理案例  Win11怎么设置虚拟桌面 Win11新建多桌面切换操作【技巧】  HTML透明颜色代码怎么让下拉菜单透明_下拉菜单透明背景指南【技巧】  Laravel API资源类怎么用_Laravel API Resource数据转换  如何在搬瓦工VPS快速搭建网站?  太平洋网站制作公司,网络用语太平洋是什么意思?  如何在IIS7中新建站点?详细步骤解析  Laravel Fortify是什么,和Jetstream有什么关系  如何制作公司的网站链接,公司想做一个网站,一般需要花多少钱?  Laravel如何实现数据库事务?(DB Facade示例)  在线制作视频网站免费,都有哪些好的动漫网站?  如何快速搭建安全的FTP站点?  jQuery validate插件功能与用法详解  PHP 500报错的快速解决方法  Laravel如何实现本地化和多语言支持?(i18n教程)  Laravel如何处理跨站请求伪造(CSRF)保护_Laravel表单安全机制与令牌校验  JavaScript如何实现继承_有哪些常用方法  Laravel观察者模式如何使用_Laravel Model Observer配置  Laravel如何为API编写文档_Laravel API文档生成与维护方法  利用 Google AI 进行 YouTube 视频 SEO 描述优化  高性能网站服务器配置指南:安全稳定与高效建站核心方案  Laravel怎么进行浏览器测试_Laravel Dusk自动化浏览器测试入门  Google浏览器为什么这么卡 Google浏览器提速优化设置步骤【方法】  laravel怎么使用数据库工厂(Factory)生成带有关联模型的数据_laravel Factory生成关联数据方法  香港服务器WordPress建站指南:SEO优化与高效部署策略  Laravel如何使用Spatie Media Library_Laravel图片上传管理与缩略图生成【步骤】  怎么用AI帮你设计一套个性化的手机App图标?  Angular 表单中正确绑定输入值以确保提交与验证正常工作  佛山网站制作系统,佛山企业变更地址网上办理步骤?  制作网站软件推荐手机版,如何制作属于自己的手机网站app应用?  如何在Windows 2008云服务器安全搭建网站?  Laravel如何实现多表关联模型定义_Laravel多对多关系及中间表数据存取【方法】  如何用狗爹虚拟主机快速搭建网站?  高端建站如何打造兼具美学与转化的品牌官网?  Laravel如何使用查询构建器?(Query Builder高级用法)  千库网官网入口推荐 千库网设计创意平台入口  Python3.6正式版新特性预览  如何在新浪SAE免费搭建个人博客?  Laravel如何处理JSON字段_Eloquent原生JSON字段类型操作教程  如何选择可靠的免备案建站服务器?  网站制作企业,网站的banner和导航栏是指什么?  Win11怎么更改系统语言为中文_Windows11安装语言包并设为显示语言  如何获取上海专业网站定制建站电话?  Laravel如何安装Breeze扩展包_Laravel用户注册登录功能快速实现【流程】  简单实现Android文件上传  浏览器如何快速切换搜索引擎_在地址栏使用不同搜索引擎【搜索】  悟空识字怎么关闭自动续费_悟空识字取消会员自动扣费步骤  如何在宝塔面板中创建新站点?  javascript基本数据类型及类型检测常用方法小结  手机网站制作与建设方案,手机网站如何建设?