Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. Internet of Things

Создание интеллектуальных устройств на основе Arduino и Node.js при помощи PubNub

by
Difficulty:IntermediateLength:MediumLanguages:
Sponsored Content

This sponsored post features a product relevant to our readers while meeting our editorial guidelines for being objective and educational.

Russian (Pусский) translation by Nadia Gonzales (you can also view the original English article)

В связи с расцветом maker movement: (* широкий термин для обозначения индивидуальных изобретателей, разработчиков и ремонтников, чья деятельность связана с техникой. Здесь и далее прим. пер.) организация Maker Faire (* выставка, организуемая журналом Make, чтобы «славить инженерное искусство, научные проекты и тип мышления DIY (Do-It-Yourself - сделай [это] сам, о ремонте, изготовлении, сборке чего-л. собственноручно) »), создание 3D-принтеров, роботов DIY, беспилотников и т.д – благодаря популярности Arduino (* комплект, основой которого служит микроконтроллер (микрокомпьютер, разработанный специально для встраиваемых систем управления технологическими процессами, периферийными, коммуникационными, бытовыми приборами и другими устройствами), с открытым исходным кодом) многие разработчики программного обеспечения стали хакерами аппаратного обеспечения.  Вы можете подключить Arduino к своему компьютеру с помощью кабеля USB (* universal serial bus – универсальная последовательная шина), скачать IDE (* Integrated Development Environment – интегрированная среда разработки) и бац: все готово для разработки.

Однако я вижу, что многие веб-программисты остались в стороне, поскольку Sketch, язык программирования на основе языка C для программирования платы Arduino, – это не то, с чем веб-разработчики чувствуют себя комфортно.  Но что, если бы у вас была возможность использовать JavaScript – язык, с которым вы уже знакомы?  Не появилось бы желание поиграться с Arduino?

В данном руководстве я вам покажу, с чего начать при работе с Arduino при помощи Node.js; также мы подробно разберем процесс создания прототипа (* создание демонстрационной или упрощённой, пробной версии (макета, модели) новой системы; необходимо для уточнения требований к системе, оценки сроков реализации, возникающих проблем и т. д.) приложения IoT (* Internet of Things – Интернет вещей; концепция вычислительной сети физических предметов («вещей»), оснащённых встроенными технологиями для взаимодействия друг с другом или с внешней средой) с помощью API на JavaScript системы PubNub (* быстро работающая система обмена сообщениями между любыми устройствами и платформами).

Johnny-Five – фреймворк для создания робототехники на JavaScript

