Проблемы пользовательского интерфейса интернет-вещей

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

Одной из проблем является высокая нагруженность серверов управления интернет-вещами. При этом будут иметь место следующие факторы:

- рост числа запросов к серверу,

- рост потребления внешней памяти для хранения графических интерфейсов,

- рост нагрузки транспортных каналов и узлов сети.

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

1) классификация интернет-вещей по типам,

2) объединение пользовательских интерфейсов общего типа в один,

3) использование сжатия,

4) использование векторной графики,

5) создание единого центра управления интернет-вещами.

Объединение интернет-вещей, их классификация и создание единого центра управления пока не имеет активного развития. Производители интернет-вещей предлагают свои собственные не только виджеты, но и сервисы для управления вещами. Это может привести к усложнению пользования интернет-вещами различных производителей и децентрализации средств управления. Решение данной проблемы приблизит идею единого центра управления, как решения появившихся проблем, к осуществлению. Компания IBM двигается в этом направлении, предлагая не только единый протокол взаимодействия интернет-вещей MQTT, но и единые серверы.

 

 

Конструктор виджетов, как решение проблем Интернета вещей

В данном разделе описывается решение двух проблем Интернета вещей:

- рост нагрузки на сетевые ресурсы вследствие роста числа интернет-вещей,

- отсутствие единого центра управления интернет-вещами.

Решая проблему нагрузки ресурсов сети нужно выполнить следующие задачи:

1) уменьшить объём передаваемых данных по сети,

2) минимизировать рост потребности в вычислительных ресурсах.

Рост нагрузки на сеть вызывается ростом числа обособленных интернет-вещей. Каждая вещь должна иметь модуль управления (программную реализацию) и графический интерфейс. Если первое легко поддаётся объединению и минимизации потребления памяти, то второе гораздо сложнее, поскольку все вещи, несмотря на возможность классификации, индивидуальны и имеют свой внешний вид, отражение которого в графическом интерфейсе является одним из интересов производителей интернет-вещей.

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

- выбрать графический веб-интерфейс для виджета из широкого набора (в т.ч. выбрать интерфейс производителя);

- объединить виджеты в группу для отображения на одном рабочем пространстве;

- построить графический веб-интерфейс вручную, используя набор графических компонентов.

Данное решение рассматривается как совокупность веб-технологий и методов их использования.

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

- возможность использования в едином центре управления интернет-вещами,

- независимость от платформы и устройства, с которого произведён запуск конструктора.

Решение проблемы роста нагрузки в контексте графических интерфейсов возможно также и без конструктора виджетов, путём выполнения задач классификации вещей и объединения их в обобщённые группы для стандартизации интерфейсов. Однако любая стандартизация графических образов отрицательно сказывается на восприятии человеком. Конструктор виджетов даст возможность не только внести разнообразие в графические интерфейсы без ощутимого роста нагрузки на сеть, но и позволит пользователям абстрагироваться от стандартизации, предоставляя им средства для создания своих собственных интерфейсов.

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

Описание конструктора

Конструктор виджетов представляет собой веб-приложение, состоящее из двух основных частей:

- серверная часть,

- клиентская часть.

Клиентская часть приложения берёт на себя функции:

- отображение графического интерфейса,

- приём команд от пользователя и передача их серверной части,

- приём команд от сервера и обновление графического интерфейса,

- бизнес-логика конструктора виджетов.

Серверная часть выполняет следующие функции:

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

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

- ядро конструктора виджетов (обработка команд от бизнес-логики конструктора виджетов, сохранение информации о виджетах в БД),

- авторизация и аутентификация пользователя.

 

 

Рисунок 15. Функциональная диаграмма конструктора виджетов

Бизнес-логика конструктора отвечает за функции управления графическими компонентами при построении виджета пользователем. Все изменения, произведённые пользователем, бизнес-логика сообщает на сервер в ядро конструктора.

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

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

Графический интерфейс веб-приложения конструктора виджетов включает в себя:

- графический интерфейс конструктора,

