CODEWITHSUNDEEP
javascriptvue.jsauthenticationnuxt.jsvuex
Нариман Алимурадов
Нариман Алимурадов

Reputation: 41

Nuxt-auth v5 module does not set loggedin user in store state

I am currently workin on Authentication functionality with the help of the Nuxt Auth Module. On the frontend i am running Nuxt Js, and on the backend i am running FastApi.

In nuxt.config.js i have set the auth settings:

  //Nuxt Auth module configuration https://auth.nuxtjs.org/schemes/local
  auth: {
    rewriteRedirects: false,
    cookie: {
      options: {
          maxAge: 60 * 60 * 60 // 60 hours
      }
    },
    localStorage: {
      prefix: 'auth.'
    },
    strategies: {
      local: {
        token: {
          prefix: 'access_token.',
          property: 'access_token',
          type: 'Bearer',
          maxAge: 60 * 60 * 60
        },
        user: {
          property: 'user',
          autoFetch: true
        },
        endpoints: {
          login: { url: '/api/v1/login/access-token', method: 'post' },
          logout: false,
          user: { url: '/api/v1/users/me', method: 'get' }
        },
        redirect: {
          login: '/login',
          logout: '/',
          // callback: '/login',
          home: '/dashboard'
        }
      }
    }
  }

In my Login.vue i have a form with the login method: import materialCard from '~/components/material/AppCard'

export default {
  components: {
    materialCard
  },
  middleware: 'authenticated',
  auth: 'guest',
  data () {
    return {
      username: 'admin',
      password: 'admin'
    }
  },
  methods: {
    async authenticate () {
      const form = new FormData()
      form.append('username', this.username)
      form.append('password', this.password)
      await this.$auth.loginWith('local', { data: form })
        .then((res) => {
          console.log(res)
        }).catch((err) => {
          console.log(err.res)
        })
    }
  }
}

When i try to login, the async function 'login' is being called. The user that corresponds with the username and password gets returned. The only problem i have, is that the when i look in the vuex state, auth.loggedIn stays false and the auth.user stays undefined.

I thought Nuxt Auth updates the state automatically, or am i missing something?

Upvotes: 4

Views: 724

Answers (1)

Tran Tai
Tran Tai

Reputation: 171

I got the same problem with oauth2, please make sure your redirectUri have auth enabled. It does not call $auth.fetchUser() when I set redirectUri: '/' because '/' is auth: false. More of my finding: https://github.com/nuxt-community/auth-module/discussions/1592#discussioncomment-4250173

Upvotes: 1

Related Questions