angular - 在 Angular/Ionic 中重定向到 401 后登录

标签 angular ionic-framework error-handling

我有一个服务来处理我的 http 响应,理想情况下,我想设置它,以便每当收到 401 错误状态时,用户就会被发送到登录页面。我知道您不应该从服务中执行路由,但我希望有一种可以接受的模式,因为我想捕获所有 401。

@Injectable()

export class ResponseHandlerService implements OnInit {

  options: object;
  headers: any;

  constructor(
    private clientService: ClientService,
    private globalVarService: GlobalVariablesProvider,
    private toastCtrl: ToastController
    private navCtrl: NavController) {
  }

  ngOnInit() {
    this.headers = new Headers();
  }

  getOptions() {
    return this.globalVarService.getAuthToken().subscribe( token => {
      this.headers.append("authentication", token);
      this.options = new RequestOptions({ headers: this.headers });
    })
  }

  extractData(res: Response) {
    let body = res.json();
    return body.data || body || { };
  }

  private handleError = (error: Response | any) => {
    let errMsg: string;
    console.log("Error: ", error)
    if (error instanceof Response) {
      let body = error['_body'].substring(0, 200)
      console.log(body)
      errMsg = `${error.status} - ${error.statusText || ''} to ${error.url} - ${body}`
    } else {
      errMsg = error.message ? error.message : error.toString();
    }

    if ( error.status == 401 ) {
      this.clientService.handleResponse("Invalid authentication - Please sign in again")

      // does not work. states navCtrl has no provider
      this.navCtrl.setRoot(LoginPage)
    }

    console.log(errMsg);
    return Observable.throw(errMsg);
  }
}

最佳答案

将“ROUTER_PROVIDERS”作为提供者传递并在您的 ResponseHandlerService 中注入(inject)路由器,然后它将起作用。

bootstrap(AppComponent, [
   ROUTER_PROVIDERS,
   ResponseHandlerService
]);

关于angular - 在 Angular/Ionic 中重定向到 401 后登录,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48930471/

相关文章:

angular - 我如何为 Angular 2 中的开发(而非测试)提供模拟服务?

angular - 有没有办法使用 mat-autocomplete ,其中相应的输入在其父组件中?

javascript - 哪些类型的 Javascript (Angular2) 错误会阻止页面完成渲染

ios - Swift 单元测试从闭包内部抛出函数

django - 限制 Django 日志记录错误邮件在生产中不起作用

Angular |响应式 |自适应 |重置配置

amazon-web-services - 部署在 Amazon s3 上的 Angular 2 应用程序出现 404 错误

ionic-framework - MinDate 和 MaxDate 不适用于 Ionic 4 中的 native 日期选择器

javascript - Ionic 3 压缩图像

javascript - 基于 if 语句动态启用/禁用按钮 Ionic