- собираемые графические интерфейсы интернет-вещей.

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

Сервер управления вещами – объединяет в себе авторизацию интернет-вещей, разграничение прав доступа к ним, а также поддержку протокола обмена информацией между вещами.

Используемые технологии

Серверная часть веб-приложения разрабатывается с использованием технологии PHP и располагается на удалённом сервере.

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

PHP был выбран в качестве средства серверной разработки по следующим причинам:

- распространяется в свободном доступе,

- подходит для любых современных серверов,

- имеет хорошую документацию и множество примеров использования,

- простота развёртывания,

- гибкие средства работы с БД,

- простой синтаксис,

- большинство CMS написаны с помощью PHP (следовательно, разрабатываемые модули могут быть совместимы с данными CMS).

Для работы с базами данных была выбрана технология MySQL, поскольку она является свободно распространяемым продуктом, обеспечивает отличную производительность и хорошо поддерживается языком PHP. База данных конструктора виджетов располагается на том же сервере, что и серверная часть.

Клиентская часть сочетает в себе такие технологии, как JavaScript, JQuery, HTML, CSS и предназначена для выполнения на клиентских веб-браузерах.

Современные веб-браузеры используют три уровня представления данных:

- структура,

- внешний вид,

- бизнес-логика.

Такое представление данных соответствует популярной концепции MVC (Model View Controller–модель, представление, управление), имея некоторые расхождения с ней, и для каждого уровня используется своё средство.

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

Внешний вид приложения описывается с помощью так называемых таблиц стилей средствами технологии CSS. Данная технология используется для описания стилей, применимых к объектам, описанным на языке HTML. Стили объектов могут быть описаны непосредственно в тексте HTML, но CSS – это технология, созданная с целью отделить описание внешнего вида объекта от его структуры.

Для описания бизнес-логики веб-приложения используется технология JavaScript – распространённый язык программирования, используемый в основном для описания логики поведения каких-либо объектов. Он используется во многих программных продуктах, в игровой индустрии, в различных средствах разработки. JavaScript также используется и в веб-браузерах как язык описания бизнес-логики веб-страницы.

JQuery – технология, позволяющая значительно упростить разработку веб-приложений на основе языка JavaScript. JQuery представляет собой фреймворк, написанный на языке JavaScriptи содержащий множество часто используемых функций и алгоритмов, реализованных в виде простых методов. JQuery замечательно подходит для работы с визуализацией графических компонентов интерфейса, а также упрощает работу с запросами к удалённым сетевым узлам.

Фреймворк (англ. framework — каркас, структура) — структура программной системы; программное обеспечение, облегчающее разработку и объединение разных компонентов большого программного проекта. Употребляется также слово «каркас», а некоторые авторы используют его в качестве основного, в том числе не базируясь вообще на англоязычном аналоге. Можно также говорить о каркасном подходе как о подходе к построению программ, где любая конфигурация программы строится из двух частей: первая, постоянная часть — каркас, не меняющийся от конфигурации к конфигурации и несущий в себе гнезда, в которых размещается вторая, переменная часть — сменные модули (или точки расширения).

Визуализация с помощью JQuery позволяет с лёгкостью описывать анимацию графических компонентов, изменение их размеров, цвета, формы. Работа с удалёнными узлами также упрощается благодаря использованию технологии AJAX.

AJAX (AsynchronousJavaScriptandXML) - подход к построению интерактивных пользовательских интерфейсов веб-приложений, заключающийся в «фоновом» обмене данными браузера с веб-сервером. В результате, при обновлении данных веб-страница не перезагружается полностью, и веб-приложения становятся быстрее и удобнее.

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

Кроссбраузерность — свойство сайта отображаться и работать во всех популярных браузерах идентично. Под идентичностью понимается отсутствие развалов верстки и способность отображать материал с одинаковой степенью читабельности. Понятие «кроссбраузерность» очень часто путают с попиксельным соответствием, что на самом деле является разными понятиями.

