web-dev-qa-db-fra.com

RXJS 6: nouvelle version de HttpInterceptor

Je suis en train d'ajouter rxjs_compat à mon projet afin de passer à la v6 des bibliothèques.

Cependant, la variable HttpInterceptor existante pour la gestion des erreurs globales ne se compile plus. Je ne sais pas où aller avec ça. J'ai essayé toutes sortes. Obtenir des correspondances de type avec tout essayé.

import { Injectable } from "@angular/core";
import {
  HttpEvent,
  HttpInterceptor,
  HttpHandler,
  HttpRequest,
  HttpResponse,
  HttpErrorResponse
} from "@angular/common/http";
import { Observable, of, empty } from "rxjs";
import { ToastrService } from "ngx-toastr";
import { environment } from "../../environments/environment";
import { catchError, map } from "rxjs/operators";

@Injectable()
export class HttpErrorInterceptor implements HttpInterceptor {
  constructor(private toastr: ToastrService) {}
  intercept(
    request: HttpRequest<any>,
    next: HttpHandler
  ): Observable<HttpEvent<any>> {
    return next.handle(request).pipe(
      catchError(err => of(HttpErrorResponse)),
      map(err => {
        let message: string;
         this.toastr.error(`${message}`, "Application Error");
        return Observable.empty<HttpEvent<any>>();
      })
    );
  }
}

src/app/shared/http-erreur-interceptor.ts (26,27): erreur TS2339: La propriété 'vide' n'existe pas sur le type 'typeof Observable'.

empty est maintenant une constante, mais n'accepte pas de type, donc cela ne fonctionne pas non plus. Impossible également de trouver beaucoup dans les notes de mise à niveau

MODIFIER

bien qu'intéressant cela compile:

return Observable.of<HttpEvent<any>>();
angulartypescriptrxjsangular6rxjs6
7
jenson-button-event

  1. import {EMPTY} from 'rxjs';

  2. Remplacez Observable.empty() par 

    return EMPTY;

15
Yakov Fain

Impossible de trouver comment renvoyer quelque chose que le compilateur accepte, mais au moins capable de générer une erreur. Le code est compilé et fonctionne, mais en tant que débutant dans Rxjs, il n’est pas sûr qu’il soit correct.

  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const xhr = req.clone({
      headers: req.headers.set('X-Requested-With', 'XMLHttpRequest')
    });
    return next.handle(xhr).pipe(
      catchError((err) => {
        if (err instanceof HttpErrorResponse) {
          if (err.status === 401) {
            this.router.navigate(['/login']);
          } else {
            this.snack.open('Communication error: ' + err.status + ' - ' + err.statusText, null,
             {duration: 5000, panelClass: 'snack-error', verticalPosition: 'top'});
          }
          return throwError('backend comm error');
        }
      })
    );
  }
1
Arthur