CODEWITHSUNDEEP
javascriptvue.jsnuxt.js
Samson Iyanda
Samson Iyanda

Reputation: 582

Basic Auth in Nuxt JS

I've been having hard times trying to implement basic auth in nuxt js app using an existing API from the back-end. I successfully generate a token and login with it but whenever I refresh the browser, I am redirected to the login page despite the fact that token generated and user details are saved in local storage and cookies

My implementation have been based on this example; 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);
}

I expect the generated token to be save in the localstorage and when or if expires a refresh token should be use to generate a new token.

Upvotes: 2

Views: 1315

Answers (1)

Vinicius Santin
Vinicius Santin

Reputation: 620

What nuxt version are you using? Context.isServer has been deprecated and can be undefined depending on nuxt version you are using. If it is the case, changing to process.server should fix the problem.

Upvotes: 1

Related Questions