Некоторые интернет-вещи требуют поддержки обмена данными в реальном времени (например – видеорегистратор, микрофон и т.п.). Поэтому в Интернете вещей стоит проблема данных реального времени.

Существует 2 способа обмена информацией между клиентской частью веб-приложения и серверной:

1) поллинг (опрос),

2) непрерывный канал связи.

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

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

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

Для реализации непрерывного канала связи в веб-приложениях существует специальная технология – WebSocket.

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

В настоящее время в W3C осуществляется стандартизация WebSocketAPI. Также протокол WebSocket был стандартизован IETF как RFC 6455.

Технология WebSocket предназначена для реализации в веб-браузерах и веб-серверах, но может быть использована в любых клиент-серверных приложениях. Протокол WebSocket является независимым и основан на TCP-протоколе. Его единственная связь с HTTP в том, что рукопожатие обрабатывают серверы HTTP как запрос на обновление. Протокол WebSocket делает возможным более тесное взаимодействие между браузером и веб-сайтом, позволяет реализовать более «живой» контент (например, игры реального времени). Это стало возможным через предоставление стандартного способа для отправки содержимого сервером браузеру без дополнительного запроса клиента, и позволяет передавать сообщения туда и обратно, пока соединение открыто. Таким образом, между браузером и сервером может происходить двусторонний (двунаправленный) обмен сообщениями. Аналогичный эффект был достигнут нестандартным образом в таких технологиях, как Comet.

Кроме того, обмен информацией идёт по TCP-порту 80, и это большое преимущество для тех сред, которые блокируют нестандартные подключения к интернету с помощью межсетевого экрана. В настоящее время протокол Web Socket поддерживается в нескольких браузерах, включая Google Chrome, Firefox, Safari, Opera и Internet Explorer (начиная с 10 версии). WebSocket также требует поддержки веб-приложений на стороне сервера.

Существует ряд других веб-технологий, позволяющих разрабатывать веб-виджеты. В этот список можно включить ASP.NET, Java, Adobe Flash/Flex.Данные технологии объединены общим подходом – клиентская и серверная части приложения разрабатываются с помощью одной технологии и объединены в одно целое веб-приложение. Рассмотрим эти технологии и сравним их с используемыми в конструкторе виджетов.

Java – технология, разработанная компанией Sun Microsystems и в настоящий момент являющаяся собственностью компании Oracle, используется в разных сферах разработки программного обеспечения (в том числе и системного). Для разработки веб-приложений с помощью средств Javaразрабатывается два приложения – сервлет (серверная часть) и апплет (клиентская часть). Данный подход достаточно удобен, поскольку разработка ведётся на одном языке. Однако Java имеет такой недостаток, как относительно высокие требования к производительности и наличие среды выполнения команд Java Virtual Machine. Несмотря на это, веб-приложения, написанные на Java имеют большие возможности визуализации и доступа к данным пользовательского устройства. Но для виджетов интернет-вещей такая гибкость не оправдывает те накладные расходы, получаемые взамен.

Flash – технология, разработанная компанией Adobe, позволяет создавать веб-приложения без разделения на серверную и клиентскую части. Приложение такого типа загружается на устройство пользователя при запросе и выполняется специальной программной средой Adobe Flash Player. Такой подход позволяет делать достаточно гибкие веб-приложения с большими возможностями визуализации и доступа к системным ресурсам. Однако размер таких веб-приложений становится достаточно большим и приложения становятся слишком требовательными к вычислительным ресурсам. Такой подход не оправдывает себя при разработке веб-виджетов для интернет-вещей.

ASP.NET – технология, разработанная компаниейMicrosoft–позволяет разрабатывать веб-приложения в среде Visual Studio. При этом приложение не делится на клиентскую и серверную часть. Программист просто описывает визуальную часть и её бизнес-логику, которые потом компилируются в одно приложение. При вызове такого приложения сервер генерирует пользовательский интерфейс в привычном виде – HTML + CSS + JavaScript и выдаёт его пользователю. Недостатком такого подхода является то, что веб-приложение и его внешний вид сильно зависят от текущего состояния фреймворка ASP.NET. Ещё одним недостатком является плохая поддержка системами не из семейства Windows.

