Carlos Cifuentes
AngularJS → Angular reference

$httpProvider.interceptors in modern Angular

Interceptors become plain functions registered with provideHttpClient.

Before · AngularJS
$httpProvider.interceptors.push(function (AuthService) {
  return {
    request: function (config) {
      config.headers.Authorization = 'Bearer ' + AuthService.token;
      return config;
    }
  };
});
After · Angular
export const authInterceptor: HttpInterceptorFn = (req, next) => {
  const token = inject(AuthService).token();
  return next(token
    ? req.clone({ setHeaders: { Authorization: `Bearer ${token}` } })
    : req);
};

provideHttpClient(withInterceptors([authInterceptor]))

What changes

  • Requests are immutable: clone the request instead of mutating config.
  • responseError handling becomes catchError in the returned observable.
  • Order is explicit: interceptors run in the order of the array.

Migration tip. During the hybrid phase, requests from $http and from HttpClient go through different interceptors. Keep the token logic in one shared service that both call.

Related

Planning a migration or a micro-frontend platform?

In a 20-minute call you describe your situation and I tell you how I'd approach it. If it isn't worth doing yet, I'll say so.

Message me on LinkedIn