gpt4 book ai didi

vue.js - Nuxt Vuex Store Cookie 问题

转载 作者:搜寻专家 更新时间:2023-10-30 22:13:20 25 4
gpt4 key购买 nike

一天中的好时光!

在我的项目开发几周后,我决定从普通的 Vue 迁移到 Nuxt。

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

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

然而,当应用程序以 mode: universal 而不是 mode: spa 运行时,我遇到了一个非常奇怪的行为。而且我不想切换到 mode: spa 从那以后我失去了我最初迁移的 SSR。

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

在我的legacy 应用程序中,我能够通过使用以下代码从 cookie 中获取 token

import Cookies from 'js-cookie';

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

并在成功验证后通过执行以下突变保存 token :

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

但是在迁移到Nuxt.js之后,每次我登录时,状态中的 token 值都会被填充,但没有设置cookie,并且在导航到项目内的其他页面后(它是 pwa,所以没有重新加载等) token 被重置回 null。

但是,如果应用程序从 mode: universal 切换到 mode: spa 并且一切正常,这个问题就消失了。

我已经阅读了 github 上的许多问题,并且在试图解决相同问题的网站上进行了相当大的爬行,但没有一个建议对我有用。

我什至安装了 cookie-universal-nuxt来自 NPM 的包,它声称与 SSR 一起工作,但每次我试图在该州或其他任何地方访问 this.$cookies.get('token')(突变为例如),我在 null 上使用方法 (get/set/remove) 时遇到错误。

有没有人知道或知道如何克服这个问题,至少在不返回 mode:spa 的情况下是这样?

附言在 mode: spa 中运行 npm run build|generate 会生成与普通 vue 相同的文件(没有内容,只有目标元素被读取之前的结构)。

最佳答案

好吧,在我花了大约 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();
}

关于vue.js - Nuxt Vuex Store Cookie 问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50847518/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com