Система push-уведомлений в прогрессивном веб-приложении для транспортной компании
Автор: Мамажакыпова Г.Т., Эргешалиев Д.И.
Журнал: Бюллетень науки и практики @bulletennauki
Рубрика: Технические науки
Статья в выпуске: 6 т.12, 2026 года.
Бесплатный доступ
Рассматриваются принципы разработки и внедрения системы push-уведомлений в прогрессивном веб-приложении (PWA), созданном для транспортной компании “NUR Express” с использованием современных технологий: React на стороне клиента, Node.js для серверной логики и PostgreSQL для хранения данных. Описывается архитектура системы, механизмы взаимодействия компонентов и особенности реализации push-уведомлений с использованием Service Worker и Web Push API. Приводятся примеры практического применения в транспортно-логистической системе. Результаты исследования показывают, что внедрение push-уведомлений значительно повышает скорость информирования пользователей и эффективность взаимодействия с системой.
PWA, push-уведомления, Service Worker, Web Push API, веб-приложение
Короткий адрес: https://sciup.org/14138237
IDR: 14138237 | УДК: 004.4'236 | DOI: 10.33619/2414-2948/127/26
A Push Notification System in a Progressive Web Application for a Transport Company
This article examines the principles of developing and implementing a push notification system in a progressive web application (PWA) created for the NUR Express transport company using modern technologies: React on the client side, Node.js for server-side logic, and PostgreSQL for data storage. It describes the system architecture, the mechanisms for component interaction, and the specifics of implementing push notifications using Service Worker and the Web Push API. Examples of practical application in a transportation and logistics system are provided. The results of the study demonstrate that implementing push notifications significantly improves the speed of user notifications and the efficiency of interaction with the system.
Текст научной статьи Система push-уведомлений в прогрессивном веб-приложении для транспортной компании
Бюллетень науки и практики / Bulletin of Science and Practice
УДК 004.4'236
Современные веб-приложения стремятся обеспечить взаимодействие с пользователем на уровне, сопоставимом с нативными мобильными приложениями [1].
Одним из ключевых элементов этого взаимодействия являются push-уведомления, позволяющие быстро доставлять информацию без активного участия пользователя. Эта технология особенно актуальна в транспортных и логистических системах, где своевременная оповещение о статусе доставки, изменениях маршрута или задержках играет важную роль. Поэтому существует необходимость в разработке эффективной системы push-уведомлений для прогрессивных веб-приложений [2].
Актуальность данной темы определяется следующими факторами: рост использования прогрессивных веб-приложений (PWA); потребность в быстром обмене информацией в режиме реального времени; рост объёма логистических операций; необходимость снижения нагрузки на сервер за счёт асинхронных уведомлений [4].
Использование push-технологий может значительно улучшить качество обслуживания пользователей и оптимизировать бизнес-процессы.
Цель нашего исследования - является разработка и экспериментальная проверка системы push-уведомлений для прогрессивного веб-приложения транспортной компании.
Для достижения поставленной цели в рамках исследования были решены следующие задачи: проведён анализ принципов функционирования push-уведомлений в прогрессивных веб-приложениях, выполнено проектирование архитектуры системы push-уведомлений, реализован механизм подписки пользователей на уведомления, разработан и внедрён серверный механизм отправки push-уведомлений, а также проведена оценка эффективности разработанной системы.
Методы и методология исследования
При разработке системы push-уведомлений для ранее созданного прогрессивного вебприложения (PWA) транспортной компании “NUR Express” был использован комплексный подход, сочетающий теоретические и практические методы исследования, направленные на обеспечение эффективности, масштабируемости и надежности разработанной системы [5].
Методологической основой для веб-приложения послужило использование технологий Service Worker и Web Push API, которые обеспечивают реализацию механизма push-уведомлений и возможность работы приложения в автономном режиме [6].
Service Worker используется в качестве промежуточного слоя между клиентским приложением и сервером, перехватывает сетевые запросы, кэширует ресурсы и обрабатывает входящие push-сообщения. Это обеспечивает стабильную работу веб-приложения даже при нестабильном интернет-соединении и повышает скорость загрузки за счет локального хранения данных [7].
Web Push API используется для доставки уведомлений с сервера на клиентское устройство пользователя. Эта технология регистрирует подписку пользователя, создает уникальный push-токен, а затем отправляет уведомления через push-сервис браузера [7].
Интеграция Service Worker и Web Push API в архитектуру PWA транспортной компании позволяет реализовать систему быстрого информирования пользователей о статусе заказа, изменениях маршрута и других логистических событиях в режиме реального времени. Это повышает эффективность взаимодействия с клиентами и снижает нагрузку на сервер благодаря асинхронной модели доставки данных.
Результаты исследования и их обсуждение
Прогрессивное веб-приложение (PWA) — это современный подход к веб-разработке, сочетающий в себе преимущества веб-сайтов и нативных приложений. Использование PWA для веб-приложения транспортной компании обеспечивает высокую производительность, возможность установки на устройство пользователя без загрузки из магазинов приложений, а также поддержку работы в автономном режиме благодаря кэшированию данных и сервисным работникам. Внедрение технологии PWA предоставляет диспетчерам, водителям и клиентам удобный доступ к системе через браузер, независимо от типа устройства. Дополнительным преимуществом является интеграция push-уведомлений, позволяющая пользователям быстро получать обновления о статусе заказов и системных событиях.
В этом веб-приложении “NUR Express” выделяет три основные категории пользователей, получающих push-уведомления: диспетчеры, водители и клиенты. Диспетчеры работают через веб-интерфейс на персональных компьютерах, используя современные браузеры. В их задачи входит создание и обработка заказов, назначение водителей, а также мониторинг и координация транспортных операций в режиме реального времени. Водители взаимодействуют с системой через мобильные устройства, используя веб-браузеры на платформах Android и iOS. Они получают push-уведомления, содержащие информацию о новых заказах, изменениях маршрута и оповещениях о статусе их груза и транспортных средств. Клиенты используют веб-приложение для отслеживания статуса своего груза и получения уведомлений о доставке. Доступ к системе возможен как с мобильных устройств, так и с персональных компьютеров. Все категории пользователей работают в рамках единой информационной системы, но в зависимости от их роли реализован дифференцированный пользовательский интерфейс и механизм доставки уведомлений. Такой подход обеспечивает персонализированное взаимодействие и повышает эффективность управления логистическими процессами в транспортной компании.
Архитектура приложения часто определяется текущей структурой push-уведомлений браузера. В дополнение к основному веб-приложению в браузере пользователя регистрируется отдельная программа — Service Worker. Service Worker — это фоновый скрипт браузера, обеспечивающий обработку push-уведомлений, кэширование данных и выполнение сетевых запросов независимо от состояния веб-приложения. Это работает даже когда сам браузер закрыт, то есть уведомления можно получать, даже когда веб-приложение не запущено на устройстве пользователя. После регистрации в системе Service Worker подписывается на браузер пользователя для получения уведомлений, а затем на сервер отправляется специальный объект подписки. Объект подписки содержит всю необходимую информацию для отправки уведомления конкретному пользователю и состоит из уникального URL-адреса (endpoint), используемого для отправки сообщения конкретному пользователю, а также открытого ключа шифрования. Открытый ключ шифрования — это один из двух ключей шифрования на стороне сервера, предоставляемых веб-приложению [7].
Объекты подписки, получаемые сервером от клиента, сохраняются в базе данных для последующего использования. При необходимости отправки уведомления сервер извлекает соответствующую подписку и направляет запрос в push-сервис, используя уникальный endpoint-адрес. Для обеспечения безопасности применяется протокол Voluntary Application Server Identification for Web Push (VAPID), позволяющий аутентифицировать сервер посредством цифровой подписи с использованием приватного ключа. Push-сервис проверяет подлинность сервера с помощью соответствующего публичного ключа и, в случае успешной проверки, доставляет сообщение пользователю. После получения уведомления активируется Service Worker, который обрабатывает его и отображает пользователю. Таким образом, архитектура всего веб-приложения соответствует модели Клиент-Сервер. Для реализации серверной части системы управления push-уведомлениями был выбран язык JavaScript с использованием платформы Node.js. Node.js представляет собой асинхронную событийноориентированную среду выполнения, основанную на движке V8, обеспечивающем преобразование JavaScript в машинный код [5].
выполнения. Это повышает производительность серверной части и упрощает разработку масштабируемых веб-приложений [6].
Модуль web-push удобен для отправки push-уведомлений. Этот модуль реализует протокол Web Push, который описывает взаимодействие между сервером пользователя и службой push-уведомлений [7].
Кроме того, модуль web-push автоматически шифрует данные в соответствии со спецификацией шифрования сообщений для Web Push, предоставляет удобный API для отправки сообщений и включает консольную утилиту для генерации ключей шифрования, о которых говорилось ранее [8].
Рисунок 1. Интерфейс отображения push-уведомлений в веб-приложении
Предлагаемый веб-интерфейс приложения реализует систему push-уведомлений, отображаемую в правом верхнем углу пользовательского интерфейса. Уведомления генерируются автоматически при возникновении определенных системных событий, таких как создание нового заказа, завершение поездки водителя или необходимость технического обслуживания транспортного средства. Каждое уведомление включает краткое описание события (например, «Новый заказ №1245» или «Поездка водителя завершена») и метку времени, указывающую на время события. Это позволяет пользователю быстро отслеживать изменения в системе без необходимости обновления страницы. Помимо системы push-уведомлений, реализует механизм управления состоянием, позволяющий отслеживать текущий статус заказов, водителей и других системных объектов. Статус отражает этап бизнес-процесса и изменяется в зависимости от действий пользователя или системы. Например, можно использовать статусы заказов, такие как «создан», «получен», «обработан», «в процессе» и «завершен». При изменении статуса система автоматически записывает его в базу данных и может инициировать push-уведомление пользователю. Статусы и уведомления работают вместе для обновления информации в режиме реального времени. Статус заказа -ключевой элемент системы управления заказами в веб-приложении, обеспечивающий управление этапами выполнения, автоматизацию процессов и информирование пользователей о текущем состоянии заказа.
NUR Express
Транспортная компания
NUR Express
Q КагисутЕтгор стоимости
ft Главная
Ё Заказы AS Водители Л Автопарк
S Заказы
Управление заказами
Создание, отслеживание и управление заказами
Админ
Водители
ft Автопарк
Q Поиск по номеру или маршруту.
№ заказа
Маршрут
ORD-0O1
Бишкек —► Ош
ORD-0O2
Ош -* Джалал-Абад
□RD-003
Каракол -» Бишкек
Вес
1500 кг
2500 кг
800 кг
Водитель
Не назначен
Аскаров А.
Мамбетов Б.
Дата
Действия
17.04.2026
17.04.2026
17.04.2026
О Настройки
NUR Express
Контакты
Режим работы
Современная транспортная компания,
Круглосуточная поддержка
Активация Winaows
Чтобы активировать Windows, перейдите в раздел "Парам? резанам"
Будьте в курсе акций и новостей компании
Рисунок 2. Интерфейс управления заказами в веб-приложении
Вывод
В рамках проекта была разработана система push-уведомлений, адаптированная для использования в веб-приложении транспортной компании. Основная функциональность системы направлена на обеспечение быстрого обмена информацией между участниками логистического процесса, включая диспетчеров, водителей и клиентов. Внедрение push-уведомлений позволяет автоматизировать основные этапы транспортных операций, такие как назначение заказа, уведомление об изменении статуса доставки и оповещения о чрезвычайных ситуациях. Это значительно сокращает время на предоставление информации, уменьшает необходимость ручного контроля и повышает эффективность управления транспортом. Использование механизма подписки на уровне устройства упрощает взаимодействие пользователя с системой и исключает необходимость обязательной регистрации для получения уведомлений, что особенно важно для клиентов. При этом централизованное управление уведомлениями диспетчером обеспечивает контроль и безопасность системы. В дальнейшем развитие системы может включать реализацию расширенных функций на стороне сервера, механизмов анализа эффективности уведомлений и внедрение очередей уведомлений для обеспечения стабильной работы при высокой нагрузке. Это повышает масштабируемость системы и адаптирует её к потребностям крупной транспортной компании. Таким образом, использование push-уведомлений в веб-приложении транспортной компании помогает повысить эффективность, надёжность и качество обслуживания, а также оптимизировать логистические процессы в целом.