Angular 6/7 Ionic 重定向到 URL 但关闭任何打开的模式 windows

Question

有没有办法重定向到 angular 6/7 中的 URL 并强制关闭任何打开的模式 windows 或者基本上只是替换整个页面使用新的 url?

原因：我有一个拦截器通过后端 API 检查 token/refresh 令牌，如果它确定令牌和刷新不再有效，它需要将用户重定向到登录页。如果用户在 "page" 上，这一切都可以正常工作。如果用户处于模式 window 例如编辑模式弹出窗口和对 API 的请求触发拦截器重定向，页面确实重定向到登录页面，但模式 window 仍然在顶部。

有没有办法强制重定向以呈现关闭所有打开模式的新页面？我没有从拦截器中引用模态。

我正在尝试其中之一：

this.router.navigateByUrl('/account/login');

和

this.navCtrl.navigateRoot('/account/login');

既不关闭模式也不替换整个页面。

谢谢

罗维

拦截器Class:

import { HttpInterceptor, HttpRequest, HttpHandler, HttpUserEvent, HttpEvent, HttpHeaders, HttpErrorResponse } from "@angular/common/http";
import { Observable, BehaviorSubject, throwError } from "rxjs";
import { switchMap, filter, take, catchError } from 'rxjs/operators';
import { Injectable, Injector } from "@angular/core";
import { Router } from "@angular/router";
import { NavController } from "@ionic/angular";
import { AuthService } from "./auth.service";


@Injectable()
export class AuthInterceptor implements HttpInterceptor {

    private isRefreshing = false;
    private refreshTokenSubject: BehaviorSubject<any> = new BehaviorSubject<any>(null);

    constructor(private router: Router, private navCtrl: NavController, private inj: Injector) { }

    intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {

        let authSrv = this.inj.get(AuthService);

        if (authSrv.AccessToken) {
            request = this.addToken(request, authSrv.AccessToken);
        }
        return next.handle(request).pipe(catchError(error => {
            if (error instanceof HttpErrorResponse) {
                switch (error.status) {
                    case 400:
                        return this.handle400Error(error);
                    case 401:
                        return this.handle401Error(request, next);
                    case 403:
                        return this.handle403Error(error);
                }
            }
            else {
                return throwError(error);
            }
        }));
    };

    private addToken(request: HttpRequest<any>, token: string) {
        let authSrv = this.inj.get(AuthService);
        return request.clone({
            setHeaders: {
                'Authorization': 'Bearer ' + authSrv.AccessToken
            }
        });
    }

    private handle400Error(error) {
        this.isRefreshing = false;
        if (error && error.status === 400 && error.error && error.error.error === 'invalid_grant') {
            // If we get a 400 and the error message is 'invalid_grant', the token is no longer valid so logout.
            let authSrv = this.inj.get(AuthService);
            authSrv.logout();
            this.router.navigateByUrl('/account/login');

        }
        return throwError(error);
    }

    private handle403Error(error) {
        //Forbidden - tried to load something not allowed - log the user out
        this.isRefreshing = false;
        let authSrv = this.inj.get(AuthService);
        authSrv.logout();
        this.router.navigateByUrl('/account/login');

        return throwError(error);
    }

    private handle401Error(request: HttpRequest<any>, next: HttpHandler) {

        if (!this.isRefreshing) {

            console.log('Refreshing token');

            this.isRefreshing = true;
            this.refreshTokenSubject.next(null);

            let authSrv = this.inj.get(AuthService);
            return authSrv.refrehToken().pipe(
                switchMap((token: any) => {
                    this.isRefreshing = false;
                    this.refreshTokenSubject.next(token.access_token);
                    console.log('Refreshing token - complete');
                    return next.handle(this.addToken(request, token.access_token));
                })
            )

        } else {
            return this.refreshTokenSubject.pipe(
                filter(token => token != null),
                take(1),
                switchMap(jwt => {
                    return next.handle(this.addToken(request, jwt));
                })
            )
        }
    }

}

Answer 1

我找到了解决我的问题的方法，如果它能帮助其他遇到同样问题的人的话。那就是重定向说登录页面，并为该重定向强制关闭任何模态对象：不漂亮但对我有用：

在我的拦截器 class 中，我需要强制用户进入登录页面，我创建了一个 closeModals 方法，它可以简单地找到所有离子模态对象并将它们从 DOM重定向之前。

快乐的日子。

private closeModals(){
    var modals = document.getElementsByTagName("ion-modal");
    [].forEach.call(modals, function (el:any) {
        el.parentNode.removeChild(el);
    });
}

Angular 6/7 Ionic 重定向到 URL 但关闭任何打开的模式 windows

Angular 6/7 Ionic redirect to a URL but close any open modal windows

angular

ionic4