Redirect to original route after login

[stanleygu]

If someone who is not authenticated yet initially requests an authenticated route, e.g. /settings, how would it be possible to redirect to the original route after login?

[andrewstuart]

:+1: from me. Or if my token times out while I'm at some view, I'd prefer to either not have to leave the view I'm in (popup login) or at least be taken back after login, since I think OAuth redirection makes a popup hard/impossible.

[kingcody]

If you're ok with an actual popup window you can do something like this:

[kingcody]

@stanleygu in the canary branch, take a look at app/templates/client/app/account(auth)/account(js).js; specifically the logout controller and also the $rootScope.$on('$routeChangeStart', fn) or $rootScope.$on('$stateChangeStart', fn) (whether your doing ui-router or not) that should give you an idea of one way it can be done.

[stanleygu]

I couldn't figure out how to trigger the route change from the popup.

I ended up using a workaround for now where I pass the original route as a query parameter in the callbackURL during passport auth, which comes back and I do the redirect at that point.

e.g.

callbackURL = config.WEB_HOST + '/auth/github/callback?referrer=' + encodeURI(req.query.referrer);

[hiromitz]

I think you can change redirect url In server/auth/auth.service.js.

https://github.com/DaftMonk/generator-angular-fullstack/blob/master/app/templates/server/auth(auth)/auth.service.js#L70

[stanleygu]

@hiromitz, yep that is where I ended up doing my redirect:

  if (req.query.referrer) {
    res.redirect(req.query.referrer);
  } else {
    res.redirect('/');
  }

However, since that call comes from the OAuth server, the challenge was saving the original destination URL. I ended up sending the original URL to the OAuth server for it to include in the callback URL as a query string, which then gets read inside auth.service.js. Seems kludgey, there is probably a better way to do it.

[azachar]

@stanleygu can you provide your solution as a PR? Thank you.

[kingcody]

@stanleygu that's probably how I'd do it as well. IMHO OAuth itself is "kludgey" so you end up having to do some odd things at times.

[azachar]

Hey Guys, I did the same effect on the client side only.

I used ngStorage library to store a requested page to $sessionStorage and UI-Route's state change filtering to restore the page after login or after any other page was loaded.

I can provide a PR if there is any interest.

Cheers, A.

[dcoffey3296]

Hey @azachar @stanleygu, I am trying to solve the same thing. I am not clear on where I'd capture the originally requested url, where I'd store it, and where to place the redirect once the user logs in. Either of you up for providing a gist? Anyone else have an example? I asked on Stack Overflow but no solution yet... http://stackoverflow.com/questions/28870430/redirect-to-original-request-after-authentication-angular-fullstack

[yeaske]

An option using state:

Before login:

     $rootScope.$on('$stateChangeStart', function (event, next) {
      Auth.isLoggedIn(function (loggedIn) {
        if (next.authenticate && !loggedIn) {
          if ($location.url() != '/login') {
            $cookieStore.put('redirectState', next.name);
          }
          $location.path('/login');
        }
      });
    });

After login:

this.$state.go(this.$cookieStore.get('redirectState'));
this.$cookieStore.remove('redirectState');