Auth-module: Only redirect on successful response from server on login

[kaloraat]

Hi
I have the following code to login user in my nuxt app.

`
// pages/login.vue

methods: {
async submit() {
await this.$auth.loginWith("local", {
// send the data to the server
data: this.form
});

  this.$router.push({
    // redirect to intended location
    path: this.$route.query.redirect || "/" 
  });
}

}`

// nuxt.config.js
// endpoints
`login: {
url: "login",
method: "post",
propertyName: "meta.token",
tokenRequired: true,
tokenType: "bearer"
},

`

The problem is, even if i hit the submit button without filling out form or with wrong info, it redirects me to home page. It does not login with wrong detail so that part is fine. But it should not redirect with empty or wrong form data.

I guess it happens because, it happens in the client side and does not wait for the server response. It's been a real problem, any solutions?

_{This question is available on Nuxt community (#c208)}

[cmty[bot]]

This issue as been imported as question since it does not respect auth-module issue template. Only bug reports and feature requests stays open to reduce maintainers workload.
If your issue is not a question, please mention the repo admin or moderator to change its type and it will be re-opened automatically.
Your question is available at https://cmty.app/nuxt/auth-module/issues/c208.

[siberiadev]

Yeah, I have the same issue here.

[siberiadev]

I just solved that problem.
I just added followen code to my /store/auth.js in state part:

busy: false,
loggedIn: false,
strategy: "local",
user: false,

the full state part looks like that:

//store/auth.js
export const state = () => ({
busy: false,
loggedIn: false,
strategy: "local",
user: false,
})

Now when login is fail there is no redirect on home page.
Also for some reason I add redirect to my nuxt.config.js (maybe it needs to make that work, I dont really know...)

//nuxt.config.js
auth: {
strategies: {
local: {
endpoints: {
login: { url: 'login', method: 'post', propertyName: 'access_token' },
user: { url: 'user', method: 'post', propertyName: 'data' },
logout: { url: 'logout', method: 'post' }
}
}
},
redirect: {
login: '/auth/login',
logout: '/',
home: '/',
callback: '/'
},
watchLoggedIn: true,
rewriteRedirects: true
},

Why I did all this, just because I found that when it redirect after fail login nuxt added this things to vuex. And if I try login with fail again there is no redirect anymore.

[keyvans2]

thanks that works for me