Comment gérer les requêtes non autorisées(statut auprès de 401 ou 403) avec de nouveaux httpClient angulaire 4.3
J'ai un auth-interceptor.service.ts
pour gérer les demandes
import {Injectable} from '@angular/core';
import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
import {Observable} from 'rxjs/Observable';
import {Cookie} from './cookie.service';
import {Router} from '@angular/router';
@Injectable()
export class AuthInterceptor implements HttpInterceptor {
constructor(private router: Router) {}
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
//Clone the request to add the new header.
const authReq = req.clone({headers: req.headers.set(Cookie.tokenKey, Cookie.getToken())});
//Pass on the cloned request instead of the original request.
return next.handle(authReq).catch(this.handleError);
}
private handleError(err: HttpErrorResponse): Observable<any> {
console.log(err);
if (err.status === 401 || err.status === 403) {
Cookie.deleteUser();
this.router.navigateByUrl(`/login`);
return Observable.of(err.message);
}
//handle your auth error or rethrow
return Observable.throw(err);
}
}
Mais j'obtiens l'erreur suivante. Rien ne se passe vraiment comme il ne supprime pas les cookies ou qu'il n'a pas naviguer à la page de connexion
Toute aide ou suggestion serait appréciée.
HttpClient prend en charge les intercepteurs. Vous devriez l'utiliser pour gérer les erreurs de manière transparente, au lieu de forcer tous les de votre code pour utiliser ApiService au lieu de HttpClient directement.
J'ai aussi un auth intercepteur. J'ai mis à jour le post. C'est que l'endroit à traiter de telles demandes? Tout exemple de code??
si vous allez avec votre méthode, vous allez avoir à envelopper l'ensemble du service http. Je recommande soit à l'aide d'un intercepteur ou d'étendre le service http et en remplaçant la demande de la méthode.
J'ai aussi un intercepteur pour ajouter un en-tête à chaque demande. Je ne suis pas sûr de la façon de gérer la réponse de toute demande de l'intercepteur. J'ai mis à jour le post
ajout d'un exemple d'une réponse
J'ai aussi un auth intercepteur. J'ai mis à jour le post. C'est que l'endroit à traiter de telles demandes? Tout exemple de code??
si vous allez avec votre méthode, vous allez avoir à envelopper l'ensemble du service http. Je recommande soit à l'aide d'un intercepteur ou d'étendre le service http et en remplaçant la demande de la méthode.
J'ai aussi un intercepteur pour ajouter un en-tête à chaque demande. Je ne suis pas sûr de la façon de gérer la réponse de toute demande de l'intercepteur. J'ai mis à jour le post
ajout d'un exemple d'une réponse
OriginalL'auteur Sai Ram Gupta | 2017-09-02
Vous devez vous connecter pour publier un commentaire.
Vous devez utiliser votre intercepteur et simplement y faire face comme ceci:
pas besoin pour le service http wrapper.
pour utiliser le routeur, vous aurez besoin d'une usine comme fournisseur de:
où jamais vous êtes en fournissant de l'intercepteur (probablement app.le module). ne pas utiliser une flèche de la fonction. ils ne sont pas pris en charge dans l'usine de fonctions lorsque vous essayez de construire pour la prod.
De travail plunk: https://plnkr.co/edit/UxOEqhEHX1tCDVPDy488?p=preview
this.router
pas défini. J'ai mis à jour le post avec la réponse. Merci beaucoup pour l'aide.vous avez besoin d'une usine de fonctionner pour fournir une httpinterceptor et injec le routeur... voir cette github gist.github.com/mrgoos/45ab013c2c044691b82d250a7df71e4c
mise à jour de ma réponse.
Je crois que c'est pour utiliser le routeur dans un intercepteur, http intercepteurs sont enregistrées avant que le routeur ne peut donc pas être injecté sans cause angulaire du hierarchichal injecteurs
Ouais c'est vrai, je viens de recevoir le même message d'erreur. Semble que j'ai besoin d'une usine de la fonction, comme dans les gist lien que vous avez fourni.
OriginalL'auteur bryan60
De l' @bryan60 suggestion j'ai fait quelques changements à sa solution
Dans l'app.le module.ts:
et dans auth-intercepteur.service.ts:
Si vous utilisez AOT dans la construction d'essayer:
Ouais merci pour l'info. C'est le seul endroit ou j'ai fais comme ça et c'est importé directement d'application du module. J'ai fait en sorte aucun autre module n'importations de l'intercepteur.
OriginalL'auteur Sai Ram Gupta
ci-dessus @bryan60 réponse est fonctionne bien , si tout face à un problème comme moi avec capture de l'erreur en dessous de la ligne
à l'aide de n'() traitement de l'erreur(si vous en face d'un problème avec catch())
importer dans le fichier:
gérer l'erreur:
J'espère que c'est aider quelqu'un.
OriginalL'auteur yala ramesh