vue token 登入思維和處理

2021-10-10 23:59:32 字數 1838 閱讀 7173

思維:

將登入成功之後的 token,儲存到客戶端的 sessionstorage 中

1.1 專案中除了登入之外的其他api介面,必須在登入之後才能訪問(路由導航守衛)

1.2 token 只應在當前**開啟期間生效,所以將 token 儲存在 sessionstorage 中

通過程式設計式導航跳轉主頁

退出時,清除token

請求引數時,攜帶上token

一、將token和userid儲存到localstorage中,並跳轉

在登入元件的methods中:

('登入失敗!'

)this

.$message.

success

('登入成功'

)// 將token存入localstorage

localstorage.

setitem

('visualizationtoken'

, res.data.token.value)

// 將userid存入localstorage

localstorage.

setitem

('visualizationuserid'

, res.data.userinfo.userid)

// 2. 通過程式設計式導航跳轉到主頁,路由位址是 /home

this

.$router.

push

('/home'

)}以上**注意點:對於token的命名前最好攜帶上自己的專案名,因為在同一網域名稱伺服器上,可能有多個專案,命名衝撞了會導致在運維那塊出現一些bug(此是聽別人說了一遍記的,可能記的有點偏頗,如有不對,請指正,謝謝。)

二、路由導航守衛

在router.js檔案中

// 掛載路由導航守衛

router.

beforeeach

((to,

from

, next)

=>

)

三、退出-清除token在登入元件的mounted中

mounted()

}

四、每次請求都攜帶上token在main.js檔案中

// 每次請求都帶上token

axios.interceptors.request.

use(config =>

else

return config

})

以上**中的bearer和basic ywxsomfsba== 每個人的可能不同,由此獲得:

此時還未登入,沒有token:

登入之後,已經拿到token了:

數學思維和程式設計思維

1 程式設計沒有數學基礎不行 2 但懂數學不等於懂程式設計 舉乙個例子 求1 2 3 4 99 100的和。數學解法通常是 1 1 100 100 2 5500 2 小學生的解法 1 2 3 3 3 6 這樣累算下去。程式設計解法呢?跟數學解法2相同,如下 static void main stri...

資訊 思維和組織

知道 人獲得資訊的過程 知道 事物變化的可能性變大或變小的過程 不能獲得有效控制的原因 獲得的資訊太少 電機位置控制中,單環 位置環 控制 雙環 位置環和速度環 控制 和三環 位置 速度 電流環 控制的效果肯定不一樣 補充兩點 1 資訊如何利用 控制演算法 2 利用後如何執行 執行器,驅動器的速度,...

什麼是工程思維和產品思維

在外行人眼裡,工程師是乙個死板 墨守成規 不會思變的工種。其實不然。一 在工程上經常會遇到那些與設計無關的 但是或多或少能影響到工程效率的東西,要想提高效率,就要靈活運用你的工程思維。下面舉幾個例子 1 乙個板子上有多組電源,5v 3.3v 2.5v,而且都是ldo。這時,在功率允許的範圍下,在每個...