Обычно в приложениях angular нет необходимости проверять каждый HTTP-запрос, который проходит через приложение, если вы действительно этого не хотите. А если вы хотите проверять каждый входящий и исходящий HTTP-запрос, Angular предоставляет замечательную функцию, которая входит в состав Angular HttpClient: и является перехватчиком. Это очень похоже на концепцию промежуточного программного обеспечения с такой структурой, как Express, за исключением того, что это интерфейс.

Ниже представлен интерфейс HttpInterceptor.

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

Фильтрация определенных HTTP-запросов во время выполнения

Когда запускается приложение angular, существуют ограниченные способы выполнения порядка HTTP-запросов, которые запускаются во время запуска приложения. И хотя вам удается выровнять сетевые вызовы в определенной последовательности, все же остается место для ошибки, когда некоторые HTTP-запросы могут срабатывать до определенного HTTP-запроса по вашему выбору.

В качестве небольшого примера предположим, что в вашем приложении каждый HTTP-запрос должен содержать определенный Заголовок запроса (special-http-header: X) в запросе, но HTTP-запрос (HTTP-запрос A), который предоставляет значение ответа на special-http-header, выполняется с миллисекундной задержкой во время запуска приложения. , где был запущен другой набор HTTP-запросов, но special-http-header: X не приводил к сбою приложения. (Из-за воображаемого факта, что серверные конечные точки настроены для приема HTTP-запросов, которые содержат только special-http-header: X)

Так что, если это так, и вы испробовали всю магию и не смогли выполнить HTTP-запрос A первым среди всех HTTP-запросов, тогда реализация на основе очереди поможет вам.

Угловая тема спешит на помощь

В моем сценарии мне удалось справиться с этим, используя Angular HTTP Interceptor наряду с использованием Angular Subjects, что привело к реализации на основе очереди для Interceptor. Что привело к следующим фактам.

  1. Каждый раз, когда HTTP-запрос запускается из приложения, на уровне перехватчика выполняется простая проверка, которая проверяет, содержит ли текущий HTTP-запрос уникальный HTTP-заголовок (access-granting-header ).
  2. Если HTTP-запрос не содержит указанного выше уникального заголовка, HTTP-запрос помещается в массив типа HTTPRequest.
  3. Аналогичным образом, пока не поступит HTTP-запрос, содержащий access-granting-header, каждый HTTP-запрос, который запускается до того, как он будет помещен в очередь запросов и приостановлено.
  4. Когда, наконец, поступает HTTP-запрос, содержащий access-granting-header, значения для special-http-header: X извлекается из HTTP-ответа, а предыдущая очередь запросов обрабатывается, когда каждый сетевой вызов запускается снова с помощью special-http-header: X добавляется к каждому заголовку запроса.
  5. Наконец, когда значения special-http-header: X наконец установлены, теперь каждый HTTP-запрос, который запускается в приложении, которое загружается лениво, теперь запускается с special-http-header: X добавлен к заголовку запроса.

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

Создание перехватчика

Давайте разберем важные части вышеупомянутой реализации. Прежде всего, нам нужен специальный HTTP-запрос с известным HTTP-заголовком, где мы можем только идентифицировать и позволить перехватчику пройти через определенный заголовок, содержащий HTTP-запрос, и продолжить остальное.

Точно так же мы можем проверять каждый HTTP-запрос при запуске приложения, нужно ли сначала выполнить правильный HTTP-запрос. В противном случае HTTP-запрос должен быть помещен в Очередь HTTP-запросов (массив). Как только перехватчик получает правильный HTTP-запрос, HTTP-запрос выполняется, и значения данных special-http-header: X извлекаются из HTTP-ответа. Как только данные ответа собраны, происходит только волшебство.

После проверки настраиваемого HTTP-ответа ответ перехватчика запускает поток Subject, указывающий, что очередь HTTP-ответов должна быть разрешена. После запуска потока поток Subject будет перебирать ранее сложенную очередь HTTP-запросов / массив HttpRequest и запускать разрешение каждого HTTP-запроса с помощью special-http-header: X заголовок добавляется к заголовку каждого сетевого вызова.

Добавить перехватчик к поставщикам

QueueInterceptor - это класс Interceptor, который мы будем использовать для включения механизма на основе очереди для HTTP-запросов, которые будут находиться в разделе провайдеры в классе Module.

Добавить фиктивную службу с поддельными HTTP-вызовами

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

Заключение

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

Если вы проверите журналы, вы увидите, что есть несколько HTTP-вызовов, которые запускаются перед соответствующим вторым HTTP-запросом, и это второй HTTP-запрос, который выполняется сначала, а затем остальная часть ранее запущенные HTTP-вызовы разрешаются из очереди.

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



Удачного кодирования :)