一.我們首先要知道vuex,localstorage和sessionstorage區別;
參考文章:
1．localstorage
優點：a，localstorage生命週期是永久，這意味著除非使用者顯示在瀏覽器提供的ui上清除localstorage資訊，否則這些資訊將永遠存在。
b，相同瀏覽器的不同頁面間可以共享相同的 localstorage（頁面屬於相同網域名稱和埠）。
缺點:ａ，同乙個屬性名的資料會被替換。
b，不同瀏覽器無法共享localstorage或sessionstorage中的資訊。
２．sessionstorage
優點：ａ，sessionstorage生命週期為當前視窗或標籤頁，
ｂ，sessionstorage的資料不會被其他視窗清除
ｃ，頁面及標 簽頁僅指頂級視窗，如果乙個標籤頁包含多個iframe標籤且他們屬於同源頁面，那麼他們之間是可以共享sessionstorage的。
缺點：ａ，一旦視窗或標籤頁被永久關閉了，那麼所有通過sessionstorage儲存的資料也就被清空了。
３．vuex
優點：ａ，vuex的資料儲存在記憶體中,保密性較高
缺點：a，當重新整理頁面（這裡的重新整理頁面指的是 --> f5重新整理,屬於清除記憶體了）時vuex儲存的值會丟失
總結:也就是說,localstorage可儲存持久化的資料;sessionstorage僅限於當前視窗;vuex可儲存保密性較高的資料,但重新整理頁面後資料會被清除.
二.接下來分析下token分別儲存在vuex,localstorage和sessionstorage區別
1，localstorage：可以持久化儲存token，需要在重新登入時，清除原有的localstorage資料；但如果開啟新的頁面（新視窗）重新登入其他賬號，會替換原有的token；
２，vuex：保密性高，不會因為開啟其他頁面清除token，但頁面重新整理會清除token.
注:可以嘗試在監聽頁面重新整理前,將vuex存在localstorage,重新整理後再獲取並刪除token
３，sessionstorage：在不關閉視窗的情況，可以持久化儲存token，也需要在重新登入時，清除原有的sessionstorage資料；但開啟新的頁面（新視窗）重新登入其他賬號，不會替換原有token；也不會因為重新整理頁面清除token；
注:如果複製頁面的話,兩個頁面會共享sessionstoage中的資料
綜合上述分析：token最好是保留在sessionstorage中
前端token儲存方法
token儲存方法第一步安裝 npm i js cookie 安裝第二步在main.js引入 import cookie from js cookie vue.prototype.cookie cookie 第三步賦值呼叫 var cookie this cookie 賦值 this cookie....
關於token的建立 儲存以及認證
http請求是種無狀態的請求，每乙個http請求之前都沒有關聯，而在日常中，我們常常需要訪問一些受限的頁面，比如，登陸網易雲之後，訪問自己收藏的歌單，或者幹別的事，每次都帶了個http請求，之前說了http是無狀態的，就是說伺服器只有一次性的記憶，之前登陸成功，但你發起下一次請求時，伺服器可不會記得...
前端安全 關於token
1.將荷載payload，以及header資訊進行base64加密，形成密文payload密文，header密文。2.將形成的密文用句號鏈結起來，用服務端秘鑰進行hs256加密，生成簽名.3.將前面的兩個密文後面用句號鏈結簽名形成最終的token返回給服務端 1.使用者登入校驗，校驗成功後就返回to...