在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ react 中使用 axios ， 如何獲取登錄接口返回的 token ?

react 中使用 axios ， 如何獲取登錄接口返回的 token ?

是這樣的！

項目使用 react + axios , axios 發(fā)送請求需要在 header 中設置 token。

問題是，token 是從登錄api接口返回的。 那么很明顯,這個token值得存儲成全局變量。因為其他組件中也要用axios發(fā)送接口需要用到這個token。

  1. 存到 localstorage 里，每次發(fā)送請求都從 localstorage 中讀取。
  2. 用 redux 存儲

想問3個問題：

  1. 用方式1會不會有性能問題，localstorage 畢竟不同于普通的函數(shù)
  2. 方式2的話，如果項目本身用不到 redux, 似乎有點大材小用額～，怪怪的。
  3. 是不是又別的方式，大家是怎么處理的呢。
回答
編輯回答
懶豬

一般來說你需要localstorage和window(global)配合使用;
首先你從后臺獲取了token,可以把token賦給window也就是this,這樣你在任何地方都可以使用this.token,但是用戶一旦關閉瀏覽器，這個js執(zhí)行環(huán)境消失，第二次再打開瀏覽器瀏覽的時候，就需要重新去登錄獲取token,很顯然這并不是我們想要的保存登錄信息，那么正確的步驟是：
1，登錄成功后，this.token = res.data.token,同時將token存儲在localstorage，這樣每次請求都用this.token，而不需要去localstorage取
2.當用戶關閉了瀏覽器，下次進入的時候才取localstorage，然后把取到的結果賦給this,也就是this.token = 你取到的token
3.只要當用戶退出登錄的時候才remove localstorage里面的token

2017年8月10日 00:30
編輯回答
遺莣

直接把token設置成默認請求頭，每次請求都自動攜帶。

import axios from 'axios';

const TOKEN_KEY = 'AS_MALL_ACCESS_TOKEN';

axios.defaults.headers.common['Authorization'] = localStorage.getItem(TOKEN_KEY);

token有更新的時候localStorage重新緩存下axios.defaults.headers.common更新下就行了

2017年11月9日 22:34