一、token是什么 

Token: 訪問資源的憑證。

一般用戶通過用戶名密碼登錄后，服務端會將登錄憑證做數(shù)字簽名，加密之后的字符串作為Token。

并在客戶端后面的向服務端的請求中攜帶，作為憑證。

二、token一般存放在哪里？

token 在客戶端一般存放于localStorage、cookie、或sessionStorage，vuex中。

1、localStorage

• 優(yōu)點： localStorage 生命周期是永久，這意味著除非用戶顯示在瀏覽器提供的UI上清除localStorage信息，否則這些信息將永遠存在。相同瀏覽器的不同頁面間可以共享相同的localStorage (頁面屬中相可域名和端口)。
• 缺點：同一個屬性名的數(shù)據(jù)會被替換，不同瀏覽器無法共享localStorage或sessionStorage中的信息。

2、sessionStorage

• 優(yōu)點： sessionStorage生 命周期為當前窗口或標簽頁，sessionStorage的數(shù)據(jù)不會被其他窗口清除，頁面及標簽頁僅指頂級窗口，如果一個標簽頁包含多個iframe標簽且他們屬于同源頁面，那么他們之間是可以共享sessionStorage的。
• 缺點：一旦窗口或標簽頁被永久關閉了，那么所有通過sessionStorage存儲的數(shù)據(jù)也就被清空了。

將token存放在webstroage中，可以通過同域的js來訪問。這樣會導致很容易受到 XSS攻擊，特別是項目中引入很多 第三方js類庫的情況下。如果js腳本被盜用，攻擊者就 可以輕易訪問你的網(wǎng)站，webStroage作為一種儲存機制，在傳輸過程中不會執(zhí)行任何安全標準。

XSS攻擊：cross-site Scripting (跨站腳本攻擊） 是一種注入代碼攻擊。惡意攻擊者在目標網(wǎng)站生注入script代碼，當訪問者瀏覽網(wǎng)站的時候通過執(zhí)行注入的script代碼達到竊取用戶信息，盜用用戶身份等。

3、存儲在cookie 中

讓它自動發(fā)送，不過缺點就是不能跨域

將token存放在cookie中可以指定httponly，來防止被javascript讀取，也可以指定secure ，來保證token只在HTTPS下傳輸。缺點是不符合Restful 最佳實踐，容易受到CSRF攻擊。

CSRF跨站點請求偽造(Cross-Site Request Forgery)，跟XSS攻擊一樣，存在巨大的危害性。

簡單來說就是惡意攻擊者盜用已經(jīng)認證過的用戶信息，以用戶信息名義進行一些操作（如發(fā)郵件、轉賬、購買商品等等）。由于身份已經(jīng)認證過，所以目標網(wǎng)站會認為操作都是真正的用戶操作的。CSRF并不能拿到用戶信息，它只是盜用的用戶憑證去進行操作。

4、Vuex

• 優(yōu)點：vuex的數(shù)據(jù)存儲在內存中，保密性較高
• 缺點：刷新頁面(這里 的刷新頁面指的是--> F5刷新,屬于清除內存了)時vuex存儲的值會丟失

總結：也就是說,localStorage可存儲持久化的數(shù)據(jù);sessionStorage僅限于當前窗口;vuex可存儲保密性較高的數(shù)據(jù)，但刷新頁面后數(shù)據(jù)會被清除.

三、token基本流程

（1）用戶登陸,發(fā)送手機號碼和驗證碼

（2）后臺接收參數(shù),查找用戶,用戶存在就生成token,返回給前端

（3）前端登陸成功,把token存到vuex(做持久化)

（4）使用axios攔截器,讀取vuex中的token,并放入請求頭

（5）請求其他接口,就會帶上token

（6）后臺在需要登陸的接口上,獲取token,解密token獲得userId,返回前端需要的數(shù)據(jù)

（7）用戶在下次使用app,如果token還在有效期內,不需要重新登陸

客戶端使用用戶名跟密碼去請求登陸，服務度段收到請求，去驗證用戶名和密碼，驗證成功后，服務端會簽發(fā)一個token，再把這個token發(fā)送給客戶端，客戶頓收到token之后能夠把它存儲起來，

好比放在cookie里面或者local storage里面，客戶端每次向服務端請求資源的時候須要帶上服務端簽發(fā)的token，服務端收到請求，而后去驗證客戶端請求里面帶著的token，若是驗證成功，以某種方式好比隨機生成32位的字符串做為token，存儲在服務器中，并返回token到APP，

之后APP請求時，凡是須要驗證的地方都要帶上該token，而后服務端驗證token，成功返回所須要的結果，失敗返回錯誤信息，從新登陸，服務器上的token設置一個有效期，每次APP請求時都要驗證token和有效期。

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

最新評論