Nuxt JS 中的基本身份验证

Posted 2023-03-16

【中文标题】Nuxt JS 中的基本身份验证

【英文标题】：Basic Auth in Nuxt JS

【发布时间】：2019-09-02 00:39:42

【问题描述】：

我一直在尝试使用来自后端的现有 API 在 nuxt js 应用程序中实现基本身份验证。我成功生成了一个令牌并使用它登录，但是每当我刷新浏览器时，我都会被重定向到登录页面，尽管生成的令牌和用户详细信息都保存在本地存储和 cookie 中

我的实现是基于这个例子； https://github.com/nuxt/example-auth0

// middleware/auth.js 

import  getUserFromCookie, getUserFromLocalStorage, getUserTokenFromCookie, getUserTokenFromLocalStorage  from '~/utils/auth'
import  LOGGIN_USER, SET_TOKEN  from '../utils/mutation-types';

export default function ( isServer, store, req ) 
  // If nuxt generate, pass this middleware
  if (isServer && !req) return;
  const user = isServer ? getUserFromCookie(req) : getUserFromLocalStorage();
  const token = isServer ? getUserTokenFromCookie(req) : getUserTokenFromLocalStorage();
  store.commit(LOGGIN_USER, user);
  store.commit(SET_TOKEN , token);

我希望生成的令牌保存在本地存储中，并且在过期或过期时应该使用刷新令牌来生成新令牌。

【参考方案1】：

您使用的是什么版本的 nuxt？ Context.isServer 已被弃用，可以是 undefined，具体取决于您使用的 nuxt 版本。 如果是这种情况，更改为process.server 应该可以解决问题。