session&cookie😁
先聊一聊session和cookie的起源
- web1.0强调的是资源的共享
- web2.0强调的是交互,引入了session和cookie用于实现状态的记录
- web3.0强调的是双赢
session和cookie的特征
- session和cookie都是服务器生成的,都是用来存储特定的值(键值对)
- session是返给服务器的,cookie是存储在客户端的。
- 客户端在发送请求的时候,会自动将可用cookie封装在请求头中并和请求一起发送
- session和cookie都是有生命周期的cookie的生命周期一般会受两个因素影响:
- cookie的自身存活时间
- 客户端是否保留了cookiesession的生命周期也由两个因素影响:
- 服务器对于session对象保存的最大时间的设置
- 客户端进程是否关闭(客户端关闭只对用户有影响)
- cookie和session都有其作用域
cookie是什么?
Cookie 是一些数据, 存储于你电脑上的文本文件中
当 web 服务器向浏览器发送 web 页面时,在连接关闭后,服务端不会记录用户的信息
Cookie 的作用就是用于解决 "如何记录客户端的用户信息"
如何创建cookie
通过 JavaScript 创建 cookie
我们可以通过javascript的document.cookie属性来创建,读取,删除cookie
- 创建cookie
document.cookie = "username=cxy"; 复制代码
当然我们还可以为其设置有效日期,因为默认情况下浏览器关闭会删除cookie
document.cookie = "username=mengxiangrui; expires=cxy, 31 Dec 2021 12:00:00 UTC"; 复制代码
- 读取cookie
var cookie = document.cookie 复制代码
- 改变cookie 我们想要改变cookie的时候我们可以通过再次创建来改变它
- 删除cookie 我们直接可以通过设置日期为过去来删除cookie
来试一下用jq操作cookie吧
- 创建cookie
$.cookie('name', 'cxy'); 复制代码
- 创建 cookie,并设置 7 天后过期
$.cookie('name', 'cxy', { expires: 7 }); 复制代码
- 读取 cookie
$.cookie('name'); // cxy 复制代码
- 删除cookie
$.removeCookie('name') 复制代码
举个🌰
$(document).ready(function(){ $.cookie('name', 'cxy'); // 创建 cookie name = $.cookie('name'); // 读取 cookie $.cookie('name2', 'cxy', { expires: 7, path: '/' }); name2 = $.cookie('name2'); }); 复制代码
跑在本地服务器上大家会看到我们存储的cookie
用JQ创建cookie
- 创建 cookie:
$.cookie('name', 'value'); 复制代码
如果未指定过期时间,则会在关闭浏览器或过期。
- 创建 cookie,并设置 7 天后过期:
$.cookie('name', 'value', { expires: 7 }); 复制代码
- 创建 cookie,并设置 cookie 的有效路径,路径为网站的根目录:
$.cookie('name', 'value', { expires: 7, path: '/' }); 复制代码
注: 在默认情况下,只有设置 cookie 的网页才能读取该 cookie。如果想让一个页面读取另一个页面设 置的cookie,必须设置 cookie 的路径。cookie 的路径用于设置能够读取 cookie 的顶级目录。将这 个路径设置为网站的根目录,可以让所有网页都能互相读取 cookie (一般不要这样设置,防止出现冲突)。
- 读取 cookie:
$.cookie('name'); // => "value" $.cookie('nothing'); // => undefined 复制代码
- 读取所有的 cookie 信息:
$.cookie(); // => { "name": "value" } 复制代码
- 删除 cookie:
$.removeCookie('name');