Теперь я хочу вам представить Johnny-Fivе – фреймворк для программирования робототехники на JavaScript.  Johnny-Five – платформа с открытым исходным кодом, численность сообщества разработчиков которой постоянно растет (по всему миру начали появляться поддерживаемые сообществом NodeBots Days (* встречи по всему миру, на которых люди собираются для совместного изучения Arduinos, Tessels, Edison's, Raspberry Pis, NodeCopters и т.д.)).

Что ж, давайте начнем использовать Johnny-Five для программирования Arduino Uno (* "Uno" означает «один» на итальянском и является эталонной моделью для платформы Arduino)!

1. Установка  Arduino

Необходимое аппаратное и программное обеспечение:

Для начала подключите вашу Arduino Uno к компьютеру при помощи кабеля USB.  Также скачайте Arduino IDE и установите ее на ваш компьютер. IDE буде вам необходима только для начальной настройки. IDE буде вам необходима только для начальной настройки.

В IDE Arduino перейдите в Tools > Port и убедитесь, что необходимая плата, Arduino Uno, подключена к правильному порту (tty.usbmodem… для Mac, cu.usbmodem… для Windows).

Arduino port

Johnny-Five взаимодействует с Arduino при помощи протокола Firmata, поэтому вам необходимо установить StandardFirmata:

  •  В IDE откройте File > Examples > Firmata > StandardFirmata. 
  • Щелкните кнопку upload (кнопка со стрелкой).    
  • Дождитесь, когда в информационном окне будет показано сообщение “Done uploading” (* «загрузка завершена»).    
  • Закройте IDE.  Больше IDE вам не нужна, если только вы не хотите использовать ее для написания кода.
Arduino StandardFirmata

Opening StandardFirmata

2. Создание «Hello World» (* первая простейшая программа, которую создают новички в области компьютерных наук)

Убедитесь, что Node.js установлена на вашем компьютере.  Создайте подходящую папку, например, js-hello, затем перейдите в нее (с помощью команды cd (* change directory)) и установите Johnny-five при помощи npm (* пакетный менеджер Node).

Теперь давайте напишем «Hello World» при помощи Johnny-Five.  Поскольку у вас имеется определенное отличное аппаратное обеспечение, то вы при его помощи создадите «Hello World», которой будет являться мигающий свет LED (* Light Emitting Diode – светоизлучающий диод (СИД))!

Необходимое аппаратное обеспечение:

  • 1 Arduino Uno
  • 1 СИД
  • 1 прототипная плата
  • 2 проволочные перемычки с двумя штыревыми концам (1 красная, 1 черная)
  • 1 резистор (200 – 330Ω)
What you need to build a hardware LED with Arduino

Знайте свои СИДы

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

Сборка контура

Давайте договоримся о цветах во избежание путаницы:

  • Черная перемычка используется для заземления
  • Красная перемычка используется для подачи электрического напряжения

Не обязательно, чтобы ваши перемычки имели черный и красный цвета, но используйте перемычки двух разных цветов, чтобы не запутаться.  При этом наиболее эффективным и корректным способом использования перемычек будет подключение красной к положительной клемме (* в нашем случае используем контакт 13), а черной – к земле (контакт GND (ground)).

Arduino circuit board

Вы можете ознакомиться подробнее с прототипной платой, резисторами и основами всех частей на Adafruit!

Реализуем мигание СИД при помощи Johnny-Five

Теперь вы будете работать с программным обеспечением.

Создайте файл blink.js и вставьте нижеприведенный код:

Выполните:

СИД должен будет мигать с интервалом в 500 мс. Если этого не происходит, то проверьте контур и код.

LED connected to circuit board

arduino-johnnyfive-blinkgif

Теперь, когда вы усвоили основы, давайте продолжим и узнаем, как реализовать возможность подключения к Интернету для вашего аппаратного обеспечения и как создать прототип вашего первого интеллектуального (* "разумный"; с развитой логикой; оснащённый микропроцессором, микропроцессорный; программируемый; настраиваемый; обычно этот термин применяется для описания электронного устройства с встроенным микропроцессором, т. е. программируемого для выполнения различных функций)  устройства!

3. Разработка прототипа интеллектуальной осветительной системы

Рынок интеллектуальных прозрачных лампочек разнообразен: Philips HUE и LIFX.  С помощью смартфонов и планшетов вы можете изменять их яркость и цвет.

Теперь вы создадите прототип нечто подобного, благодаря чему будет возможно осуществлять дистанционное управление Arduino и СИД из браузера.

Создание устройства, соответствующего концепции IoT, при помощи JavaScript

Важным моментом здесь является превращение вашего аппаратного обеспечения в устройство IoT путем подключения его к Интернету.  В отличие от ситуации с использованием Bluetooth (* технология беспроводной ближней коротковолновой радиосвязи (на расстояниях до 30 м), позволяющая объединять устройства разных типов для передачи речи и данных), как только устройство подключено к Интернету, вы можете управлять вашим СИД из любой точки мира.  Для облегчения реализации связи с разъемным соединением мы будем использовать API на JavaScript  PubNub.

Сеть потока данных (DSN – Data Stream Network) PubNub предоставляет глобальную инфраструктуру (* основополагающая совокупность компонентов, объединенная в систему) и позволяет вам довольно просто создавать и масштабировать приложения, работающие в режиме реального времени, и устройства IoT.  Интеллектуальный СИД, который мы собираемся создать, работает следующим образом: 

Smart LED flow chart

Например, при контролировании пользователем из Сан-Франциско Arduino в Токио происходит следующее:

  1. Пользователь публикует сообщение «Make the light green» (* «Изменить цвет на зеленый») со своего мобильного телефона.
  2. Сообщение отправляется в центр обработки и хранения данных в Сан-Франциско.
  3. Данные синхронизируются между всеми центрами  обработки и хранения данных.
  4. Arduino подписывается на получение сообщений из центра обработки и хранения данных в Токио и изменяет цвет света.

Действие осуществлено всего лишь за четверть секунды.

В данном руководстве вы будете создавать прототип устройства.  Однако если у вас имеется SDK (* System Design Kit –  комплект разработчика системы), то вы фактически можете создавать потребительские товары наподобие Emberlight smart lighting platform.

Необходимое аппаратное обеспечение:

  • 1 Arduino Uno
  • 1 RGB-(* система цветопередачи RGB (Red-Green-Blue)) СИД (общий катод)
  • 1 прототипная плата
  • 4 проволочных перемычки с двумя штыревыми концам (красная, зеленая, синяя, черная)
  • 1 резистор (220 Ω x 2, 330 Ω x 1)
Hardware you need

Знайте свой СИД

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

LED RGB cathode diagram

Сборка контура

Попробуйте собрать контур следующим образом. В отличие от контактов, используемых в предыдущем  примере «мигание СИД», здесь вы будете использовать контакты PWM (* Pulse Width Modulation – широтно-импульсная модуляция (ШИМ), PWM принимает аналоговые входные сигналы и формирует два цифровых выходных сигнала, противоположных друг другу по знаку), которые отмечены знаком '~' на вашей прототипной плате Arduino.

Разница между этими контактами по существу заключается в различии выходных сигналов (* в первом случае – аналоговый, во втором – цифровой). Например, когда вы подключаете СИД к цифровому контакту, у вас будет только два состояния: замкнутое (* состояние «включено») и открытое (* состояние «выключено»). Осуществление мигания СИД – это просто переключение двух состояний. Однако для создания миллионов оттенков при помощи RGB-СИД вам необходимы промежуточные состояния, поэтому вам необходимо будет использовать аналоговые контакты PWM.

Подключите RGB-СИД при помощи проволочных перемычек и прототипной платы к контактам Arduino под номерами 6, 5 и 3 (для красной, зеленой и синей  соответственно). Общий контакт подключен к земле.

RGB LED connected to breadboard

В этой схеме я использовала резисторы с сопротивлением 220Ω (для красной) и 330Ω (для зеленой и синей), поскольку красный цвет слишком интенсивен при использовании того же сопротивления  для зеленого и синего. Вы можете это подрегулировать по ходу работы. Если вы захотите узнать больше о сопротивлении и осуществлении вычислений согласно закону Ома, то я рекомендую вам ознакомиться с материалами на Adafruit.

Создание веб-интерфейса пользователя

Теперь вы создадите веб-интерфейс для контролирования СИД.

Используйте элемент HTML5 <input type="range">, чтобы нарисовать ползунковый переключатель, который позволит пользователю изменять значения каждого “R”, “G” и “B”. Значения каждого цвета лежат в диапазоне от 0 до 255 (min="0" max="255"), и при этом изменяются на целые величины, поскольку инкремент имеет значение 1 (step="1").

За счет этого элемента происходит контроль интенсивности красного цвета. Я не буду обсуждать стилевое оформление при помощи CSS в этом руководстве, но вы можете ознакомиться с исходным кодом на GitHub (ветка gh-pages), чтобы посмотреть, какое стилевое оформление я задала для визуальных компонентов UI (* user interface – пользовательский интерфейс).

Далее мы узнаем, как использовать API на JavaScript  PubNub для передачи данных о цвете от UI к Arduino.

Получите свои собственные ключи для API и затем импортируйте библиотеку JavaScript из CDN (* content delivery network – сеть доставки контента) или со своего устройства.

Инициализируйте образец:

Давайте передадим данные для изменения цвета СИД при генерировании события в UI.

Добавьте слушатель события change для образца ползунка в DOM (* Document Object Model – объектная модель документа) и передайте любые изменения в PubNub при помощи метода publish.

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

Далее вы будете использовать Node.js, чтобы получить данные для аппаратного обеспечения!

Преобразование Arduino в устройство IoT при помощи Johnny-Five и PubNub

Очень просто зажечь RGB СИДы при помощи Johnny-Five. Для этого используйте код ниже:

Засветился ли ваш СИД красным? Если нет, то проверьте ваш код и контур. Если и после этого не работает, то, скорее всего, вы используете общий анод СИД вместо катода. Попробуйте убрать перемычку от земли и подсоединить к контакту 5V.

Теперь посмотрите на строку под комментарием // test. Вы увидите метод color, с помощью которого задается значение цвета. В нашем случае красная компонента имеет значение 255, а остальные – 0, таким образом ваш СИД светится чисто красным.

При помощи Johnny-Five вы можете задавать значения RGB от 0 до 255, как и значения свойства color CSS. Попробуйте изменить значения и поэкспериментировать с цветом вашего СИД!

Далее вы будете динамично изменять значения при помощи данных, присланных от UI браузера.

Для получения данных используйте метод subscribe PubNub.

Установите модуль pubnub при помощи npm:

Инициализируйте образец также, как вы делали на стороне браузера:

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

Возвращенный объект m – это сообщение, пришедшее со стороны браузера. Например, когда синяя компонента имеет значение 150, вы получаете данные {color: 'blue', brightness: 150}, а затем, когда приходят следующие данные – {color: 'red', brightness: 150} – значение red = 150 складывается с blue = 150, в результате чего имеем фиолетовый цвет.

Для ознакомления со всем исходным кодом посетите /node/index.js на GitHub (ветка master).

Та-да-а! Вы только что создали прототип вашего первого интеллектуального СИД IoT!

Internet of Things LED lit up

Вы можете использовать другие микроконтроллеры, например, Raspberry Pi, вместе с Johnny-Five и PubNub, так что стоит попробовать создавать больше приложений IoT!

Ссылки

  • Johnny-Five: Оригинальный фреймворк для программирования робототехники на JavaScript
  • PubNub: сеть потока данных в режиме реального времени, которая позволяет разработчикам создавать и масштабировать мобильные приложения, веб-приложения и приложения IoT, работающие в режиме реального времени.
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.