Auth-module: Add option to disable redirect when calling setUserToken or login

[dansullivan86]

What problem does this feature solve?

My app has a form that includes a login as part of the flow. I need to log the user in, then submit the form and handle validation responses. Currently as soon as the user is logged in they are redirected. N.B I do use the login redirect for other login flows.

What does the proposed changes look like?

Add an options param to setUserToken / login that enables you to disable the redirect.

_{This feature request is available on Nuxt community (#c666)}

[RyanMulready]

"Hacky" work around we are using

const oldRedirect = this.$auth.options.redirect;
this.$auth.options.redirect = false;
await this.$auth.setUserToken(response.token);
this.$auth.options.rewriteRedirects = oldRedirect;

[Anaphase]

I needed to overwrite the default redirects for a single route, and I ended up using something similar to @RyanMulready:

mounted() {
  this.oldRedirects = {
    home: this.$auth.options.redirect.home,
    logout: this.$auth.options.redirect.logout,
  }
  this.$auth.options.redirect.logout = false
  this.$auth.options.redirect.home = '/collection/pending'
},

beforeDestroy() {
  Object.assign(this.$auth.options.redirect, this.oldRedirects)
},

[bmulholland]

Can you help me understand the scenario here? Why do you need to submit a form _after_ the user is logged in? Isn't the form just logging the user in, and so the setUserToken is essentially the submit action?

[Anaphase]

My use case isn't really the same as @dansullivan86's. Here was my use case:

1. User lands on a page and they are already logged in
2. The user can log out on this page, but should NOT be redirected to the default /login destination that users are sent to on normal logout - instead they should stay on this page
3. I previously had { auth: false } in the component so no redirects were applied for that route
4. But then the user can log in again on this page (i.e. as a different user), in which case they SHOULD be redirected, but not to the default /home destination users are sent to on normal login
5. So I had to remove { auth: false } and substitute the "hacky swap" above for the login redirect to apply but not the logout redirect

Does that make sense? I was thinking it would be nice to be able to override the default redirects per-component. Something like:

BEFORE

export default {

  // completely disable redirects for this route
  auth: false,

  components: { ... },
  methods: { ... },

}

AFTER

export default {

  // change some redirects for this route
  auth: {
    login: '/different-than-default',
    logout: false,
  }, 

  components: { ... },
  methods: { ... },

}

So the auth property in the component would just get Object.assign()'d with the defaults for this route.

[bmulholland]

@Anaphase Thanks for the explanation. Still wrapping my head around this a bit - are you describing an admin account takeover function?

[Anaphase]

@bmulholland No, not really an "admin takeover." I simply want to change the default auth redirects for any given page. In my particular case, I wanted to disable the default logout redirect (so they stay on the page after clicking the logout button) and the default login redirect (so they would go to a different post-login destination after logging in on this special page.)

[RyanMulready]

Our use case was not a form, most of the time we want the user to be redirected to their homepage defined in options.redirect. However sometimes the user was on a page visible to guests but had additional features restricted to logged in users. In those cases we did not want to redirect the user somewhere else.

Since then we've taken it a step further since we wanted more control over where and when the user is redirected. We disable the redirect in this module completely and handle the redirect ourselves. Something like below. Ultimately I think options.redirect should take a function as an argument and it would solve a lot of these use cases.

Login.vue

await this.$auth.loginWith(name, options);
await this.$auth.handleUserRedirect(this.router);

plugins/auth-extended.js

export default async (ctx) => {
    ctx.$auth.handleUserRedirect = async (router) => {
        // Any if conditions can go here
        router.push('/');
    }
}

[bhaskar-nair2]

Is there an update on this?