Примеры веб-виджетов

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

Представленные в данном разделе веб-виджеты применимы к реальным интернет-вещам, разрабатываемым в лаборатории беспроводных сенсорных сетей WiSeNet Lab кафедры ВСиС.

В приложении имеется исходный код на языках HTML, CSS и JavaScript для данных виджетов.

Умная розетка

Одно из применений интернет-вещей – управление электропитанием в доме. Для выполнения данной задачи существует специальная интернет-вещь – умная розетка, выпускаемая на рынке в настоящее время многими компаниями, например Sony, ThinkEco, Powerhouse Dynamics, Ube. Данное устройство позволяет дистанционно управлять питанием розетки при помощи пультов управления или веб-интерфейса.

 

 

Рисунок 16. Веб-виджет умной розетки в двух состояниях

 

Управление розеткой с помощью такого виджета осуществляется путём простого нажатия на виджет. При этом состояние розетки меняет своё значение на противоположное (вкл./выкл.).

Лампы освещения

Управление электропитанием в доме возможно не только с помощью розеток, но и при помощи умных ламп, позволяющих управлять освещением. Компания Philips разработала лампы Hue, управляемые дистанционно. Внутри таких ламп имеется беспроводной микроконтроллер, принимающий команды от пульта, располагаемого обычно на стене. Такие лампы получили дальнейшее развитие в Интернете вещей. Компания Apple использует приложения для управления ими в своих смартфонах. Данными лампами также возможно управлять с помощью центра управления в WEB’е. Лампу достаточно вкрутить вместо обычной и установить пульт управления или шлюз где-либо в радиусе действия приёмопередатчика лампы. Кроме того, такие лампы имеют возможность регулировки цвета освещения.

 

Рисунок 17. Виджет для ламп освещения

 

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

Для управления лампами используется палитра цветов, элемент вызова которой расположен рядом с каждой лампой. Выбирая цвет из палитры, управляемая лампа меняет цвет своего освещения на выбранный. Имеется также и переключатель цвета всех ламп одновременно. Для управления питанием лампы (включения и выключения) используются белый и чёрный цвета в палитре.

Метеостанция

В настоящий момент метеостанции разрабатываются с возможностью управления и мониторинга из Интернета, т.е. как интернет-вещи. Наиболее выдающееся решение на данный момент принадлежит компании Netatmo - Urban Weather Station.

 

 

Рисунок 18. Виджет метеостанции

 

На рисунке 18 изображён веб-интерфейс, который использует данные, приходящие с метеостанции и отображает на визуальном пространстве экрана.

Данный виджет представляет собой пример составного виджета, т.е. виджета, на котором отображается несколько источников информации. В данном случае все источники информации (давление, температура, влажность, шум) принадлежат одному устройству – метеостанции. Однако один виджет может сочетать в себе данные с разных устройств.

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

Электросчётчик

Существует множество примеров сочетания беспроводных технологий и устройств изменения параметров сети питания. Один из них – использование электросчётчика в качестве интернет-вещи. В таком случае все данные со счётчика (напряжение в сети, ток, общая потребляемая мощность, общий расход) можно наблюдать со специальной веб-страницы в Интернете.

 

 

Рисунок 19. Виджет электросчётчика

 

Кроме того, такой электросчётчик способен идентифицировать подключенное к нему устройство.

 

Выводы

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

Благодаря выбору технологий HTML, CSS и JavaScript, веб-виджет становится универсальным графическим интерфейсом, который можно встроить в любой сайт, а также использовать для интерпретации любым клиентским устройством, поскольку эти три технологии дают 3 составные части любого веб-приложения:

- структура,

- внешний вид,

- бизнес-логика.

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

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

