标签：过期 day13cookie json localStorage key cookie 对应

Cookie

概述：为了解决http无状态的问题（通过在cookie里面存储sessionID的方式来解决），cookie是存放在浏览器上的

Cookie的特性

1. 存储在浏览器上
2. 存储大小一般是4kb左右
3. 会随请求而发送
4. 可以跨域
5. 可以设置过期时间
6. 可以被篡改也可以伪造（不安全）

Cookie存储格式

key=value;expires=日期;path=地址;domain=域名;secure安全

key = value 键值对象

expires过期时间设置

path在对应的路径下才携带cookie

domain跨域的域名

secure安全（写了就是安全没写就是不安全）

Cookie的相关操作

cookie是一个容器，所以具备增删改查的方法（document.cookie||chrom.cookies）

增（给对应的cookie里面进行赋值）

//对应cookie进行赋值 
var date = new Date（2022，10，18）
document.cookie= `name=123;expires=${date}`

删（设置对应的过期时间）

//删除操作 就是设置过期时间为对应的当前时间 并不会马上删除 而是对应的浏览器关闭以后才会删除
//如果当前时间已经过了 那么对应的cookie还是会存在
var date = new Date()
document.cookie = `name=jack;expires=${date}`

改（给对应的cookie里面存在的key重新赋值）

//修改就对于已经有的key进行重新赋值操作
//如果没有设置过期时间 那么默认的过期时间是session session的过期时间是浏览器关闭就清除
document.cookie = 'name=jack'

查（不赋值直接读取对应的cookie）

//查询cookie 不赋值就是查询 显示的时候只会显示对应的key=value 其他并不会显示
console.log(document.cookie);

第三方封装的cookie

1.下载（js文件）

2.打开官网（看源码）

  //get 获取的 set 设置 remove 删除
    Cookies.set('name','tom')
    console.log(Cookies.get('name'));
    Cookies.remove('name','tom')

核心方法

• set 设置方法

• get 获取方法

• remove 删除方法

JSON格式

概述：json是一种数据传输的格式

json传输格式的好处：跨平台、跨语言

json格式的表示形式

对象 {}

var json = {}

数组 []

var json = []

json文件里面的key必须是字符串，字符串必须是双引号括起来。

JSON的序列化和反序列化

序列化 （就是将一个json对象转为对应的字符串）JSON.stringify()

var jsonStr = JSON.stringify(obj)

反序列化 （将一个json格式字符串转为对应的对象）JSON.parse()

var obj = JSON.parse(jsonStr)

本地缓存

localStorage 本地缓存（持久化存在）

//setItem 设置元素 key value
//getItem 获取元素 通过key来获取value
// removeItem 移除元素 根据key删除对应元素
localStorage.setItem('username','jack')
console.log(localStorage.getItem('username'));
localStorage.removeItem('username')

sessionStorage 本地缓存 （跟服务器的session一致 关闭浏览器就没有了）

localstorage （作为客户端缓存）和sessionStorage （做服务端的缓存 用户信息）区别

• localStorage 会持久化存在

• sessionStorage 浏览器关闭就没有了

• localStorage和sessionStorage存储地址不一样

localStorage和cookie的区别

• localStorage存储大小为5M左右 cookie只有4kb左右

• cookie会随请求发送 localStorage不会

• cookie中存储的数据对应的类型较小（图片的base码） localStorage可以存储

• cookie可以跨域 localStorage不行

• cookie跨域设置对应的过期时间 localStorage不能（主动删除不然一直都在）

• cookie和对应的localStorage存储位置不一样

共同点

• localStorage和cookie都是存放对应的字符串

• localStorage和cookie都是位于浏览器上

标签：过期,day13cookie,json,localStorage,key,cookie,对应
From： https://www.cnblogs.com/zmfhtml5/p/16804350.html