首页 > 解决方案 > 带有登录模式的Angular 8拦截401

问题描述

我试图通过从应用程序中的任何位置输入登录详细信息来让用户继续他们离开的地方,但是,我没有令牌或刷新令牌,后端使用session cookie.

到目前为止,这是我尝试做的但没有成功的事情,使用HttpInterceptor,一旦响应为 401 我会显示一个 modal using ngx-bootstrap modal service

上面的部分相对有效,现在我不确定如何才能service/intercept请求失败的相同请求。

我试图在没有拦截器的情况下做同样的事情,但没有运气。

任何想法或例子都会很棒。


更新:我仍然无法让它工作retryWhen并没有帮助

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    return next.handle(req).pipe(
      retryWhen(errors =>
        errors.pipe(
          tap(errorStatus => {
            let OrgReq;
            console.log("tap: ", errorStatus);
            if (errorStatus.status === 401) {
              OrgReq = req.clone();
              this.authModalRef = this.modalService.show(AuthenticationComponent, this.initialState);  
              this.authModalRef.content.onLoggedIn.subscribe(loggedIn => {
                    console.log("has logged? ", loggedIn, OrgReq);
                    return next.handle(OrgReq);
                });
            }

            throw errorStatus;

          })
        )
      )
  );
}

我认为是因为在 the 之后第一个请求被取消订阅401next.handle()没有做任何事情

标签: angularrxjsngx-bootstrapangular-http-interceptorsngx-modal

解决方案


我认为 retryWhen 管道操作员会为您解决问题

https://www.learnrxjs.io/operators/error_handling/retrywhen.html

像这样的东西:

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

        let clone = req.clone()

        return next.handle(clone).pipe(

            retryWhen(err => {
                // You can filter based on the error
                const retryReq = confirm("Retry");
                if(retryReq)return next.handle(clone)
                else return OtherObservable
            })
        );
    }
}

您需要返回一个 Observable 总是 true 或 false 已解决


推荐阅读