nuxt-community / auth-module

Zero-boilerplate authentication support for Nuxt 2
https://auth.nuxtjs.org
MIT License
1.93k stars 924 forks source link

$auth.loggedIn is always flase #1726

Open siiiido opened 2 years ago

siiiido commented 2 years ago

Version

module: 5.0.0-1648802546.c9880dc
nuxt: 2.15.8

Nuxt configuration

mode:

Nuxt configuration

    auth: {
    strategies: {
      local: {
        token: {
          property: 'token',
          global: true,
        },
        user: {
          property: 'user', 
          autoFetch: true,
        },
        endpoints: {
          login: {
            url: 'http://127.0.0.1:8000/login/',
            method: 'post',
          },
          logout: {
            url: 'http://127.0.0.1:8000/logout/',
            method: 'get',
          },
          user: {
            url: 'http://127.0.0.1:8000/user/',
            method: 'get',
          },
        },
      },
    },
  },

What is expected?

When the user logins in with $auth.loginWith, $auth.loggedIn must return true and $auth.user also must return Object.

What is actually happening?

When the user logins in with $auth.loginWith, $auth.loggedIn and $auth.user are always false. If I use $auth.setUser when the user logins in, $auth.user return Object but $auth.loggedIn return always false.

Steps to reproduce

Additional information

Checklist

dechalico commented 2 years ago

I also have the same issue after calling the loginWith method the token didn't set. @siiiido did you already figured out the solution for this one ?

siiiido commented 2 years ago

I also have the same issue after calling the loginWith method the token didn't set. @siiiido did you already figured out the solution for this one ?

No. I tried several times but it still returns false. I just builed JWT Authentication using Vuex. If you want to bulid like me, I referenced that.

Vue2

Vue3

Songoo7 commented 2 years ago

Hello, I just installed fresh week ago and same thing, after loginWith goes on and even set token to cookies, loggedIn is false. and because its False user Endpoint is not even called.

By chance any older version which is working ? (have "@nuxtjs/auth-next": "5.0.0-1648802546.c9880dc",)

Songoo7 commented 2 years ago

I had "refresh" scheme. In that scheme if "refreshToken" property is defined, seems nuxt-auth require it to be pressend also in initial login endpoint. Which should return token and also refresh_token values. If login endpoint return only token, no error mesage or no notice is shown, after login token is saved to cookies but everything ends here and no user request is called at all.

So adding refresh_token to api login response helped me, after login user endpoint is called. This may not be fully related o this issue problem, just noting.

dechalico commented 2 years ago

@Songoo7 I solve it by doing this one.

local { token: { property: 'data.token', required: true, global: true, name: 'Authorization', type: 'Bearer', }, user: { property: 'data.member', autoFetch: false, }, endpoints: { login: { url: '/some-login-url', method: 'post' }, logout: { url: '/some-logout-url', method: 'post' }, user: { url: '/some-member-details-url', method: 'get' }, }, }

in the local option if you have "user" field and not set to false like user: false, need to provide user endpoint in the endpoint property like endpoints: {user: "/some-url-here"} this will trigger after loginWith call, if the user is success fetch then it will set the $auth.loggedIn to true else false.

if you don't have user endpoint just set if to false, after loginWith call it will set the $auth.loggedIn = true, ex:

local: { user: false, endpoints: { user: false } }

giovannimanzoni commented 2 years ago

it not work for me:

strategies: { local: false, graphql: { // custom scheme: '~/api/graphqlLogin', user: false, endpoints: { user: false } } },

and not work with: ( https://vorlume.com/nzesalem/stories/nuxt-graphql-auth-scheme )

strategies: { local: false, graphql: { // custom scheme: '~/api/graphqlLogin', } },

giovannimanzoni commented 2 years ago

I finaly solve it with this workaround: ( in comment on https://stackoverflow.com/questions/71816374/nuxt-auth-v5-not-setting-loggedin-when-use-login-logout )

const ret = await this.$auth.loginWith('graphql', credentials) if (ret) { await this.$auth.setUser(ret) this.$auth.$storage.setUniversal('loggedIn', true) // @fixme -- workaround }

work with last version, @nuxtjs/auth-next@5.0.0-1648802546.c9880dc

manuelodelain commented 2 years ago

For me, setting user.property to false does the trick

auth: {
    strategies: {
      customStrategy: {
          user: {
              property: false,
          },
          ...
    },
}
antandev commented 2 years ago

hi @siiiido,

what is your login and user endpoints looks like ?

are they like this ?

// login endpoints 

{
   "auth_token": "your_token"
}

// user endpoints
{
   "id": user_id,
   "email": user_email
}

if it is then you have to make sure your configuration is correct, for example above: the config would be

auth: {
    strategies: {
      local: {
        token: {
          property: 'auth_token',
          global: true,
        },
        user: {
          property: false 
          autoFetch: true,
        },
        endpoints: {
          // your api end point
        },
      },
    },
  },

hope this will help

thatericsmith commented 1 year ago

Leaving this here to hopefully help someone. I have a Nuxt SSR setup and for the longest time was struggling with this.$auth working after logging in. The kicker is that $auth only appears to work after a refresh - (after the server has the data). If you want to use the auth flags / data on the client (before a refresh) - you should use:

this.$store.state.auth.loggedIn 

As mentioned in the docs here: https://auth.nuxtjs.org/api/auth#loggedin