我正在尝试在Nuxt Js中设置基于JWT的身份验证 . 到目前为止，我已成功登录到我的服务器，检索JWT令牌并将令牌保存在cookie中，以便在页面重新加载时保持状态 .

我已经设置了一个auth中间件，它只是调度一个动作 intiAuth ，请求对象（包含cookie）被传递给它 . intiAuth操作从请求中提取令牌，并从服务器检索用户，并通过提交 setUser 突变来更新状态 .

initAuth: (context, req) => {
    if (req) {
        if (!req.headers.cookie) {
            return;
        }
        const jwtCookie = req.headers.cookie.split(';').find(cookie => cookie.trim().startsWith('jwt='));
        if (!jwtCookie) {
            return;
        }
        const token = jwtCookie.split('=')[1];
        Axios({
            method: 'get',
            url: 'http://localhost:5000/auth/user',
            headers: {
                'Authorization': token.replace('%20', " ");
            }
        }).then((response) => {
               context.commit('setUser', response.data.username);
           });
    } else { console.log('# No Request'); }
 },

Mutation

setUser: (state, payload) => {
      state.user = payload
  }

因此，每次打开新选项卡或重新加载页面时，都会从服务器更新状态 . 现在，每次调用服务器时都会正确获取用户数据，并且我从日志中验证了这一点，但偶尔会发生突变，无法更新状态，从而将用户设置为null . 这种行为是随机的，我找不到可能的原因 . 由于我是NUXT的新手，我不确定这是我的代码的问题还是我的开发环境中的错误 .

vue.js jwt vuex nuxt.js