Redirect to previous url after login in nuxt.js

Question

I basically want to redirect to the previous url when a user has successfully logged in.

I redirect to the login page with the previous url such as /login?redirect=/page1/page2.

And I want when a user authenticates to be redirected back to that url. I am using the auth-module here: https://auth.nuxtjs.org/

How I login the user.

methods: {
    async submit() {
      await this.$auth.loginWith('local', {
        data: this.form
      })
    }
}

The only thing that I could found in the docs is this: https://auth.nuxtjs.org/getting-started/options#redirect

which however only redirects to a specific page instead of the previous page in the query.

Any ideas on how to achieve this?

Answer 1

You Can Do This

  this.$router.back()

And its go back to the last route.

Programmatic Navigation | Vue Router https://router.vuejs.org/guide/essentials/navigation.html

Thanks.

Answer 2

There is a fairly detailed discussion in github about Nuxt having an issue with a redirect when you are hitting a protected page directly. The redirect goes to the default page redirect rather than the previously hit page. The correct behavior should be to store the redirect and then proceed to it after authentication (login) with correct credentials.

3 days ago (Apr 14, 2019), MathiasCiarlo submitted a PR on the auth-module repo to fix this. The base reason why the redirect was "lost" has to do with the state of the redirect value not being allowed to be set as a cookie in SSR mode. His code impacts the storage.js file, in particular the setCookie() method. I've included that changed method here just for reference.

setCookie (key, value, options = {}) {
    if (!this.options.cookie) {
      return
    }

    const _key = this.options.cookie.prefix + key

    const _options = Object.assign({}, this.options.cookie.options, options)

    if (isUnset(value)) {
      Cookies.remove(_key, _options)
    } else {

      // Support server set cookies
      if (process.server) {
        this.ctx.res.setHeader('Set-Cookie', [_key + '=' + value])
      } else {
        Cookies.set(_key, value, _options)
      }
    }

    return value
  }

I've personally just altered my npm myself, but you could probably fork the repo and use that forked npm for the time being. Or you could wait until the PR is merged into the mainline of the auth-module repo.