angular - 以角度全局处理 HTTP 错误
问题描述
我正在从事http 错误处理。我已经在每个组件中编写了错误处理,这不是一个好的编码实践。所以我决定写一个全局通用的http错误处理。我已经搜索过了,我遇到了http-interceptor
概念,我认为存在更好的方法来处理HTTP错误。我在每个组件中尝试过的内容如下,而不是我需要一个全局方法。我已经有 http-interceptor 文件,代码是我在下面粘贴的。
组件.ts:
this.serviceName.methodName().catch(err => {
console.log("Something went wrong with the request, please try again.");
return Observable.throw(err.message.toUpperCase() || 'API_ERROR');
}).subscribe((res) => {
console.log(res);
},
error=>{
this.openSnackBar('danger', "Something went wrong with the request, please try again.");
});
http拦截器:
import { Injectable } from "@angular/core";
import { HttpInterceptor, HttpRequest, HttpHandler, HttpEvent, HttpResponse } from "@angular/common/http";
import { Observable } from "rxjs";
import { tap } from 'rxjs/operators';
@Injectable()
export class HttpErrorInterceptor implements HttpInterceptor {
constructor() { }
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return next.handle(request).pipe(tap(
event => event instanceof HttpResponse ? 'succeeded' : '',
err => 'failed'
))
}
}
请帮忙。谢谢。
解决方案
试试这个:
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
return next.handle(request).pipe(tap(
event => event instanceof HttpResponse ? 'succeeded' : '',
err => {
this.openSnackBar('danger', "Something went wrong with the request, please try again.");
}
))
}
推荐阅读
- c++ - C ++如何暂停控制台输出,以便用户在继续之前可以阅读信息
- python-3.x - 使用 mayavi 绘制 3D 网络时删除节点
- android - 如何有效地在一项活动中使用多个水平回收站视图?
- php - 为什么在 Elasticsearch 7 中创建索引时创建映射会导致文档被索引时映射更新被拒绝?
- ios - 为导航栏后退按钮和后退按钮文本设置不同的颜色
- react-native - 使导航可用于 React Native 应用程序中的所有组件
- python - os.environ python 如何获取默认用户环境变量
- sql - Postgres:如果我们多次选择一个计算列,Postgres 会一次又一次地计算它吗?
- javascript - 仅当关键字是单独的而不是另一个单词的一部分时,如何替换关键字?
- amazon-web-services - 多个证书与多个域名合二为一 - AWS Certificate Manager