Основной проблемой конструктора виджетов является факт отсутствия в настоящий момент единого протокола для Интернета вещей, поддерживаемого всеми производителями. Это не позволит использовать такой конструктор в сочетании с интернет-вещами многих производителей. Однако разработка конструктора виджетов позволит заострить данную проблему и приблизить идею создания единого центра управления интернет-вещами к реальности.

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

Таким образом, веб-интерфейсы являются наиболее универсальным видом графических интерфейсов. Технологии HTML, CSS, JavaScript являются лишь средствами представления информации и могут быть использованы не только в веб-интерфейсах, но и в любых других. Создание веб-интерфейса для устройства или узла глобальной сети даёт на выходе не только веб-приложение, доступное при наличии доступа к сети Интернет, но и полную структуру приложения с визуальной частью и бизнес-логикой, которая может быть использована в любом локальном системном приложении при поддержке им данных технологий.

 

Заключение

В работы были рассмотрены 3 основных вида взаимодействия в Интернете вещей:

1. Взаимодействие между сервером и интернет-вещами.

2. Взаимодействие интернет-вещей друг с другом.

3. Взаимодействие пользователей с интернет-вещами.

Были даны способы организации данных видов взаимодействия, и выявлены следующие проблемы Интернета вещей:

1. Отсутствие общепринятого протокола для взаимодействия интернет-вещей друг с другом.

2. Отсутствие поддержки существующими решениями технологии туманных вычислений.

3. Отсутствие общепринятого метода интеграции интернет-вещей в WEB.

В качестве решения первой проблемы предлагается использование протокола MQTT. В настоящий момент данный протокол используется в большинстве систем интернет-вещей, однако используется не повсеместно, поскольку поддерживается не всеми выпускаемыми интернет-вещами. Протокол MQTT позиционируется именно как протокол для Интернета вещей и ему отдаётся предпочтение, поскольку он разрабатывался с целью обеспечения минимального энергопотребления и минимизации объёма передаваемой информации.

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

- метод локального брокера,

- метод псевдо-сервера.

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

- решение не требует внесения изменений в протокол MQTT,

- достаточно лишь введение новых типов узлов в локальную сеть вещей – локальных брокеров.

Недостатками данного метода являются:

- невозможность организации ячеистой топологии,

- дополнительные расходы на внесение новых узлов в локальную сеть.

Однако данные недостатки окупаются лёгкостью встраивания такого решения в существующие системы интернет-вещей.

Метод псевдо-сервера позволяет избавиться от перечисленных недостатков, однако требует серьёзных изменений реализации сервера и клиента MQTT, а также внесения изменений в протокол. Несмотря на то, что такие изменения не повлияют на обратную совместимость, они являются надстройкой над протоколом и более правильной альтернативой данному способу будет доработка протокола MQTT с целью обеспечить поддержку туманных вычислений.

Был произведён обзор методов взаимодействия интернет-вещей с пользователями и выявлена третья проблема Интернета вещей – отсутствие общепринятого метода интеграции интернет-вещей в WEB. В качестве решения данной проблемы предлагается использование архитектуры REST. Данная архитектура позволяет создать WEB вещей, состоящий из устройств, способных взаимодействовать с любым WEB-ресурсом, поскольку будет использоваться единая технология обмена информацией, ориентированная на данные и основанная на протоколе HTTP.

Была оценена проблема роста нагрузки на сетевые ресурсы вследствие роста числа интернет-вещей. Главную часть проблемы составляет рост нагрузки на сервера управления интернет-вещами. Отсутствие классификации интернет-вещей и общих стандартов графических интерфейсов порождает проблему децентрализации средств доступа к интернет-вещам. Решением данной проблемы является создание единого сервера управления интернет-вещами. В качестве шага на пути к решению данной проблемы предложено использование конструктора виджетов, который позволяет:

- классифицировать интернет-вещи и объединить множество схожих графических интерфейсов,

- значительно уменьшить объём занимаемой памяти графическими интерфейсами,

- создавать интерфейсы с возможностью встраивания в любой веб-ресурс,

- создавать графические интерфейсы с желаемым внешним видом.

