Question

我遇到了一个问题，我的vuex状态仅持续进行网页刷新。刷新网页后，vuex存储中的数据将消失。

为克服这一点，我使用了名为Vuex persistestate的漂亮插件现在我的vuex坚持了。

但是axios授权标头仍然有问题。我已经在axios登录操作中设置了auth标头

actions: {
    login({ commit }, payload) {
      return new Promise((resolve, reject) => {
        try {
          axios.defaults.headers.common.Authorization = payload.token;
          commit('setUser', payload);
          resolve();
        } catch (error) {
          reject();
        }
      });
    },
  },

但是，如果我按下刷新按钮，则此auth标头值未定义。我该如何克服这个问题？

Answer 1

这是因为在上一个会话中您调用了login，并将令牌保存在axios实例中。刷新后，标头设置消失。 Vuex的持久状态仅保存您的Vuex，并且您的令牌不在您的Vuex中。

我在这里使用js-cookie。

// login action
   ...
   axios.defaults.headers.common.Authorization = payload.token;
   Cookies.set('token, payload.token);
   commit('setUser', payload);
   resolve();
   ...

// Put it somewhere in the entry of your application, e.g: `main.js`, `App.vue`.
axios.defaults.headers.common.Authorization = Cookies.get(token);

VueJS将axios标头设置为持久

1 个答案: