Angular 2+ HttpErrorResponse не возвращает правильный статус в течение тайм-аута - PullRequest
Новая
       16

Angular 2+ HttpErrorResponse не возвращает правильный статус в течение тайм-аута

0 голосов
/ 13 марта 2019

Так что я использую httpClient.get () для вызова REST.Я настроил API, чтобы он возвращал время ожидания 504.

Когда я смотрю на Google devTools, я вижу, что вызов сделан, и статус 504. Но когда я отлаживаю свой код, HttpErrorResponse я получаюимеет статус 0.

Я также настроил API для возврата ответа 400, и при отладке этого кода статус ответа был 400. Почему распространяется 400, а 504 нет?

Мы используем Angular 6.0.6

Ответы [ 2 ]

0 голосов
/ 15 марта 2019

Оказывается, наш шлюз API не был настроен правильно, и мы не возвращали правильные заголовки. 

'Access-Control-Allow-Methods': 'POST,GET,OPTIONS',
'Access-Control-Allow-Origin': '*', 
'Access-Control-Allow-Headers': 'Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token',
0 голосов
/ 13 марта 2019

Лучший способ сделать это - реализовать обработчик ошибок.В моем случае у меня есть общий класс для выполнения HTTP-вызовов, и все сервисы (например, EmployeeService, SupplierService и т. Д.) Будут взаимодействовать с общим API для выполнения вызовов Rest API.Ниже приведен пример кода, который обрабатывает ошибку.Вот что вы увидите, если код состояния HTTP равен 404.

Ошибка на стороне сервера - Код: 404 Сообщение: Http-сообщение об ошибке для http://localhost:5000/apiv1/account: 404 Не найдено

Вот так выглядит моя общая служба. 

@Injectable({
  providedIn: 'root'
})

export class ApiService {

  getUrlvalue: string;
  constructor(private http: HttpClient) { }


  private formatErrors(error: any) {
    let errorMessage = '';
    if (error.error instanceof ErrorEvent) {
      errorMessage=`Client side Error: ${error.error.message}`;
    } else {
      errorMessage=`Server side Error - Code: ${error.status}\nMessage: ${error.message}`;
    }

    console.log(errorMessage);
    return throwError(error.error);
  }


  get(path: string, params: HttpParams = new HttpParams()): Observable<any> {
    //console.log(`${environment.api_url}${path}`);
    this.getUrlvalue = `${environment.api_url}${path}`;
    console.log('API service get request is making to : ' + this.getUrlvalue);

    return this.http.get(this.getUrlvalue, { params })    //, { params }
      .pipe(  
      catchError(this.formatErrors)
    
      );
  }

  put(path: string, body: Object = {}): Observable<any> {
    console.log(`${environment.api_url}${path}`);
    return this.http.put(
      `${environment.api_url}${path}`,
      JSON.stringify(body), httpHeaderOptions
    ).pipe(catchError(this.formatErrors));
  }

  post(path: string, body: Object = {}): Observable<any> {
    console.log(`${environment.api_url}${path}`);
    return this.http.post(
      `${environment.api_url}${path}`,
      JSON.stringify(body), httpHeaderOptions
    ).pipe(catchError(this.formatErrors));
  }

  delete(path): Observable<any> {
    console.log(`${environment.api_url}${path}`);
    return this.http.delete(
      `${environment.api_url}${path}`
    ).pipe(catchError(this.formatErrors));
  }

}

Из другой сервисной ссылки AccountService таков вызов простого HTTP Get 

@Injectable({
  providedIn: 'root'
})
export class AccountService {

  // private http: HttpClient
  constructor(private apiService: ApiService) { }

  getAccounts(): Observable<Deal[]> {

    return this.apiService.get('/account')
      .pipe(
        tap(deals => console.log('fetched Accounts 111111')),
        catchError(this.handleError('getAccounts', []))
      );
  }
...