Материалы Международной студенческой научной конференции
Студенческий научный форум 2026

КЛИЕНТ-СЕРВЕРНАЯ АРХИТЕКТУРА ВЕБ-ИНТЕРФЕЙСА УПРАВЛЕНИЯ УМНЫМ ДОМОМ

Кузьменко И. А. 1 Мозговенко А.А. 1
1 ФГБОУ ВО «Мелитопольский государственный университет»
1. Белов А. В. Практическая энциклопедия Arduino. M.: Наука и техника. ДМК Пресс, 2018. 272 с.
2. Блум Д. Изучаем Arduino Инструменты и методы технического волшебства: учебное пособие. M: БХВ-Петербург, 2016. 336 с.
3. Геддес М. 25 крутых проектов с Arduino. M.: Эксмо, 2016.
4. Иго Т. Arduino, датчики и сети для связи устройств. M.: БХВ-Петербург, 2017. 544 с.
5. Володин В. Д., Шаронов А. А., Полевщиков И. С. Средства разработки и отладки программного обеспечения отечественных микропроцессорных устройств (часть 2) // Science Time. 2016. № 1(25). С. 91-94. EDN: VLIUFJ.

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

Материалы и методы исследования

Современные исследования в области автоматизации жилья акцентируют внимание на важности интеграции различных устройств в единую систему. Особое значение придается обеспечению безопасности передачи данных и возможности масштабирования системы.

Целью работы является разработка и анализ клиент-серверной архитектуры веб-интерфейса управления умным домом, обеспечивающей:

– Надежное взаимодействие компонентов системы

– Безопасную передачу данных

– Возможность масштабирования

– Работу в режиме реального времени

Результаты исследования и их обсуждение

Серверная часть реализована на языке программирования Node.js и современного фреймворка Express. Для правильной настройки сервера будут использоваться следующие протоколы:

– протокол HTTPS

– протокол MQTT

– WEBSockets

Протокол HTTPS распределяется на две части:

– HTTP(HyperText Transfer Protocol) – относится к списку не защищенных протоколов

– HTTPS(HyperText Transfer Protocol Secure) – протокол является расширением протокола HTTP с поддержкой шифрования для повышения уровня безопасности

Согласно схеме взаимодействия сервера с приложением (рис. 1) все участники одной сети контактируют между собой с помощью сервера. Чтобы обеспечить беспрерывную передачу данных между сервером и веб-приложением, используется подключение по WebSocket-у, и по протоколу подключения MQTT отправляются данные с умных устройств на сервер.

Серверная часть разработана по стандарту CRUD:

1. Create – создание данных

2. Read – считывание данных

3. Update – обновление данных

4. Delete – удаление данных

Рис. 1. Схема взаимодействия сервера с приложением

Хранилищем для хранения серверных данных выступает MongoDB. MongoDB представляет собой документно ориентированную базу данных и относится к типу NoSQL баз данных. MongoDB не является реляционной базой данных и использует коллекции и документы. Основной единицей данных служат документы, состоящие из пар ключ-значений. В коллекциях содержатся наборы функций и документов, являющихся эквивалентом таблиц реляционной базы данных.

MongoDB широко используется в сотрудничестве с AWS, Azure и другими источниками данных для разработки и функционирования приложений. Позволяя хранить и запрашивать большие объемы данных, он предлагает следующие надежные функции:

– Лучшее выполнение запросов с надлежащими функциями индексации и обработки.

– Аналитика в реальном времени и оптимизированная обработка данных с использованием специальных запросов.

– Улучшена доступность и гибкость данных благодаря надежным функциям репликации.

– Совместное использование данных позволяет разделять большие блоки данных для распределенного и более быстрого процесса выполнения запросов.

MongoDB хранит данные в формате JSON с парами ключей и значений для каждой сущности (рис. 2), в то время как базы данных SQL хранят данные в виде записи в строке таблицы (рис. 3).

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

На рисунке 4 наглядно представлена клиентская часть, на которой реализована форма входа и форма регистрации для новых пользователей.

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

Для обеспечения соединения сервера с приложением используются FETCH запросы и для получения данных в реальном времени используется WebSocket.

Рис. 2. Формат данных JSON

Рис. 3. Формат данных SQL

Рис. 4. Smart Home Systems форма входа

FETCH запросы делятся на методы:

– POST – для отправки данных на сервер

– GET – для получения данных с сервера

– PATCH – для обновления данных на сервере

– DELETE – для удаления данных с сервера

Чтобы открыть новый веб-сокет соединения, сначала нужно сделать запрос на подключение указав ссылку со специальным протоколом ws, равно как и HTTP, веб-сокет может быть связан с зашифрованным протоколом wss (рис. 5). Следует отметить, что лучше использовать зашифрованные протоколы подключения к серверам, так как именно такие протоколы гарантируют безопасный транспортный уровень и шифрует все данные от отправителя и расшифровывает их на стороне защитника от злоумышленников.

После инициализации нового сокет подключения следует разработать общение между сервером и приложением (рис. 6).

Переменная socket представляет собой объект с четырьмя функциями:

– onopen – функция, устанавливающая подключение между сервером и приложением

– onmessage – функция, которая после успешно установленного соединения передает данные с сервера в приложение.

– onclose – функция, закрывающая подключение между сервером и приложением

В случае разорванного соединения или ошибки сервера

– onerror – функция, выводящая все ошибки сервера

Для хранения серверных данных используется state-management библиотека Redux с использованием библиотеки redux-thunk для обработки асинхронных запросов. Библиотека Redux включает в себя основные модули для разработки:

– Slice(Reducer)

– Actions

– Selector’s

Самым главным модулем является Slice, в этом модуле разрабатываются редьюсеры и сохраняется логика обработки и записи данных в перемене через actions. Вслед за Slice по приоритетности следуют Actions, где хранятся асинхронные функции отправляющие и получающие данные с сервера, сами actions являются очень гибкими, в них можно описывать не только логику обработки серверных данных, но и управлять состоянием компонента на «расстоянии», передавать локальные данные, уход. Selector’s представляют собой функции в которых описаны ссылки на переменные в Slice, иными словами, через Selectors извлекаются серверные данные.

Рис. 5. Веб-сокет с зашифрованным протоколом

Рис. 6. Общение между сервером и приложением

Рис. 7. Схема взаимодействия Redux с Features

На рисунке 7 представлена модель взаимодействия Redux с компонентами, где хранится основная логика приложения – такие компоненты называются Features (основные компоненты, в которых сохраняется логика обработки запросов).

Заключение

Разработанная архитектура демонстрирует эффективное взаимодействие между компонентами системы умного дома. Использование современных технологий обеспечивает:

– Надежную защиту данных через HTTPS

– Оперативную передачу информации посредством WebSocket

– Гибкое хранение данных в MongoDB

– Удобный интерфейс управления на базе React

Система готова к масштабированию и может быть адаптирована под различные задачи автоматизации жилья.


Библиографическая ссылка

Кузьменко И. А., Мозговенко А.А. КЛИЕНТ-СЕРВЕРНАЯ АРХИТЕКТУРА ВЕБ-ИНТЕРФЕЙСА УПРАВЛЕНИЯ УМНЫМ ДОМОМ // Материалы МСНК "Студенческий научный форум 2026". 2026. № 19. С. 67-70;
URL: https://publish2020.scienceforum.ru/ru/article/view?id=976 (дата обращения: 16.05.2026).