[TOC]
>[success] # cookie 和 token 的區別
**cookie** 和 **token** 都是用來做 **身份認證** 的,只不過是方式不同。
>[success] ## cookie
**cookie** 是 **用戶在瀏覽器端登錄成功** 后, **服務端** 通過在 **response 響應頭** 中加入 **set-Cookie** 向 **瀏覽器** 中添加 **cookie** ,在后續該網址 **請求接口時** ,都 **會在每個請求頭中自動攜帶該 Cookie** 。登錄成功后,后端會生成一個 **Session對象** ,這個對象可以理解成就像 js 對象一樣,例如:
~~~
// 該對象就是 Session對象
{
SessionId: {
// 用戶信息
userInfo: ''
}
}
~~~
**Session對象** 中會 **存儲有關該用戶的信息** ,我們將 **SessionId** 作為 **cookie** 返回給用戶,用戶每次請求時 **cookie** 中會攜帶 **SessionId** ,我們通過 **SessionId** 可以到 **redis(內存數據庫,通常Session對象會存到這里 )** 中根據 **SessionId** 去查找該 **Session對象** 中的用戶信息,然后去進行 **校驗用戶信息以及 Cookie 是否過期來進行校驗是否有權限** 等。
>[success] ## token
**用戶在瀏覽器端登錄成功** 后, **服務端** 會生成一個名為 **token** 的 **加密字符串** ,這個 **加密字符串串** 是通過 **JWT** 生成的,其中包含 **用戶id**以及 **token過期時間**, 然后將其通過在 **響應體** 中返回,前端接收到了 **token** 后,將其存儲到本地的 **LocalStorage或SessionStorage** 中,后續在每次請求時,在前端的**axios 請求攔截器** 中從 **LocalStorage或SessionStorage** 中取出,然后放到 **請求頭** 中,這樣在每次請求時**請求頭** 中就會攜帶 **token** 了,然后 **服務端接收到了token后,會去通過密鑰校驗token的合法性,如果校驗成功,就從token中獲取用戶id等信息,然后根據用戶id去數據庫查詢用戶名、角色信息等,根據業務需求做進一步的校驗或控制** , 如果 **Token過期或不合法,服務器拒絕請求,客戶端需要重新登錄獲取新的Token。**
- vue復選框邏輯
- get請求給后臺傳數組
- 提交表單時傳值參數處理方案
- Element ui上傳圖片功能
- async和await的使用
- 時間戳轉換
- 日期格式轉換時間戳
- 時間戳轉換日期格式
- 對深拷貝的認知總結
- vue-右鍵菜單功能
- textarea中換行、回車、空格的識別與處理
- element ui表格合并
- 合并行(上下行)
- 雙層for循環
- 數組去重
- 瀑布流
- 前端多條件篩選
- 閉包的理解
- 改變this指向
- vue單選框邏輯
- 對象數組根據某個屬性來進行排序
- vscode插件整理
- 對象數組多條件去重
- Blob類型數據轉換Json數據類型
- Element ui做批量上傳功能
- 前端cookie和后端cookie
- 強制轉換https協議
- 給事件傳額外參數
- 樹形結構數據處理
- 查找所有父級數據
- 根據id篩選單條數據
- 動態引入阿里圖標庫
- 四舍五入
- 封裝一個Promise.allSettled方法
- 判斷輸入框內是否有emoji表情
- element-ui的popover組件位置偏移
- formData上傳文件時,攜帶【數組對象參數】
- 前端解壓壓縮包(zip)解壓后上傳解壓的文件
- element ui表格列相同解決辦法
- elementUI,table復選框多選,翻頁/切換條數時保持選中狀態
- cookie 和 token 的區別