Intercepting HTTP Calls

Let's learn how Angular's RxJS integration lets you intercept and modify AJAX calls through 'HttpClient'.

Interceptors

In addition to return types and JSON parsing, HttpClient introduces interceptors, which is a tool that exposes any AJAX request made in the application for modification.

Let’s add two of these:

  • One, a conditional retry service, attempts to intelligently rerun failed HTTP requests behind the scenes before the user sees an error state and manually retries.

  • The other listens in to every request and on an unreconcilable error, cleanly displays an error message (as opposed to a flow-breaking alert or a silent failure).

The first step to building an interceptor is to generate a service to hold that structure.

Generate a new service with ng g service retry-interceptor and open it. Modify it to add the following:

Get hands-on with 1400+ tech skills courses.