angualr 이상 처리

3433 단어 angular
이틀 전 엔 angualr 프로젝트 의 프런트 를 통일 적 으로 처리 하려 고 했 는데 결국 이 계획 을 포 기 했 지만 이 를 통 해 많은 것 을 배 웠 고 글 을 써 서 기억 을 강화 할 필요 가 있 을 것 같 았 다.
Errorhandler
이번 을 통 해 저 는 예전 에 이상 에 대한 이해 에 도 문제 가 있 었 다 는 것 을 알 게 되 었 습 니 다.예전 에 여러 가지 잘못 이 모두 이상 이 라 고 생각 했 습 니 다.http 의 잘못 도 이상 이 라 고 생각 했 습 니 다.그리고 구 글 angualr 의 전체적인 이상 처 리 는 Errorhanler 를 소개 하 는 글 이 많 았 습 니 다.공식 문 서 는 다음 과 같 습 니 다.
집중 이상 처리 에 사용 할 연결 고 리 를 제공 합 니 다.
뜻 을 보면 자신의 요구 에 부합 되 고(http 오류 도 이상 한 상황 에서)사용 방법 도 간단 하 다.
이상 처리 클래스 를 정의 하고 이상 을 어떻게 처리 해 야 하 는 지 적어 주세요.
class MyErrorHandler implements ErrorHandler {
  handleError(error) {
    // do something with the exception
  }
}

이어서 Provider 를 설정 합 니 다:
@NgModule({
  providers: [{provide: ErrorHandler, useClass: MyErrorHandler}]
})
class MyModule {}

angular 의 간단 한 전역 이상 처리 가 완료 되 었 습 니 다.이상 처 리 를 더 완벽 하 게 하려 면 서버 에 이상 정 보 를 보 내 면 이 글 을 볼 수 있 습 니 다.
설정 이 끝 난 후에 자신의 http 오류 가 이 방법 을 전혀 촉발 하지 않 았 다 는 것 을 알 게 되 었 습 니 다.그러나 어떤 상황 에서 도 촉발 할 수 있 습 니 다.자신의 설정 이 틀 렸 다 는 것 을 설명 합 니 다.http 오류 가 이상 하지 않다 고 만 이해 할 수 있 습 니 다.
전문 servic 로 처리
그럼 http 이상 에 대해 서 는 어떻게 해 야 합 니까?angular 공식 문서 에 서 는 먼저 정 보 를 서비스 에 전달 한 다음 에 서비스 에서 이 이상 을 처리 합 니 다.
오류 처리
showConfig() {
  this.configService.getConfig()
    .subscribe(
      (data: Config) => this.config = { ...data }, // success path
      error => this.error = error // error path
    );
}

오류 정보 가 져 오기
private handleError(error: HttpErrorResponse) {
  if (error.error instanceof ErrorEvent) {
    // A client-side or network error occurred. Handle it accordingly.
    console.error('An error occurred:', error.error.message);
  } else {
    // The backend returned an unsuccessful response code.
    // The response body may contain clues as to what went wrong,
    console.error(
      `Backend returned code ${error.status}, ` +
      `body was: ${error.error}`);
  }
  // return an observable with a user-facing error message
  return throwError(
    'Something bad happened; please try again later.');
};

retry()
때로는 잘못 은 임시 적 인 것 일 뿐 다시 시도 하면 자동 으로 사라 질 수도 있다.예 를 들 어 모 바 일 장면 에서 네트워크 가 중단 되 는 상황 을 만 날 수 있 습 니 다.이런 상황 에서 우 리 는 그 로 하여 금 자동 으로 몇 번 다시 시도 하 게 할 수 있 습 니 다.angualr 는 우리 에 게 이런 방법 을 제공 해 주 었 습 니 다.
getConfig() {
  return this.http.get(this.configUrl)
    .pipe(
      retry(3), // retry a failed request up to 3 times
      catchError(this.handleError) // then handle the error
    );
}

그 러 려 면,이미 쓴 모든 방법 을 고 쳐 써 야 하 며,그다지 우아 하지 않다 고 느낀다.필요 없 을 것 같 아서.
차단기
그 다음 에 차단기 로 처리 하 는 방법 은 간단 하지만 이미 쓴 방법 에 대해 어떤 변경 도 할 필요 가 없다.
import { Injectable } from '@angular/core';
import {
  HttpRequest,
  HttpHandler,
  HttpEvent,
  HttpInterceptor,
  HttpResponse,
  HttpErrorResponse,
} from '@angular/common/http';
 
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/do';
 
@Injectable()
export class RequestInterceptor implements HttpInterceptor {
 
  constructor() {}
 
  intercept(request: HttpRequest, next: HttpHandler): Observable> {

    return next.handle(request).pipe(tap((event: HttpEvent) => {}, (err: any) => {
      if (err instanceof HttpErrorResponse) {
        // do error handling here
      }
    }));
  }
}

좋은 웹페이지 즐겨찾기