NavigateByUrl не работает с onTokenReceived, используя angular -oauth2-oidc

Question

Я использую angular-oauth2-oidc пакет, я использую неявный поток, и я не могу перейти (на данный момент) к потоку кода.

Я хотел бы перейти к исходному URL, когда поток закончилась, я использовал сохранение состояния , как предлагается в документе.

Моя проблема в том, что я не могу перейти от функции onTokenReceived, обещание, разрешенное navitageByUrl, разрешается с false, но без ошибок на консоли:

export class AppComponent {
    url: string;    

    constructor(
        private oauthService: OAuthService, 
        private router: Router) {

        this.url = window.location.pathname; // Get requested url.
    }

    ngOnInit() {        
        this.oauthService.loadDiscoveryDocument().then(res => {
            console.log(res);
            this.oauthService.tryLogin({
                onTokenReceived: (info) => {
                    // Receive state and navitage to.
                    this.router.navigateByUrl(info.state).then(res => {
                        if (!res) {
                            console.error("Navigate to " + info.state + " after get token:" + res);
                        }
                    });
                }
            }).then(res => {
                if (!res) { // If not login init implicit flow passing url as state.
                    this.oauthService.initImplicitFlow(this.url);                
                }

            })
        })        

    }
}

Однако, оно работает, если запустить через 100 миллисекунд, используя setTimeout:

onTokenReceived: (info) => {
    // Receive state and navitage to.
    setTimeout(() => {
        this.router.navigateByUrl(info.state).then(res => {
            if (!res) {
                console.error("Navigate to " + info.state + " after get token:" + res);
            }
        });
    }, 100); // With less than 100 not works.
}

Кто-нибудь может мне помочь? Почему navigateByUrl не работает?

Answer 1

Я отлаживал маршрутизатор angular, чтобы узнать, почему навигация разрешается с ошибкой. Я видел, что навигация может быть отменена, если начинается другая навигация. Ну, я зарегистрировал события маршрутизатора, и я мог видеть, что другая навигация запускается, когда моя навигация находится в процессе.

Это журнал:

app.component.ts:31 NAVEvent- NavigationStart to /#id_token=eyJhbG(...hide for simplicity...)8da3798eac66
app.component.ts:31 NAVEvent- RoutesRecognized
app.component.ts:31 NAVEvent- GuardsCheckStart
app.component.ts:31 NAVEvent- ChildActivationStart
app.component.ts:31 NAVEvent- ActivationStart
app.component.ts:31 NAVEvent- GuardsCheckEnd
app.component.ts:31 NAVEvent- ResolveStart
app.component.ts:31 NAVEvent- ResolveEnd
app.component.ts:31 NAVEvent- ActivationEnd
app.component.ts:31 NAVEvent- ChildActivationEnd
app.component.ts:31 NAVEvent- NavigationEnd
app.component.ts:31 NAVEvent- Scroll
app.component.ts:50 TOKEN RECEIVED --> Here I received the token and init the navigation to original requested URL
app.component.ts:31 NAVEvent- NavigationStart to /data/orderByToken/f5c2a1af-b0fa-48ab-867d-d748f53d42fb
app.component.ts:31 NAVEvent- RouteConfigLoadStart
app.component.ts:31 NAVEvent- NavigationCancel   --> this cancel my navigation and causes false resolved.
app.component.ts:31 NAVEvent- NavigationStart to /welcome -> Angular navigate to /welcome due to I have a redirect on routing module.
app.component.ts:31 NAVEvent- RoutesRecognized
app.component.ts:31 NAVEvent- GuardsCheckStart
app.component.ts:31 NAVEvent- GuardsCheckEnd
app.component.ts:31 NAVEvent- ActivationEnd
app.component.ts:31 NAVEvent- ChildActivationEnd
app.component.ts:31 NAVEvent- NavigationEnd
app.component.ts:31 NAVEvent- Scroll

У меня есть перенаправление в angular маршрут конфигурации такой:

{ path:"", redirectTo: "welcome", pathMatch: "full"}{ path:"", redirectTo: "welcome", pathMatch: "full"}

Не является angular -oauth2-oid c проблемой ...

Когда обещание навигации разрешается с ложью, навигация к / Welcome закончен, поэтому я решил попробовать еще раз, запустить навигацию в другой раз, на этот раз это работает.

Что-то вроде:

this.router.navigateByUrl(state).then(res => {
  if (!res) {
    this.router.navigateByUrl(state);
  }
});

Поскольку при сбое навигации возникает исключение, только когда Обещание решено как ложное, без исключения, из-за другой навигации отмените вашу навигацию.

Это решит мою проблему.