如何从角度5中的httpIntercepter重定向到登录页面

Question

I've built custom authIntercepter in Ionic 3 / angular 5. I wanna redirect to login page if token unauthorized in AuthIntercept but can't find a way to redirect to login page.

@Injectable()
export class AuthInterceptor implements HttpInterceptor {

    private authService: AuthService;

    constructor(private injector: Injector) {}

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        const started = Date.now();
        this.authService = this.injector.get(AuthService);
        request = request.clone({
            setHeaders: {
                Authorization: `Bearer ${this.authService.accessToken}`,
                'Content-Type': 'application/json'
            }
        });

        return next
            .handle(request)
            .do(event => {
                if (event instanceof HttpResponse) {
                    // do stuff with response if you want
                    const elapsed = Date.now() - started;
                    console.log(`Request for ${request.urlWithParams} took ${elapsed} ms.`);
                }
            }, err => {
                if (err instanceof HttpErrorResponse) {
                    if (err.status === 401) {
                        // redirect to the login route

                    }
                }
            });
    }
}

Thanks

---

Looks like there is no way to inject NavController in Intercepter. Here is what I found, though.

https://github.com/ionic-team/ionic/issues/13026

Answer 1

You can try to inject the App :

constructor(private injector: Injector,
            public appCtrl: App) {
}

And then to use it for navigation purposes like this:

this.appCtrl.getRootNavs()[0].setRoot('LoginPage')

or

this.appCtrl.getRootNavs()[0].push('LoginPage')