Auth-module: loginWith promise result is undefined

[pi0]

Version

v4.1.0

Reproduction link

https://nuxt-auth.herokuapp.com/

Steps to reproduce

The following code logs undefined:

        return this.$auth.loginWith('local', {
                data: {
                    username: this.username,
                    password: this.password
                }
            }).then(response => {
                console.log(response);
            }

What is expected?

Getting the full response

What is actually happening?

Response is undefined

Moved from https://github.com/nuxt/consola/issues/11

_{This question is available on Nuxt.js community (#c108)}

[SnooHD]

The login function does not return any data because it directly sets the data to this.$auth.user.

[kt81]

+1

this.$auth.user is set by fetchUser only when user endpoint is configured. (with local strategy)
In my case, my authentication API response includes user information so I would like to use it to set user data without multiple API requests.

How about adding a setting that specifies a user data property like the propertyName option of the token property?

[tcastelli]

+1 I would also like to get the result from the login call to check if there has been an error (graphql always returns 200 and an error field, so for now is not possible to know what has happened)

[brooklynb7]

I also encountered this issue. To solve this, I just write a workaround in the plugins/api.js as below:
Intercept the response and attach the user to store manually.

const apiFactory = axios => ({
  async getTestData () {
  ...
  }
})

export default ({ $axios, store }, inject) => {
  $axios.interceptors.response.use(
    response => {
      if (response.status === 200 && response.request.responseURL.indexOf('/Login') !== -1) {
        store.dispatch('setUser', response.data.user)
      }

      return response
    }
  )
  const api = apiFactory($axios)
  inject('api', api)
}

[rikoz]

I get undefined response too. what do I do to retrieve my response token

[1Mill]

Is there any update on this feature?

[rikoz]

The feature works perfectly. . Set your propertyName from the auth setting in nuxt config. Make sure index.js created in store. But do not expect any response from the promise in component

[unwrittenmike]

@rikoz Please provide an example curios as to how you got it to work. Thanks

[vinayakkulkarni]

Would really like a update on this feature.. I don't want to make another API call as my /login route already returns a user object in response and I need to store that user object in the auth store's user object.

(response) => { console.log(response) } would really help

[entraigas]

Hi there, I'm facing a similar issue too.
My auth muxt.config file is using a local strategy and the user endpoint is configured to false.
The issue is: in the login response, comes a token and some important id (that I need to access).
After a successful login, in this.$auth.user got an empty object.
I can still access the token with this.$auth.getToken(this.$auth.strategy.name) but I need a way to access the other prop that comes in the response.
Is there a way to access the entire login response?
Cheers!

[thilina-dulanjana]

My /login response was similar to this {"success":{"token":"eyJ0eXAiO"}}
I have just modified my login endpoint nuxt.config.js into

login: {
           url: '/login',
           method: 'post',
           propertyName: 'success.token'
 },

Still my console.log(response) prints

undefined

But the token is set correctly in cookies/local storage. Can also be accessed using this.$nuxt.$auth.$storage

[bjesus]

Seems like it's quite a common thing that the login method returns both the token and the user object, removing the need for a separate user call. Sure I could tweak my server side to not do that, but why would one prefer having two calls instead of one? 🤔

[beng970804]

After user logged in successfully, can try this:

"this.$auth.state" to get the login details

[sidouglas]

Has anybody got a workaround or example on how to fix this issue?
this.$auth.state is going to be empty as per the OPs question - because the user request is not going to be called. The user is going to be contained in the login response.

[Timibadass]

How can I update my auth-module to reflect the fix for this?

[mas-iota]

@Timibadass Add autoFetchUser: false to your strategy object in nuxt.config.js, e.g:

auth: {
    strategies: {
      native: {
        _scheme: '~/schemes/authScheme',
        endpoints: {
          login: {
            url: '/user/login',
            method: 'post',
            propertyName: 'data.access_token'
          },
          logout: {
            url: '/auth/logout',
            method: 'get'
          },
          user: {
            url: '/user/me',
            method: 'get',
            propertyName: 'data.user'
          },
        },
        tokenRequired: true,
        tokenType: 'bearer',
        tokenName: 'Authorization',
        globalToken: true,
        autoFetchUser: false
      }
    }
  },

Then after getting a successful login response, set the user manually:

     try {
          const response = this.$auth.loginWith('native', { data: this.loginForm });
          this.$auth.setUser(response.data.data.user);
        } catch (err) {
          console.log('catch error: ', err);
        }