В ходе исследования данного решения были рассмотрены технологии, позволяющие создавать веб-приложения, произведён их сравнительный анализ и выбраны оптимальные технологии для разработки веб-виджетов интернет-вещей и самого конструктора виджетов. Использование технологий HTML, CSS, JavaScript, JQuery в связке даёт возможность обеспечить:

- минимальный физический размер виджета,

- максимальную интегрируемость в веб-ресурсы,

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

Используемая литература

1. Кнеллер В.Ю - "Приборное облако" – концепция функционирования сенсорных систем на основе интернет-технологии // Датчики и системы №8, 2010 (66-69).

2. D. Guinard, V. Trifa, E. Wilde - A resource oriented architecture for the Web of Things // Internet of Things (IoT), 2010 (Tokyo, Japan).

3. D. Guinard, V. Trifa, T. Pham, O. Liechti - Towards physical mashups in the Web of Things // Proc. of the Sixth International Conference on Networked Sensing Systems, (INSS), 2009.

4. A. Bufalino, S. Spanghero - M2M in the Cloud: It´s the Right Place, September, 2011 [Электронный ресурс]. URL: http://www.telit.com/en/discover/market-intelligence/telit-m2m-column/archive.php?p_id=359&id_to_show=12

5. Kevin Ashton - That ‘Internet of Things’ Thing. In the real world, things matter more than ideas.

6. Rob van Kranenburg - The Internet of Things: A critique of ambient technology and the all-seeing network of RFID.

7. Disruptive Civil Technologies - Six Technologies with Potential Impacts on US Interests out to 2025

8. Леонид Черняк - Платформа Интернета вещей (рус.). Открытые системы. СУБД, №7, 2012

9. А.Д. Скороходов. - Способы территориального объединения сенсорных сетей.

10. Пилипенко Н.А. - WEB вещей – новый этап развития интернета вещей.

11. Восков Л.С - Интернет вещей // "Новые информационные технологии". Тезисы докладов XX Международной студенческой конференции-школы-семинара, М.: МИЭМ, 2012 (89-94).

12. http://evrythng.net – инструмент для интеграции интернет-вещей в социальные сети.

13. http://www.sierrawireless.com/productsandservices/AirVantage.aspx - AirVantage M2M Cloud Platform.

14. http://www.netatmo.com - метеостанция Netatmo Weather Station.

15. http://www.withings.com – интернет-вещи компании Withings.

 

 

Приложения

Приложение 1. Исходный код веб-виджета ламп освещения

<style>

.widget_image{

position:absolute;

}

 

.lamp_image{

z-index:20;

background-image: url("lamps/images/lamp.png");

width:100px;

height:168px;

}

 

.widget_color{

position:relative;

left:1px;

top:1px;

z-index:10;

height:166px;

width:98px;

text-align:center;

/*background-color:#00ff00;*/

}

 

.object_container{

position:absolute;

}

 

.iColorPicker{

width:80%;

}

 

.control{

width:100%;

margin-top:5px;

}

 

.colorpicker_base{

display:none;

}

</style>

 

<select class="colorpicker_base" a>

<!-- Colors from Google Calendar -->

<option value="#ffffff">On</option>

<option value="#7bd148">Green</option>

<option value="#5484ed">Bold blue</option>

<option value="#a4bdfc">Blue</option>

<option value="#46d6db">Turquoise</option>

<option value="#7ae7bf">Light green</option>

<option value="#51b749">Bold green</option>

<option value="#fbd75b">Yellow</option>

<option value="#ffb878">Orange</option>

<option value="#ff887c">Red</option>

<option value="#dc2127">Bold red</option>

<option value="#dbadff">Purple</option>

<option value="#e1e1e1">Gray</option>

<option value="#000000">Off</option>

 

 

</select>

 

<script>

 

var Widget;

 

function WLamps()

