обработка ошибок в angular 5, отлавливать ошибки из API-интерфейса сервера во внешнем интерфейсе - PullRequest
Новая
       10

обработка ошибок в angular 5, отлавливать ошибки из API-интерфейса сервера во внешнем интерфейсе

0 голосов
/ 03 июля 2018

Мне нужен совет для обработки ошибок в интерфейсе веб-приложения. Когда я вызываю службу для get сообщества в соответствии с сообществом в веб-приложении, я хочу, чтобы он уловил ошибку. Например для отлова ошибок вроде 404.

Существует услуга для получения сообщества в соответствии с предоставленным идентификатором. 

 getCommunity(id: number) {
        return this.http.get(`${this.api}/communities/` + id + ``);
    }

, который вызывается в events.ts файле 

 setCommunityBaseUrl() {
        this.listingService.getCommunity(environment.communityId).subscribe((data: any) => {
            this.communityUrl = data.url + `/` + data.domain;
        });
    }

id предоставляется в среде. Допустим, всего есть 20 сообществ. Когда я предоставляю id = 1, появляются события в соответствии с community = 1. 

export const environment = {
    production: ..,
    version: 'v2',
    apiUrl: '...',
    organization: '...',
    websiteTitle: '...',
    communityId: 1,
    googleMapsApiKey: '...'
};

Проблема в том, что когда я предоставляю id = null, происходят все события сообщества | происходит весь список событий в бэкэнде.

Пожалуйста, помогите ^^

Ответы [ 2 ]

0 голосов
/ 04 июля 2018

Поскольку вы используете «.subscribe», вы можете создать свой собственный обработчик ошибок и перехватывать подобные ошибки прямо в методе.

Это пример того, как вы можете использовать это: 

constructor(
    private _suiteAPIService: SuitesAPIService,
    private _testcaseService: TestcaseService,
    public _tfsApiService: TfsApiService,
    private _notificationService: NotificationService) { }

  errorHandler(error: HttpErrorResponse) {
    return observableThrowError(error.message || "Server Error")
  }

  public something = "something";
  
  GetTestcasesFromSuiteSubscriber(Project, BuildNumber, SuiteId) {
    this._suiteAPIService.GetTestResults(Project, BuildNumber, SuiteId).subscribe(
      data => {
        console.log(data);
        this._testcaseService.ListOfTestcases = data;
        //Notofication service to get data. 
        this._notificationService.TestcasesLoaded();
      },
      error => {
        //Here we write som error 
        return this.something;
      }
    );
  }
0 голосов
/ 03 июля 2018

Когда вы подписываетесь, вы подписываетесь с шаблоном Observer. Итак, первая функция, которую вы передаете в 

.subscribe(() => {} );

срабатывает, когда Observable вызывает .next(...)

и после этого вы можете предоставить другую функцию, которая будет срабатывать всякий раз, когда Observable вызывает .error(...)

так 

.subscribe(() => {}, (error) => { handleTheError(error); } );

this.http.get(...); возвращает Observable, который вызовет .error(...) при ошибке http

Мы также знаем, что this.http.get(...) завершается или «ошибается», и это не бесконечная ошибка (та, которая никогда не завершается). Таким образом, вы можете сделать это обещание и манипулировать этим обещанием, как. 

async getMeSomething(...) { 
   try {
     this.mydata = await this.http.get(...).toPromise();
   }
   catch(error) { 
     handleTheError(error) 
   }
}

Но я действительно рекомендую использовать Swagger для своего бэкэнда, а затем сгенерировать класс клиента API с помощью NSwagStudio , чтобы вам не приходилось писать клиент вручную или настраивать его или разберись с ошибками. Я использую это все время, и это экономит нам огромное количество времени

...