js使用sessionStorage、cookie儲存token
本文是參考別人的部落格寫的,圖片直接用的別人的
1、Token:token是客戶端頻繁向伺服器端請求資料,伺服器頻繁的去資料庫查詢使用者名稱和密碼進行對比,判斷使用者名稱和密碼正確與否,並作出相應的提示,在這樣的背景下,token便應運而生了。
2、使用token的目的:token的目的是為了減輕伺服器的壓力,減少頻繁的查詢資料庫。
3、在前端請求後臺的API介面的時候,為了安全性,一般需要再使用者登入成功之後才能傳送其他請求。
因此,在使用者登入成功之後,後臺會返回一個token給前端,這個時候我們就需要把token暫時儲存在本地,每次傳送請求的時候需要在header裡邊帶上token(無需再次帶上請求名和密碼),這個時候本地的token和後臺資料庫中的token進行一個驗證,如果兩者一致,則請求成功,否則失敗。
4、如何使用token?
①使用裝置號/裝置mac地址作為token(推薦)
客戶端:客戶端在登入的時候獲取裝置的裝置號/mac地址,並將其作為引數傳遞到伺服器端
伺服器:伺服器接收到該引數之後,使用一個變數接收同時將其作為token儲存資料庫,並將該token設定在session中,客戶端每次請求的時候都要統一攔截,並將客戶端傳遞的token和伺服器session中的token對比,如果相同則放下,不同則拒絕
優點:客戶端不需要重新登入,只要登入一次後就能一直使用
缺點:客戶端需要帶裝置號/mac地址作為引數傳遞
②用session值作為token
客戶端:客戶端只需要攜帶使用者名稱和密碼即可登入
服務端:客戶端接收到使用者名稱和密碼後並判斷,如果正確就將本地獲取sessionId作為token返回給客戶端,客戶端以後只需要帶上請求資料即可
登入成功的token:
其他請求的時候,在header裡面帶上token:
js使用cookie儲存token(cookie在http請求中,隨著請求傳送到伺服器)
將token儲存在cookie中,一旦瀏覽器關閉,cookie中的token就會被清空。
document.cookie = token; //將token儲存在cookie中
var token = document.cookie.split(";")[0]; //從cookie中讀取token
js使用sessionStorage儲存token
sessionStorage.setItem("key","value");
//儲存資料到sessionStorage
var data = sessionStorage.getItem("key"); //獲取資料
sessionStorage.removeItem("key"); //刪除資料
sessionStorage.clear(); //刪除儲存的所有資料