Nuxt Vuex商店Cookies问题

Question

一天的好时光！

在我的项目进行了几周的开发之后，我决定从纯Vue迁移到Nuxt。

主要是因为我需要SSR，尽管我知道Google可以执行页面上显示的JS，因此可以为其搜索机器人生成适当的内容。

另一个原因是项目开发的一般工作流程。我喜欢自动实例化路线，商店等的想法。

但是，当我在mode: universal而不是中运行该应用程序时，我遇到了一个非常奇怪的行为mode: spa。mode: spa从那时起，我就不想再切换到SSR了。

我在商店中有一个帐户模块- account.js负责处理与帐户管理相关的任何操作，例如登录/注销，获取经过身份验证的用户的个人资料，存储从登录请求中获得的令牌以及处理逻辑2FA TOTP程序。

在我的旧版应用程序中，我只需使用以下代码就可以从Cookie中获取令牌

import Cookies from 'js-cookie';

export const state = {
   user: null,
   token: Cookies.get('token')
}

通过执行以下更改，在成功认证后保存令牌：

[types.ACCOUNT_SAVE_TOKEN] (state, { token, remember }) {
    state.token = token;
    Cookies.set('token', token, {
      expires: 365,
      httpOnly: true
    });
}

但是在迁移到Nuxt.js之后，每次登录时，都会填充该状态中的令牌值，但未设置cookie，并且导航到项目内的另一页（它是pwa，因此无需重新加载等） ）令牌重置为空。

但是，如果将应用程序mode: spa从切换到，mode: universal并且一切运行正常，则此问题将消失。

我已经阅读了github上的许多问题，并且在试图解决同一问题的网站上进行了大量的爬网，尽管没有任何建议对我有用。

我什至从NPM 安装了cookie-universal-nuxt程序包，声称它可以与SSR一起使用，但是每次我尝试this.$cookies.get('token')在该州或其他任何地方（例如突变）访问时，我只是在上使用方法（获取/设置/删除）时出错null。

至少在没有回过头的情况下，有没有人知道或对如何解决这个问题有想法mode: spa？

在时，PS Running会npm run build|generate产生与普通vue相同的文件（不包含内容，只是结构，直到重新读取目标元素为止）mode: spa。

Answer 1

好的，经过大约 12 个小时试图解决这个问题后，我决定走“肮脏”的道路并创建中间件，在我看来，它正在对每个请求进行大量处理。

import CookieParser from 'cookieparser';

export default async function ({ store, req }) {
  if (!store.getters['account/check']) {
    if (!store.state.account.token) {
      if (process.server) {
        let requestCookies = CookieParser.parse(req.headers.cookie);
        if (requestCookies.hasOwnProperty('token')) {
          store.dispatch('account/saveToken', {
            token: requestCookies.token,
            remember: true
          });
        }
      }
    }
    if (store.state.account.token) {
      if (!store.state.account.user) {
         try {
           await store.dispatch('account/fetchUser');
         } catch (error) { }
      }
    }
  }
  return Promise.resolve();
}