Как сделать монитор освещения в реальном времени с помощью Arduino и Pusher

1656609260 kak sdelat monitor osveshheniya v realnom vremeni s pomoshhyu arduino

автор Нео Игадаро

IcUvjBv4yvJzuM0TRM-tDjUBLFZQHpO-QPUa
Фото Микаэля Кристенсона на Unsplash

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

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

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

Требования к созданию нашей интеграции Arduino и Pusher

В этом процессе я использовал:
– Плата Arduino. Доска MKR1000.
— Arduino IDE.
— Фотоэлемент (доступен здесь).
– резистор 10 кОм (доступен здесь).
– Макет и перемычки.
– Программа Pusher – Создайте ее здесь.
— Composer (доступен для загрузки по https://getcomposer.org).
— Знание PHP.

Макет – это плата для временного создания прототипов аппаратных проектов. В нем есть узлы, проводящие по нему ток.

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

Начало работы с Arduino

В этом разделе мы настроим Arduino IDE и добавим подключение к Интернет к нашей плате. Мы узнаем, как правильно выбрать плату и добавить к ней подключение к Интернету.

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

Примечание: щит – это в основном плата расширения, которую можно разместить (смонтировать) на верхней части платы Arduino.

Существует много видов щитов:

1. Ethernet Shield.
1FMr9efK4eZjXE0bcKcVE9tx0PsE8NH2bbjv
щит Ethernet
2. WiFi Shield.
ZIgAHwpMZ9P-IqYxcVzdzi-QyD7o17409uan
Wi-Fi щит
3. 3G or LTE Shields.
GwHUDbf7glVytuUviQG3yOzD7mrexSl-SoO4
Arduino GSM Shield

Мы собираемся использовать Arduino MKR1000, поставляемый со встроенным WiFi-чипом. Эта плата доступна в магазине Arduino.

gktBy89jXSm5YJ2pwsrSZYwauHowuenln1oG
Arduino MKR1000 WIFI

Затем загрузите Arduino IDE отсюда и установите его на свой компьютер.

После завершения установки переходите к установке Определение совета путём запуска IDE. Затем перейдите к Tools > Boards > Board Manager, где мы ищем и устанавливаем определение для MKR1000.

0m4FT25IL50oHvtPHAsRIGlXUanzJLXdkULq
Менеджер совета директоров

Однажды Определение совета полностью установлено, перейдите к Tools | Boards и выберите определение только что установленной платы.

Чтобы подключить нашу плату Arduino к Интернету, мы должны установить библиотеку под названием wifi101. Чтобы установить библиотеку, перейдите к Sketch > Include Librаry > Manage Libraries, затем ищите и вstall wifi101.

haRKcTrKvdKLWCcZaTxS8rLhmJAOkaDnSRzH
Установите библиотеку WiFi101

Мы можем проверить, работает ли это, перейдя к Files > Examples > WiFi > ConnectWithWpa. Это должно создать некоторый код в нашем эскизе. Дальше, edit в ssid и перейдите к SSID и паролю нашего маршрутизатора:

char ssid[] = "yourNetwork";     //  your network SSID (name)    char pass[] = "secretPassword";  // your network password    int status = WL_IDLE_STATUS;     // the Wifi radio's status

Создание светового монитора в Arduino

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

Фотоэлемент – это датчик, который позволяет нам обнаруживать свет. Их часто считают светозависимыми резисторами (LDR), фоторезисторами или CdS элементами.

Фотоэлемент – это в основном резистор, изменяющий значение сопротивления (в Омахе) в зависимости от того, сколько света падает на волнистую поверхность.

Составление компонентов

Сначала разместите резистор последовательно с фотоэлементом на макетной плате рядом с платой Arduino.

Теперь подключите другой конец резистора к GND на плате Arduino, а другой конец фотоэлемента к выводу VCC платы Arduino.

Наконец подключите средний контакт между резистором и фотоэлементом к аналоговому контакту A0 платы Arduino. Конечный результат должен выглядеть так:

osntZEkqFYLTPicQfUU5XUvlezFBbqT2Xg7I

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

Мы скопируем и вставим этот эскиз в нашу IDE Arduino, а затем загрузим его на плату.

Убедитесь, что выбрана правильная плата и последовательные порты.

// Pins    int sensorPin = A0;    void setup() {      // Serial      Serial.begin(115200);    }
    void loop() {      // Reading      int sensorValue = analogRead(sensorPin);      // Display      Serial.print("Sensor reading: ");      Serial.println(sensorValue);      // Wait      delay(500);    }

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

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

K-OeEYRaA7PP9HZy3TAKbTohDqe6-gCVP2Oc

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

Настройка веб-приложения

В этом разделе мы собираемся создать базовое веб-приложение, которое собирает данные как a GET запрос и отображает его пользователям, подписанным на этот канал, в режиме реального времени. Для отображения в реальном времени мы будем использовать Pusher.

Pusher — это простой API для быстрой, легкой и безопасной интеграции двунаправленной функциональности в реальном времени через WebSockets в веб- и мобильные приложения или любое другое устройство, подключенное к Интернету.

Первым шагом будет создание бесплатной учетной записи Pusher. Если его нет, создайте свою программу на информационной панели.

Создание программы Pusher

Создайте учетную запись Pusher и выделите приложения > Создать новое приложение. Введите название программы, выберите кластер, выберите JavaScript и PHP, и тогда мы готовы.

Экран настройки программы должен выглядеть примерно так:

R5woGfHJG7bDg0AVOKuBTeXPTULtVqidi-9u

После завершения вы получите ключи программы.

Настройка нашего проекта

Мы создадим папку под названием arduino-light-monitor в нашем localhost корневой каталог.

Затем откройте терминал и введите composer require pusher/pusher-php-server. Это создаст пару файлов в нашем каталоге.

Создайте файл под названием notification.html. Затем добавьте HTML и JavaScript ниже:

<!DOCTYPE html>    <html>    <head>      <title>Notifications From Light monitor</title>      <script src="      <script>        //Enable Pusher Logging - don't include this in production        Pusher.logToConsole = true;
        //Create a new instance of pusher with your credentials        var pusher = new Pusher('APP_KEY', {            cluster: 'PUSHER_CLUSTER',//if you chose a different cluster replace it here            encrypted: true          });
        //subscribe to a channel you will listen on        var channel = pusher.subscribe('light-monitor-channel');
        //What happens when light-readings-sent is fired        channel.bind('light-readings-sent', function(data){          //gets the ul in the dom          var ul = document.querySelector('ul');          //creates a li          var li = document.createElement('li');          //Attaches the data received to the text node          var itemText = document.createTextNode(data.value);          //Append the data to the li          li.appendChild(itemText);          //Append the li to the ul          ul.appendChild(li);        });      </script>    </head>    <body>      <ul></ul>    </body>    </html>

Здесь происходит то, что мы подписываемся на канал под названием light-monitor-channel затем подождите, пока мы получим вызов light-readings-sent. Каждый раз, когда событие запускается, мы добавляем полученные данные в наш список.

Мы также создадим другой файл под названием index.php. Это файл, который отправляет события в канал уведомлений. Мы добавим код PHP ниже к файлу:

<?php      require __DIR__ . '/vendor/autoload.php';
      $options = array(        'cluster' => 'PUSHER_APP_CLUSTER',        'encrypted' => true      );      $pusher = new Pusher\Pusher(        'PUSHER_APP_KEY',// replace with yours        'PUSHER_APP_SECRET',//replace with yours        'PUSHER_APP_ID', //replace with yours        $options      );
      //checks if there is any data sent      if(isset($_GET['value'])){        $data['value'] = $_GET['value'];        //triggers the event on the channel        $pusher->trigger('light-monitor-channel', 'light-readings-sent', $data);      } else {        echo "Nothing to do";      }    ?>

Если вам нужно где-нибудь разместить свое содержимое вы можете перейти на 000webhost.com и создать бесплатный субдомен, куда вы сможете загрузить содержимое своей папки arduino-light.

Мы проверим это, открыв notification.html и index.php в двух разных браузерах. Когда мы перезагружаем index.php, мы должны получить новый элемент списка со значением «пустой запрос». Если мы попробуем index.php?value=123мы должны получить value 123 добавлен в наш список уведомлений в режиме реального времени.

Разве это не просто здорово?

Отправка показаний датчика к веб-приложению

Наконец мы рассмотрим, как отправить данные с платы Arduino на сервер.

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

// Pins    int sensorPin = A0;
    char ssid[] = "wifi_name"; //your wifi name    char pass[] = "wifi_pass"; // your wifi password    int status = WL_IDLE_STATUS;
    char server[] = "yourexampleserver.com"; //replace with your localhost or domain
    // Create an instance of WiFiClient    WiFiClient client;
    // We define the interval on which we want to send the data    unsigned long lastConnectionTime = 0;    const unsigned long postingInterval = 60L * 1000L; //this implies 60,000L the L represents the long datatype
    void setup() {      // Serial      Serial.begin(115200);
      // Attempt to connect to Wifi network:      while ( status != WL_CONNECTED) {
        Serial.print("Attempting to connect to WPA SSID: ");        Serial.println(ssid);
        // Connect to WPA/WPA2 network:        status = WiFi.begin(ssid, pass);
        // Wait 10 seconds for connection:        delay(10000);      }
      // you're connected now      Serial.print("You're connected to the network");    }
    void loop() {      if(millis() - lastConnectionTime > postingInterval) {        //Measure the light level        int sensorValue = analogRead(sensorPin);
        //Send the value to the server        sendHTTPRequest(sensorValue);      }    }
    void sendHTTPRequest(int sensorValue){      // Close existing connection      client.stop();
      // Connect & send request      if (client.connect(server, 80)) {
        Serial.println("connecting...");
        // Send the HTTP GET request:        client.println("GET /light/?value=" + String(sensorValue) + " HTTP/1.1");        client.println("Host: yourexampleserver.com");        client.println("User-Agent: ArduinoWiFi/1.1");        client.println("Connection: close");        client.println();
        // Note the time that the connection was made:        lastConnectionTime = millis();      }      else {        // if you couldn't make a connection:        Serial.println("connection failed");      }    }

В приведенном выше коде мы создаем подключение к указанному Wi-Fi ssid используя экземпляр WiFiClient. Мы будем использовать это соединение для взаимодействия с нашим удаленным сервером.

В setup``() функцией, мы имеем дело с инициализацией Serial и подключением к сети WiFi, указанной в ssid и pass переменные выше.

В loop``() мы проверяем, находимся ли в интервале публикации. Тогда, если да, мы берем чтение и звоним в sendHTTPRequest функция, определяемая под ним.

В sendHTTPRequest``() функции, мы принимаем параметр с названием sensorValue. Поскольку Arduino запускает код в цикле, первое, что нужно сделать, это остановить любое предварительное открытие клиентского подключения с помощью оператора client.stop(). Это остановит создание соединений и не позволит отбросить их после использования.

Далее мы пытаемся подключиться к серверу, определенному в переменной server[]. Мы проверяем, можно ли установить соединение, и если нет, печатаем на последовательное «подключение не удалось». После подключения клиента мы отправляем значение контакта датчика через URL к нашему веб-приложению.

Если мы испытаем это сейчас, датчик освещенности будет читать каждую минуту.

xbLXp8j2TwoE7DG3MJggHJn7H-HaQCBLBT8v

Вывод

Мы успешно создали световой монитор с помощью Arduino и Pusher. Если вам понравился этот учебник и вы хотели бы перейти от нуля к герою в мире IoT, вам следует ознакомиться с книгой Internet of Things with Arduino Cookbook Марко Шварца. Он содержит более 60 рецептов, которые помогут вам создать разумные решения IoT и удивят вас увлекательными IoT-проектами, которые, как вы думали, существовали только в фильмах о Джеймсе Бонде.

Если у вас есть вопросы или другие идеи по интеграции IoT с Pusher, оставьте комментарий ниже!

Первоначально это было опубликовано в нашем блоге.

Добавить комментарий

Ваш адрес email не будет опубликован.