Я думал, что поделюсь общим кодом, который использую для обработки нескольких целей запроса с настраиваемым заголовком для разных целевых конечных точек.

Давайте начнем с понимания простой задачи, которую выполняет класс перехватчика.
Перехватчик будет иметь метод, называемый перехватом, и он будет получать 2 аргумента.

intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>>

Когда нам нужен перехватчик?
Мой личный ответ: когда у нас есть исходящие HTTP-запросы.

Что мы делаем внутри перехватчика?

Большинство перехватчиков преобразуют исходящий запрос перед передачей его следующему перехватчику в цепочке, вызывая next.handle(transformedReq).

Таким образом, мы собираемся изменить запрос перед его отправкой.

В этом примере у нас будет 3 файла:
environment.ts
api.service.ts
interceptor.service.ts

Начнем с окружающей среды.

//src/environments/environment.ts
export const environment = {
    api: 'api.mybackend.com',
    analyticsApi: 'api.myanalytics.io',
    monitorApi: 'api.mymonitor.co',
    //....
};

Для примера у нас будет 3 разных места назначения для наших запросов, и они могут меняться в зависимости от среды.

Наш пример службы для выполнения вызовов API.

Теперь давайте создадим наш перехватчик.

Что здесь делает наш перехват?
Мы проверяем, начинается ли URL-адрес запроса с определенной конечной точки, и возвращаем next.handle с правильным обработчиком.

Внутри обработчика мы заменяем строку URL-адреса, удаляя ненужный текст, и создаем новый URL-адрес, используя нашу среду, которая может изменяться в режиме продуктов, поэтому мы готовы обработать эти изменения.

Затем мы устанавливаем пользовательские заголовки для нашей другой цели и, наконец, возвращаем новый объект запроса.

Я надеюсь, что этот пример заставит вас просматривать http-запрос и позволит вам создавать более надежные приложения angular, которые легко поддерживаются.

Вы можете разделить этот код на более мелкие части, разделив службу на службу для каждого API (api.service.ts, monitor.service.ts, analytics.service.ts).

Если ваш перехватчик становится больше, подумайте о создании пользовательских классов для ваших обработчиков.

Дайте мне знать, если есть темы, которые вы хотели бы, чтобы я затронул.

Спасибо за чтение и удачи.