7

Note Edit with relevant code snippets

I have run into an odd issue where I get into a infinite redirect loop when issuing a router.navigate.

Setup

  • I use the hash location strategy and the app is used as an Outlook plugin.
  • I have three routing rules
    • "" redirect to "/login"
    • "/login" mapped to LoginViewComponent
    • "/foo" mapped to FooViewComponent
  • The LoginViewComponent has two behaviours:

    • If the user's identity cannot be verified the user will be prompted for credentials
    • If not redirect is issued to the FooViewComponent
  • The redirect is simply issued with the following bit of logic:

this.router.navigate(["foo"])

  • The routes are registered as follows:

const routes: Routes = [
    {
       path: "",
       redirectTo: "login",
       pathMatch: "full"
    },
    {
        path: "login",
        component: LoginViewComponent
    },
    {
        path: "foo",
        component: FooComponentView
    }
];

@NgModule({
    imports: [RouterModule.forRoot(routes, { useHash: true,  enableTracing: true})],
    exports: [RouterModule]
})
export class AppRoutingModule { }

Problem

  • When I issue a redirect in the ngOnInit function of the LoginViewComponent I get into an infinite redirect loop.
  • It first navigates to the FooViewComponent but then does a redirect back to the LoginViewComponent.
  • As far as I can understand the redirect to the LoginViewComponent can only be made if there is a call to router.navigate([" "]) or router.navigate(["login"]). However, neither of these navigate commands are present in the FooViewComponent.

angulart2-router-infinite-redirect-loop

Michahell
  • 4,905
  • 5
  • 29
  • 45
Sameera Jayaseckara
  • 457
  • 1
  • 6
  • 13
  • What kind of answer do you expect? It would be nice to provide some code, point where you found the redirect problem when you were debugging. Your console error if you have. Right now I can only point documentation for you. – Ramon Marques Jun 23 '17 at 11:00
  • There is no console error but merely a set of router Navigation{Events}.I have added a diagram since I thought it would be much easier to explain the problem visually. – Sameera Jayaseckara Jun 23 '17 at 12:52
  • I guess there will be an `AppComponent` too, can you please do a `console` in the constructor of your `AppComponent` and check if your `app` is reloading again and again? – Ashish Ranjan Jun 23 '17 at 13:55
  • I just checked by adding a console log into the AppComponent constructor and it is not reloading – Sameera Jayaseckara Jun 29 '17 at 15:55
  • I debugged it further and it seems after the router.navigate call a new NavigateStart event is generated with the url and path set to "/login" – Sameera Jayaseckara Jun 29 '17 at 18:54
  • Does routing work in this web application when office.js is not included? There are no known issues with Angular2 routing while using office.js. – Outlook Add-ins Team - MSFT Jul 18 '17 at 00:15
  • I am also running into the same problem, however it does not seem to be related to officeJs. – Michahell Mar 29 '18 at 13:59
  • Check if LoginViewComponent has code that navigates back to '/' In that case, navigating to '/' redirects to "/login" and login redirects back to '/', thus a redirect loop is created. If you can't find out that code then I suggest removing code piece by piece to see what's causing it. – Shahar Apr 17 '18 at 10:09
  • Same problem here. Also with office-js. Did you manage to solve it? – Silva Aug 28 '18 at 17:56
  • @OutlookAdd-insTeam-MSFT I think this is related to the fix for https://github.com/OfficeDev/office-js/issues/40#issuecomment-355173515 - the fix has broken something in Word Online. **Workaround:** tell the Angular Router to leave the browser URL as-is: `this.router.navigate([route], { skipLocationChange: true });` or `this.router.navigateByUrl(url, { skipLocationChange: true });` – Sameer Singh Nov 07 '18 at 06:28
  • Same problem here, also with office js. Any solutions? – Asool Feb 06 '19 at 21:10
  • Can you try using a hash based location strategy? – Sameera Jayaseckara Feb 07 '19 at 11:13

0 Answers0