cookie的基本使用
1.基本概念
// cookie是英文 曲奇、小甜饼的意思
// HTTP协议是一个无状态的协议 状态指的是连接会不会持久保持
// cookie是HTTP协议的一部分 HTTP协议对cookie有规定
// cookie是浏览器端的存储方式 同时也是一个请求头字段
// cookie由服务器设置 由前端存储 (通过JS脚本也可以进行cookie的操作)
// 登录流程:
// 前端填写好表单之后,通过表单或者AJAX发送请求,发给登录接口。登录接口处理完毕,成功! 此时会在响应头中添加一个字段 set-cookie: xxxx=xxxx. 这个响应头会随着响应请求回到浏览器。浏览器在处理这次请求的时候发现有这个字段 于是 把这个信息存储起来(以文件的形式存储) 当下一次浏览器发送请求的时候 相应的cookie 会随着请求再次发送到服务器上。
JS获取cookie的方式 document.cookie
设置方式 document.cookie = “key=value”; 一次设置 只能设置一个值
2.封装的操作方法
// 封装cookie的操作方法
function getCookie(name) {
// 获取cookie
var str = document.cookie;
// 把cookie以 "; " 进行分隔
var arr = str.split("; ");
// 循环数组
for (var i = 0; i < arr.length; i++) {
// 以等号分隔
var key = arr[i].split("=")[0];
var value = arr[i].split("=")[1];
if (key === name) {
return value;
}
}
}
function setCookie(name, value, maxAge = 0, path = "/") {
document.cookie = name + "=" + value + ";max-age=" + maxAge + ";path=" + path;
}
function removeCookie(name, path) {
document.cookie = name + "=1;max-age=-1;path=" + path;
}