Упражнение 4: Решение

Продолжительность: 8 мин

В этом уроке мы разберём решение четвёртого упражнения, в котором нужно было построить диаграмму последовательности (Sequence Diagram) для процесса обновления статуса заказа в реальном времени. Вот пример решение которое может получиться у вас: Exercise 4 solution Diagram

Последовательность начинается с того, что клиент оформляет заказ через веб-приложение. После отправки заказа:

  1. Web App → Core API — отправляется запрос на создание заказа.
  2. Core API → Web App — API возвращает channelId, уникальный идентификатор канала событий.
  3. Web App → WebSocket Server — приложение использует channelId, чтобы подписаться на канал обновлений.

На этом этапе клиентский интерфейс готов принимать события о статусе заказа.

Далее запускается цикл обновления в реальном времени. Этот цикл продолжается, пока соединение с WebSocket-сервером активно:

  • WebSocket-сервер отправляет события об изменении статуса заказа.
  • Веб-приложение получает их и обновляет UI клиента.

Если соединение с WebSocket-сервером обрывается, мы выходим из цикла. С этого момента начинается альтернативный механизм:

  • веб-приложение периодически запрашивает у Core API текущий статус заказа,
  • получает ответ,
  • обновляет интерфейс пользователя.

Этот подход менее эффективен, чем WebSocket-ы, но обеспечивает надёжность и непрерывность получения данных.

Это платный урок

Купите полный доступ к курсу чтобы просматривать данный контент

Основы архитектуры фронтенда

Изучите основы проектирования современных, высоконагруженных фронтенд-приложений.

3990 Скидка 75%
990

Безопасные платежи обрабатываются сервисом Юкасса

Комментарии

Войдите, чтобы оставить комментарий