Questions tagged [angular-http-interceptors]

The interceptors are service factories that are registered with the `$httpProvider` by adding them to the `$httpProvider.interceptors` array. The factory is called and injected with dependencies (if specified) and returns the interceptor.

There are two kinds of interceptors (and two kinds of rejection interceptors):

  • request: interceptors get called with a http config object. The function is free to modify the config object or create a new one. The function needs to return the config object directly, or a promise containing the config or a new config object.
  • requestError: interceptor gets called when a previous interceptor threw an error or resolved with a rejection.
  • response: interceptors get called with http response object. The function is free to modify the response object or create a new one. The function needs to return the response object directly, or as a promise containing the response or a new response object.
  • responseError: interceptor gets called when a previous interceptor threw an error or resolved with a rejection.

For more information visit $http

875 questions
108
votes
5 answers

How to make an angular module to ignore http interceptor added in a core module

I do have a core module with an HttpInterceptor for authorization handling and I include this module in AppModule, in this way all the other modules that use HttpClient are using this interceptor. @NgModule({ imports: [], declarations: [], …
Alexandru Olaru
  • 6,842
  • 6
  • 27
  • 53
100
votes
1 answer

Add multiple HTTP Interceptors to Angular Application

How to add multiple, independent HTTP interceptors to an Angular 4 application? I tried to add them by extending the providers array with more than one interceptors. But only the last one is actually executed, Interceptor1 is ignored. @NgModule({ …
str
  • 42,689
  • 17
  • 109
  • 127
71
votes
11 answers

How to cancel/unsubscribe all pending HTTP requests in Angular 4+

How to cancel/abort all pending HTTP requests in angular 4+. There is an unsubscribe method to cancel HTTP Requests but how to cancel all pending requests all at once. Especially while route change. There is one thing I did ngOnDestroy() { …
Sibiraj
  • 4,486
  • 7
  • 33
  • 57
71
votes
4 answers

AngularJS Authentication + RESTful API

Angular+RESTful Client-side Communication w/ API for Auth/(re)Routing This has been covered in a few different questions, and in a few different tutorials, but all of the previous resources I've encountered don't quite hit the nail on the head. In…
53
votes
7 answers

How to add multiple headers in Angular 5 HttpInterceptor

I'm trying to learn how to use HttpInterceptor to add a couple of headers to each HTTP request the app do to the API. I've got this interceptor: import { Injectable } from '@angular/core'; import { HttpEvent, HttpInterceptor, HttpHandler,…
Fel
  • 4,428
  • 9
  • 43
  • 94
53
votes
1 answer

How to mock Angular 4.3 httpClient an error response in testing

I have a below interceptor auth-interceptor.service.ts import {Injectable, Injector} from '@angular/core'; import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http'; import {Observable} from…
51
votes
8 answers

How to cancel current request in interceptor - Angular 4

As you know it's possible to use Interceptors in new versions of Angular 4. In mine, I want to cancel a request in interceptor in some conditions. So is it possible? Maybe what I should ask is: which way I should do that? It'll also be OK if I find…
Behnam Azimi
  • 2,260
  • 3
  • 34
  • 52
37
votes
3 answers

How to handle unauthorized requests(status with 401 or 403) with new httpClient in angular 4.3

I have an auth-interceptor.service.ts to handle the requests import {Injectable} from '@angular/core'; import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http'; import {Observable} from…
29
votes
4 answers

Angular 4 Http Interceptor: next.handle(...).do is not a function

I created this HTTPInterceptor to be able to better handle http errors, it was working well before I did a git pull and ran npm install. This is my code: import {Injectable} from '@angular/core'; import {HttpEvent, HttpInterceptor, HttpHandler,…
Multitut
  • 2,089
  • 7
  • 39
  • 63
24
votes
2 answers

Order of HttpInterceptors

I have a application that uses a plugin that register a HttpInterceptor. Now I need to create my own interceptor that need to be run before the other interceptor because it will change some values, in localStorage, that the other interceptor…
Fernando
  • 2,131
  • 3
  • 27
  • 46
23
votes
3 answers

Disable Angular HttpInterceptor for some call

I have an angular application with an HttpInterceptor that catch the http errors to show some dialog, common to all my application. I would like to disable the interceptor for some specific calls but I prefer to disable the default behaviour where…
Davide C
  • 830
  • 2
  • 11
  • 21
23
votes
8 answers

Angular 5 Http Interceptors error when injecting service

I am receiving the following strange dependency injection behavior when using custom HttpInterceptors in angular 5+. The following simplified code works fine: export class AuthInterceptor implements HttpInterceptor { constructor(private…
dev7
  • 6,259
  • 6
  • 32
  • 65
22
votes
6 answers

Angular 6 - Why is Bearer Token missing in production build? (works fine in dev build)

I'm using Angular 6 with an HTTP Interceptor configured to apply bearer token to outgoing requests. In the dev build (ng serve), the token is applied and everything works fine. :-) In the production build (ng serve --prod) the request is sent out…
BizzyBob
  • 12,309
  • 4
  • 27
  • 51
22
votes
5 answers

How to send JWT token as authorization header in angular 6

Currently I used this static code in component .ts file but this one is not work. It returns unauthorized(401). But when I pass token as query string it works fine. Please give a working example for component .ts file. import { HttpClient,…
Sumit
  • 1,702
  • 2
  • 14
  • 20
21
votes
1 answer

what does the multi: true attribute of HTTP_INTERCEPTORS mean?

I'm new to Angular and I've just built an interceptor. According to multiple tutorials you have to include the HTTP_INTERCEPTORS in the app.module like so: providers: [{ provide: HTTP_INTERCEPTORS, useClass: MyInterceptor, multi: true }] I was…
Maurice
  • 6,698
  • 9
  • 47
  • 104
1
2 3
58 59