{

this.getData = function(param)

{

var _url = 'getdata.php?widget=lamps&param=' + param;

$.getJSON(_url, {}, function(_data){

$.each(_data, function(key, val) {

if(key.toLowerCase() == 'value')

_callback(val);

});

}, 'html');

}

 

this.sendData = function(__data, param)

{

var _url = 'setdata.php?widget=lamps&param=' + param;

$.post(_url, {data:__data}, function(_data){}, 'html');

}

 

this.visualLampSetColor = function(lampId, color)

{

if(lampId)

$('#lamp' + lampId).find('.widget_color').css('background-color', color);

else

$('.widget_color').css('background-color', color);

}

 

this.lampSetColor = function(lampId, color)

{

this.sendData('{"value":"false"}', 'hueisgroup');

this.sendData('{"value":"' + lampId + '"}', 'subid');

this.sendData('{"value":"' + color + '"}', 'color');

}

 

this.lampsSetColor = function(color)

{

this.sendData('{"value":"true"}', 'hueisgroup');

this.sendData('{"value":"' + color + '"}', 'color');

}

 

this.lampsOn = function()

{

this.sendData('{"value":"true"}', 'hueisgroup');

this.sendData('{"value":"true"}', 'on');

}

 

this.lampsOff = function()

{

this.sendData('{"value":"true"}', 'hueisgroup');

this.sendData('{"value":"false"}', 'on');

}

 

this.lampOn = function(lampId)

{

this.sendData('{"value":"' + lampId + '"}', 'subid');

this.sendData('{"value":"true"}', 'on');

}

 

this.lampOff = function(lampId)

{

this.sendData('{"value":"' + lampId + '"}', 'subid');

this.sendData('{"value":"false"}', 'on');

}

}

 

$(document).ready(function(){

Widget = new WLamps();

for(var i = 1; i <= 3; i++)

{

Widget.sendData('{"value":"false"}', 'hueisgroup');

Widget.sendData('{"value":"' + i + '"}', 'subid');

Widget.getData('color', function(value){

if(value.length == 6)

Widget.visualLampSetColor(i, '#' + value);

});

}

});

</script>

 

<div class="object_container" id="lamp1" lampid="1" style="top:20px;left:30px">

<div class="widget_image lamp_image"></div>

<div class="widget_color"></div>

<div class="control"></div>

</div>

 

<div class="object_container" id="lamp2" lampid="2" style="top:60px;left:230px">

<div class="widget_image lamp_image"></div>

<div class="widget_color"></div>

<div class="control"></div>

</div>

 

<div class="object_container" id="lamp3" lampid="3" style="top:30px;left:430px">

<div class="widget_image lamp_image"></div>

<div class="widget_color"></div>

<div class="control"></div>

</div>

 

<div class="control"></div>

<script>

$('.control').append('<select class="colorpicker_container">' + $('.colorpicker_base').html() + '</div>');

$('.colorpicker_container').simplecolorpicker();

$('.colorpicker_container').simplecolorpicker('selectColor', '#7bd148');

$('.colorpicker_container').simplecolorpicker('destroy');

 

$('.colorpicker_container').simplecolorpicker({

picker: true

}).on('change', function() {

var container = $(this).parent().parent();

var color = $(this).val();

var lampId = parseInt(container.attr('lampid'));

switch(color)

{

case '#000000':

lampId!= NaN? Widget.lampOff(lampId): Widget.lampsOff();

break;

 

case '#ffffff':

lampId!= NaN? Widget.lampOn(lampId): Widget.lampsOn();

break;

 

default:

lampId? Widget.lampSetColor(lampId, color.substr(1)): Widget.lampsSetColor(color.substr(1));

Widget.visualLampSetColor(lampId, color);

break;

}

 

});

</script>

 

Приложение 2. Исходный код веб-виджета для умных весов

<style>

.widget_image{

position:absolute;

}

 

.scale_image{

z-index:10;

background-image: url("scale/images/scale.png");

width:670px;

height:673px;

}

 

.widget_text{

position:relative;

left:270px;

top:55px;

z-index:20;

font-size:40px;

font-family:tahoma;