web-dev-qa-db-fra.com

Angular 4 Http Interceptor: next.handle (...). Do n'est pas une fonction

J'ai créé cet HTTPInterceptor pour pouvoir mieux gérer les erreurs http, il fonctionnait bien avant de faire un pull et de lancer l'installation npm.

Ceci est mon code:

import {Injectable} from '@angular/core';
import {HttpEvent, HttpInterceptor, HttpHandler, HttpRequest, HttpResponse} from '@angular/common/http';
import {Observable} from "rxjs";
import {ToasterService} from "angular2-toaster";

@Injectable()
export class GobaeInterceptor implements HttpInterceptor {
    constructor(private toasterService: ToasterService){
    }
    intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
        return next.handle(req)
            .do(event => {
                if (event instanceof HttpResponse) {
                    let response = event.body;
                    if(response.Error){
                        this.toasterService.pop('error', 'Error '+response.Code, response.Message);
                    }
                }
            });
    }
}

Et c'est l'erreur que j'obtiens:

TypeError: next.handle (...). Do n'est pas une fonction sur GobaeInterceptor.webpackJsonp .../../../../../../../../../../../../../../../../../. intercept (gobae.interceptor.ts: 12) sur HttpInterceptorHandler.webpackJsonp .../../../common /@angular/common/http.es5.js.HttpInterceptorHandler.handle (

Quelque chose qui peut affecter mon code a-t-il changé récemment? que puis-je faire maintenant pour "attraper" la réponse http sur mon intercepteur?

28
Multitut

Cette erreur est générée car il manque l'opérateur do. L'importation ci-dessous corrige l'objet observable avec l'opérateur do.

import 'rxjs/add/operator/do';

Les RxJs ne sont pas fournis avec toutes les fonctions d'opérateur par défaut pour réduire la taille de la bibliothèque. Vous devez importer les opérateurs que vous souhaitez utiliser individuellement.

51
user8510992

rxjs 6/angular 6 aura besoin du tuyau

return next.handle(req).pipe(
  tap(event => {
    if (event instanceof HttpResponse) {
      ...
    }
  })
);
19
Shawn Palmer

Vous devez utiliser import.

import 'rxjs/add/operator/do';
import 'rxjs/add/operator/catch';
import 'rxjs/Observable';
import 'rxjs/add/observable/throw';
8
Hebert Godoy

J'ai fini par changer l'opérateur à partir de ceci:

next.handle(req).do

Pour ça:

next.handle(req).subscribe

Il paraît que:

  1. Les opérateurs de rxjs ne sont plus chargés par défaut

  2. Depuis Angular a implémenté des observables sur les appels HTTP, subscribe est le bon choix

0
Multitut