Industrielle Fertigung
Industrielles Internet der Dinge | Industrielle Materialien | Gerätewartung und Reparatur | Industrielle Programmierung |
home  MfgRobots >> Industrielle Fertigung >  >> Manufacturing Technology >> Herstellungsprozess

IoT mit ESP8266-01 und Arduino

Komponenten und Verbrauchsmaterialien

Arduino Nano R3
× 1
PCBWay Custom PCB
× 1
Espressif ESP8266 ESP-01
× 1
Zweikanal-Relaismodul
× 1
LED (generisch)
× 2
Breadboard (generisch)
× 1
Jumper (generisch)
× 1
Widerstand 1k Ohm
× 2
Widerstand 2,21 kOhm
× 1

Notwendige Werkzeuge und Maschinen

Lötkolben (generisch)
Lötdraht, bleifrei
Lötflussmittel, Löten

Apps und Onlinedienste

Microsoft Visual Studio-Code
Optional
Arduino-IDE
Autodesk Eagle
Optional

Über dieses Projekt

Einführung

Heute werden wir ein Gerät bauen, das sich mit dem Internet verbindet und es dem Benutzer ermöglicht, sein Zuhause über WLAN aus der Ferne zu steuern. Wir werden das Arduino-Board (jedes Modell wird die Arbeit gut machen) mit dem ESP8266-01-WLAN-Modul verwenden, um dieses Gerät herzustellen. Fangen wir an!

Was ist ein Smart Home?

Arbeitsszenario

Das ControlPanel

Wir werden eine einfache Webseite erstellen, die als Bedienfeld für den Benutzer dient und ihm ermöglicht, jedes an unser System angeschlossene Haushaltsgerät zu steuern. Um die Webseite zu erstellen, verwenden wir:

  • HTML
  • CSS
  • Jquery

Die eingebettete Hardware

Die Webseite sendet einige Bestellungen an den ESP8266-01, der als Webserver arbeitet, der mit dem Arduino-Board verbunden ist. Und entsprechend den eingehenden Daten führt das Arduino-Board einige Aktionen aus, wie das Einschalten der Glühbirne, das Ausschalten des Fernsehers und in diesem Teil verwenden wir:

  • Arduino
  • ESP8266-01

Erste Schritte mit dem ESP8266-01

Wie bereits erwähnt, benötigen wir unser Arduino-Board, um mit dem Internet verbunden zu werden, aber der Arduino Nano, die Version, die wir heute verwenden, hat diese Funktion nicht. Wir werden also das WLAN-Modul ESP8266-01 verwenden, um die WLAN-Funktion zu unserem winzigen Arduino-Board hinzuzufügen.

Es gibt viele Modelle von ESP-WLAN-Modulen, welches soll ich wählen?! Nun, fast alle WLAN-Module der ESP-Familie werden die Arbeit gut machen, aber jedes hat seine eigenen Funktionen und Spezifikationen. Ich empfehle Ihnen, sich alle Spezifikationen und Funktionen anzusehen, um die für Ihre Bedürfnisse am besten geeignete auszuwählen.

Für meine Bedürfnisse fand ich den ESP8266-01 am besten geeignet, und das aus vielen Gründen. Es ist in der Maker-Community sehr bekannt. Als Ergebnis hat es eine sehr solide Online-Community, in der Sie mit diesem großartigen kleinen Modul eine Antwort auf fast alle Fragen oder Probleme finden können, mit denen Sie konfrontiert sind. Außerdem ist der Preis sehr günstig (ca. 1,5 $).

Außerdem ist es sehr einfach mit dem Arduino-Board zu verwenden, da es sich um ein serielles WLAN-Modul handelt, das über die serielle Kommunikation mit dem Arduino-Board kommunizieren kann. Es hat einen eingebauten Mikrocontroller, was bedeutet, dass Sie es als eigenständigen Mikrocontroller und WLAN-Modul in einer super coolen Kombination verwenden können. Es hat zwei integrierte GPIOs. Nur für 1,5 $ erhalten Sie all diese Funktionen, was eigentlich super cool ist. Schauen wir uns dieses Modul genauer an.

ESP8266-01 Pinbelegung

  • VCC: an +3,3 V Stromquelle anschließen. Verbinde es nicht mit einer 5V-Quelle, es wird beschädigt .
  • GND: -ve-Pin, verbinden Sie ihn mit der Masse Ihres Stromkreises.
  • CH_PD: Chip aktiviert Pin – Aktiv HIGH. verbinden Sie es mit einem logischen Wert HIGH, damit das Modul hochfahren kann.
  • RST: Chip-Reset-Pin – Aktives LOW, wenn es auf LOW gezogen wird, setzt es das Modul zurück.
  • GPIO0, GPIO2: Allzweck-Eingangs-/Ausgangspins.
  • Sende: Verbinden Sie sich mit dem Rx des Mikrocontrollers (Arduino), um eine serielle Kommunikation herzustellen.
  • Empfang: Verbinden Sie sich mit dem Tx des Mikrocontrollers (Arduino), um eine serielle Kommunikation herzustellen.

ESP8266-01 Konfiguration

Wie bereits erwähnt, kommuniziert das ESP8266-01-Modul mit dem Arduino-Board über die serielle Kommunikation, was bedeutet, dass wir es mit den seriellen Pins 0, 1 (Tx, Rx) des Arduino verbinden müssen. Das Problem hierbei ist jedoch, dass diese Pins belegt sind, da wir den Arduino Serial Monitor zusammen mit dem ESP8266-01 für Debugging-Zwecke verwenden werden. Wir müssen also zwei weitere serielle Kommunikationspins finden, um sie mit dem ESP8266-01 zu verwenden.

Glücklicherweise hat Arduino dies einfach gemacht. Es gibt eine Bibliothek namens „SoftwareSerial“, die entwickelt wurde, um die serielle Kommunikation auf anderen digitalen Pins des Arduino zu ermöglichen, wobei Software verwendet wird, um die Funktionalität zu replizieren. Mit dieser Bibliothek kann ich beispielsweise die Pins 2, 3 (SoftwareSerial) als Rx und Tx neben den Pins 0, 1 (Hardware Serial) einstellen.

"SoftwareSerial" Bibliothek funktioniert gut, solange die Übertragungsgeschwindigkeit weniger als 19.200 Baud beträgt. Aber hier gibt es ein kleines Problem! Das WLAN-Modul ESP8266-01 ist ab Werk so programmiert, dass es mit einer Geschwindigkeit von 115, 200 Baud kommuniziert, was in der Bibliothek "SoftwareSerial" irgendwie schwer zu kommunizieren ist. Wir müssen also unser WLAN-Modul neu programmieren, um die Kommunikationsgeschwindigkeit auf 9600 Baud einzustellen, was mit der Bibliothek „SoftwareSerial“ ziemlich gut funktioniert. Dazu verwenden wir einige „AT-Befehle“.

Kommunikationsgeschwindigkeit des ESP8266-01 ändern

Erster Schritt:Laden Sie ein leeres Programm auf das Arduino-Board hoch

In diesem Schritt laden wir einen leeren Code auf das Arduino-Board hoch. Nur um sicher zu gehen, dass nichts im Hintergrund vom Arduino-Board ausgeführt wird.

Zweiter Schritt:Verdrahten des ESP8266-01 mit dem Arduino-Board

Um den ESP8266-01 neu zu konfigurieren und die Kommunikationsgeschwindigkeit (Baudrate) zu ändern, verwenden wir die AT-Befehle. AT-Befehle sind einfach einige Anweisungen zur Steuerung von Modems, Mobiltelefonen, Bluetooth-Modulen, WLAN-Modulen, GSM-Modulen.

Mit diesen Befehlen können wir grundlegende Informationen über unser Mobiltelefon oder GSM-Module wie den Namen des Herstellers, Modellnummer, IMEI usw. abrufen.„AT“ ist eine Abkürzung für „ATtention“ und heißt AT-Befehle, da jeder Befehl startet mit". das Präfix „AT“ ist kein Bestandteil der Befehle selbst, sondern teilt dem Modul nur den Beginn der Befehle mit.

Einige wichtige AT-Befehle

Befehlsnummer „4“ hängt von Ihrer ESP8266-01 Firmware-Version ab, wenn dieser Befehl bei Ihnen nicht funktioniert AT+CIOBAUD= Versuchen Sie es mit diesem AT+UART_DEF=,8,1,0,0

Schritt 1:Öffnen Sie den Serial Monitor

Schritt 2:Stellen Sie die Kommunikationsgeschwindigkeit auf 115, 200 Baud ein

Wie bereits erwähnt, kommt das ESP vom Hersteller, das so programmiert ist, dass es mit einer Geschwindigkeit von 115, 200 Baud kommuniziert. Also müssen wir die Arduino-Kommunikationsgeschwindigkeit auf 115, 200 . einstellen auch zum ersten Mal, nur dann ändern wir das später. Außerdem sollten Sie "Sowohl NL als auch CR" auswählen .

Schritt 3:Senden Sie "AT" und warten Sie auf die Antwort, um sicherzustellen, dass das ESP-Modul Sie hört.

Schritt 4:Ändern Sie nun die Kommunikationsgeschwindigkeit des ESP8266-01

Meine geladene Firmware für das ESP8266-01-Modul ist 1.6. und dieser Befehl AT+UART_DEF=,8,1,0,0 funktioniert gut für mich. Wenn es bei Ihnen nicht funktioniert, versuchen Sie es mit AT+CIOBAUD= . Wenn es mit "OK" antwortet jetzt hat sich die Kommunikationsbaudrate Ihres ESP-Moduls von 115, 200 geändert Baud auf 9600 Baud. GLÜCKWUNSCH!

Lassen Sie uns die Kommunikationsgeschwindigkeit des seriellen Monitors zurück auf 9600 ändern und erneut "AT" senden, um zu sehen, ob das ESP-Modul uns mit der neuen Geschwindigkeit (9600) hören kann oder nicht.

SUCHEN! es funktioniert. Der ESP8266-01 kann jetzt mit einer Baudrate von 9600 statt mit 115, 200 Baud mit dem Arduino-Board kommunizieren.

Versuchen wir nun, eine Verbindung zum Wifi-Netzwerk herzustellen

Sobald Sie die Eingabetaste drücken, sucht der ESP8266-01 nach diesem Netzwerk und verbindet sich damit. Wenn der Vorgang erfolgreich ist, wird dies zurückgegeben

WIFI VERBUNDEN

WIFI GOT IP

An diesem Punkt haben wir die Kommunikationsgeschwindigkeit des ESP8266-01 erfolgreich von 115.200 Baud auf 9600 Baud geändert. Jetzt müssen wir das Bedienfeld (Webseite) erstellen, mit dem der Benutzer seine Haushaltsgeräte steuern wird. Also, lass es uns bauen!

Was ist das Internet?

Tatsächlich ist das Internet ein unter der Erde vergrabenes Kabel, es kann Glasfaser, Kupfer oder sogar ein Satellit sein, aber das Internet ist einfach ein Kabel. Zwei beliebige Computer, die an dieses Kabel angeschlossen sind, können kommunizieren. Wenn der Computer direkt verbunden ist zu diesem Kabel wird es als Server bezeichnet und wenn es nicht direkt mit diesem Kabel verbunden ist, wird es als Client bezeichnet .

Server: ist ein spezieller Computer, auf dem ein bestimmtes Betriebssystem wie Apache ausgeführt wird. Dieser spezielle Computer speichert einige Webseiten, Dateien und Datenbanken auf seiner Festplatte. Jeder mit dem Internet verbundene Server hat eine eindeutige IP-Adresse wie 172.217.171.228 , die IP-Adresse ist wie eine Telefonnummer, die Menschen hilft, einander leicht zu finden. Da diese IP-Adresse für Menschen nicht sehr leicht zu merken ist. Also haben wir ihm einfach einen Namen gegeben google.com (Domainname).

Kunde: Es ist ein Computer, wie Sie und ich jeden Tag verwenden, er ist indirekt über einen Internetdienstanbieter (ISP) mit dem Internet verbunden und hat auch eine eindeutige IP-Adresse.

Arbeitsszenario

Es beginnt einfach mit einer Anfrage, die von einem Webbrowser (Client) wie Google Chrome, Firefox gesendet wird, und endet mit der Antwort vom Webserver.

Sie haben die Website-URL makesomestuff.org in einen Browser von einem Computer (Client) eingegeben, dann sendet dieser Browser eine Anfrage an den Webserver, der die Website hostet, der Webserver gibt dann eine Antwort mit einer HTML-Seite oder einem anderen Dokumentformat an den Browser zur Anzeige zurück es.

Genau das müssen wir heute in unserem Projekt tun. Wir müssen eine Anfrage vom Webbrowser (Client) an den ESP8266-01 (Webserver) senden, die beide mit demselben lokalen Netzwerk verbunden sind. Diese Anfrage enthält einige Daten, die dem Arduino sagen, was zu tun ist, um eine Glühbirne ein- oder auszuschalten. Also, lass uns die Webseite erstellen!

Aufbau der Webseite

Um unsere Webseite aufzubauen, müssen wir mit HTML, CSS, Javascript umgehen. Wenn Sie noch nie von diesen Namen gehört haben, machen Sie sich keine Sorgen, ich habe Sie.

HTML: Steht für „HyperText Markup Language“ und wir verwenden es, um die Hauptstruktur jeder Webseite zu erstellen. Wie das Hinzufügen einiger Schaltflächen, Bilder, Absätze, Überschriften, Tabellen und vieler weiterer Elemente. Es besteht aus einer Reihe von Elementen, die dem Browser mitteilen, wie der Inhalt der Webseite angezeigt werden soll. diese Elemente werden durch sogenannte Tags repräsentiert.

CSS: Es steht für Cascading Stylesheet. Nachdem Sie die Hauptstruktur der Webseite erstellt haben, müssen Sie diese Struktur schön aussehen lassen. Hier kommt CSS, um etwas Styling zu machen. Es ist eine Sprache, die den Stil eines HTML-Elements beschreibt. es besteht aus einigen Selektoren und Verzögerungsblöcken.

Javascript: Es ist eine Programmiersprache, die wir verwenden werden, um die Webseite interaktiver zu gestalten, indem wir einige Animationen und Karten hinzufügen und es uns ermöglicht, einige komplexe Dinge auf der Webseite zu erstellen. Heute verwenden wir es hauptsächlich, um eine HTTP-Anfrage vom Client (Webbrowser) an den Webserver (ESP8266-01) zu senden, um einige Aktionen wie das Ein- oder Ausschalten einer Glühbirne durchzuführen.

Aufbau der Webseitenstruktur

Um die bevorstehende Erklärung leicht zu verstehen, empfehle ich, dies cool zu lesen HTML-Einführung .

Wie wir sehen, ist unser Bedienfeld sehr einfach, es enthält zwei Kopfzeilen, von denen jede eine andere Größe hat, ein Bild und zwei Tasten, eine zum Einschalten einer LED und die zweite zum Ausschalten.

Code

   Smart Home-System   

Smart Home-Systemsteuerung

Entschuldigung, aber Ich bin ein Meme-Süchtiger!



Code-Erklärung

  • : Deklaration definiert, dass dieses Dokument ein HMTL5-Dokument ist.
  • : das Wurzelelement einer HTML-Seite.
  • : -Element enthält Metainformationen über die Seite.
  • :</strong> -Element gibt den Titel des Dokuments an. dieser Titel wird auf dem Browser-Tab der Webseite angezeigt.</li> <li><strong><body>:</strong> -Element enthält den sichtbaren Webseiteninhalt.</li> <li><strong><h1>:</strong> element definiert ein großes Element.</li> <li><strong><h4>:</strong> -Element definiert einen kleineren Header. Wenn der Header-Wert kleiner wird, wird die Schriftart kleiner.</li> <li><strong><img>:</strong> -Element fügt der Webseite ein Bild hinzu. das Bild, das Sie anzeigen möchten, sollte sich im selben Projektordner befinden.</li> <li><strong><br>:</strong> Bewegen Sie den Cursor zu einer neuen Zeile.</li> <li><strong><button>:</strong> Element fügt dem Seiteninhalt eine Schaltfläche hinzu.</li> </ul> <p> Jeder Button unserer Webseite hat zwei sehr wichtige Attribute die <code>id</code> , und die <code>Klasse</code> Attribute. wir werden in der Jquery-Code-Erklärung darüber sprechen, warum wir diese beiden Werte den Schaltflächen zugewiesen haben.</P> <h3 id='toc-styling-the-web-page-12'> <p> <p> </P> </P> Die Webseite gestalten</h3> <p> <strong><em>Um die bevorstehende Erklärung leicht zu verstehen, empfehle ich, dies cool zu lesen </em> </strong> <strong><em>CSS-Einführung</em> </strong> <strong><em>.</em> </strong> </P> <img loading='lazy' src="https://www.mfgrobots.com/article/uploadfiles/202112/2021122812180042.jpg?auto=compress%2Cformat&w=680&h=510&fit=max" /></figure> <p> Jetzt sieht die Webseite schöner aus (NICHT ZU VIEL xD), wir haben ihr eine coole grüne Hintergrundfarbe gegeben, wir richten den Seiteninhalt zentriert aus und wir ändern die Schriftfarbe und Schriftfamilie der Überschriften, was die Webseite lebendiger macht. Wir haben CSS verwendet, um all diese Styling-Zeugs zu machen.</P> <p> <strong>Code</strong> </P> <pre><code><!DOCTYPE html> <html> <head> <title>Smart Home System

    Smart Home Control Panel

    Tut mir leid, aber ich bin ein Meme-Süchtiger!



    Code-Erklärung

    Wir haben einige Codezeilen hinzugefügt, um unsere Webseite schöner zu machen. Wir haben style="background-color:seagreen; color:seashell; text-align:center;" . hinzugefügt im Körper tag um den gesamten Webseiteninhalt in die Mitte der Seite zu setzen und die Hintergrundfarbe auf Meergrün setzen auch um die Schriftfarbe auf Muschel einzustellen .

    Außerdem haben wir style="margin:10px;" . hinzugefügt innerhalb der beiden Button-Tags um einen Rand von 10 Pixeln um die vier Seiten jeder Schaltfläche festzulegen.

    Senden einer Anfrage an den Webserver

    Um die bevorstehende Erklärung leicht zu verstehen, empfehle ich, dies cool zu lesen Jquery-Einführung .

    Nachdem wir nun unsere Webseitenstruktur erstellt und gestaltet haben, müssen wir den beiden Schaltflächen, die wir zuvor auf der Webseite hinzugefügt haben, einige Funktionen hinzufügen. Wenn der Benutzer auf die Schaltfläche "LAMP ON" klickt, sendet sein Browser eine Anfrage, die einige eindeutige Daten an den Server (ESP8266-01) enthält. Diese eindeutigen Daten teilen dem Arduino mit, die Lampe einzuschalten. Das gleiche mit der zweiten Schaltfläche "LAMP OFF", wenn der Benutzer darauf klickt, sendet der Browser eine Anfrage mit einigen eindeutigen Daten an den Server (ESP8266-01). Diese eindeutigen Daten weisen den Arduino an, die Lampe auszuschalten. Schauen wir uns den Code an.

       Smart Home-System    

    Smart Home Control Panel

    Tut mir leid, aber ich bin ein Meme-Süchtiger!



    Code-Erklärung

    Das Wichtigste Zuerst müssen wir die Jquery-Bibliothek in unseren Code importieren. Also haben wir diese Zeile im head-Tag hinzugefügt .

    Die ganze Magie passiert in diesem interessanten Teil.

       
    • $(".button").click(function () {

    Wenn der Nutzer auf eine Schaltfläche klickt, die der Klasse „Schaltfläche“ . zugeordnet ist , lösen Sie die folgende Funktion aus.

    • var p =$(this).attr('id');

    Holen Sie sich den Wert des angeklickten Schaltflächenattributs „id“ und speichern Sie es im "p" variabel.

    • pin:p

    Setzen Sie den Wert der Variablen "p" in ein Wörterbuch (Schlüsselwert). Der Schlüssel ist "pin" und der Wert ist der Variablenwert "p".

    • $.get("http://172.20.10.11:80/", { pin:p });});

    Senden Sie dann eine GET-Anfrage an den Webserver, dessen IP-Adresse „172.20.10.11“ lautet. dieses GET Anfrage enthält den Wert des Attributs id gedrückte Taste.

    Falls der Benutzer die Schaltfläche „LAMP ON“ gedrückt hat, ist dieser ID-Wert 111, sodass der GET-Anfrage-Header einige Daten wie diese enthält pin=111 . schau dir die nächste Figur an!

    Auf der gegenüberliegenden Seite, wenn der Benutzer die Schaltfläche "LAMP OFF" gedrückt hat, enthält die Anfrage diese Daten pin=110 .

    Codelogik

    Ich weiß, dass Sie jetzt fragen, warum er sich für 111 entschieden hat? und 110 speziell? Ok, lass mich dir antworten, Fam. Eigentlich die Nummer 111 und 110 teilt sich in zwei Teile.

    • Erster Teil: sind die ersten beiden Zahlen, die in beiden Fällen "11" sind, bezieht sich dies auf die Arduino-Pin-Nummer, an der die Last, die ich steuern muss, angeschlossen ist.
    • Zweiter Teil: ist die dritte Zahl, die je nach angeklickter Schaltfläche zwischen 1 und 0 wechselt. Und es bezieht sich auf den Pin-Zustand (ON oder OFF).

    Im Arduino-Code erhalten wir diese Daten und trennen diese beiden Teile voneinander und speichern jeden Teil in einer anderen Variablen, Teil eins in der Variablen pinNumber und der zweite Teil in der Variablen pinState , dann schreiben wir diese einfache Codezeile, um die angeschlossene Last zu steuerndigitalWrite(pinNumber, pinState);

    Anschließen der Last

    Jetzt müssen wir die Last mit der Arduino-Platine verbinden, um sie zu steuern. Bevor wir ein Hochspannungsgerät wie die Klimaanlage oder sogar den Fernseher anschließen, müssen wir unsere Schaltung und den Code mit einigen Niederspannungsgeräten wie LEDs testen, um sicherzustellen, dass alles gut funktioniert. Hier ist der Schaltplan

    Die Verkabelung ist ziemlich einfach, wir verbinden den positiven LED-Bein mit dem Arduino-Digital-Pin 11, und den negativen Bein mit dem GND über einen 1k-Ohm-Widerstand.

    Arduino-Code

    #include  //Einschließen der SoftwareSerial-Bibliothek ermöglicht es Ihnen, die Pin-Nr. 2,3 als Rx, Tx. SoftwareSerial esp8266(2,3); // Rx einstellen ==> Pin 2; TX ==> Pin3. #define serialCommunicationSpeed ​​9600 // <=========Definiere eine Konstante namens "serialCommunicationSpeed" mit dem Wert 9600. Sie bezieht sich auf die serielle Kommunikationsgeschwindigkeit (Baudrate) der Software und Hardware. #define DEBUG true //erzeuge eine Konstante namens "DEBUG" und ihr Wert true. wir werden es später verwenden. int rotLED =12; // Weisen Sie eine Variable namens "redLED" mit einem ganzzahligen Wert 12 zu, sie bezieht sich auf den Pin, an dem die rote LED angeschlossen ist. int blueLED =11; // Weisen Sie einer Variablen namens "blueLED" einen Integer-Wert 11 zu. Sie bezieht sich auf den Pin, an dem die blaue LED angeschlossen ist. Void setup () { PinMode (redLED, OUTPUT); // Setzen Sie die Pinnummer 12 als Ausgangspin. PinMode (blaue LED, AUSGANG); // Setzen Sie die Pinnummer 11 als Ausgangspin. digitalWrite (rote LED, NIEDRIG); // schalte die rote LED zu Beginn des Programms aus. digitalWrite (blaue LED, HOCH); // Schalten Sie die blaue LED zu Beginn des Programms ein. Serial.begin (serialCommunicationSpeed); // Beginnen Sie die serielle Hardwarekommunikation (0, 1) mit Geschwindigkeit 9600. esp8266.begin (serialCommunicationSpeed); // Beginnen Sie die serielle Softwarekommunikation (2, 3) mit Geschwindigkeit 9600. InitWifiModule (); // Rufen Sie diese benutzerdefinierte Funktion "InitWifiModule()" auf, um eine Kommunikation zwischen dem ESP8266 und Ihrem Access Point (Home Router oder sogar Ihrem mobilen Hotspot) zu initialisieren. digitalWrite (blaue LED, NIEDRIG); // Nachdem die Initialisierung erfolgreich abgeschlossen wurde, schalten Sie die blaue LED aus (nur ein Indikator). } void loop() //our main program, some fun are about to start) { if(esp8266.available()) //if there's any data received and stored in the serial receive buffer, go and excute the if-condition body. If not, dont excute the if-condition body at all. { if(esp8266.find("+IPD,")) //search for the "+IPD," string in the incoming data. if it exists the ".find()" returns true and if not it returns false. { delay(1000); //wait 1 second to fill up the buffer with the data. int connectionId =esp8266.read()-48; //Subtract 48 because the read() function returns the ASCII decimal value. And 0 (the first decimal number) starts at 48. We use it to convert from ASCI decimal value to a character value. esp8266.find("pin="); //Advance the cursor to the "pin=" part in the request header to read the incoming bytes after the "pin=" part which is the pinNumer and it's state. int pinNumber =(esp8266.read()-48)*10; //read the first Byte from the Arduino input buffer(i.e. if the pin 12 then the 1st number is 1) then multiply this number by 10. So, the final value of the "pinNumber" variable will be 10. pinNumber =pinNumber + (esp8266.read()-48); //read the second Byte from the Arduino input buffer(i.e. if the pin number is 12 then the 2nd number is 2) then add this number to the first number. So, the final value of the "pinNumber" variable will be 12. int statusLed =(esp8266.read()-48); //read the third byte from the Arduino input buffer. then save it inside the "statusLed" variable. At any case, it will be 1 or 0. digitalWrite(pinNumber, statusLed); //then turn the LED at "pinNumber" on or off depending on the "statusLed" variable value. Serial.println(connectionId); //print the "connectionId" value on the serial monitor for debugging purposes. Serial.print(pinNumber); //print the "pinNumber" value on the serial monitor for debugging purposes. Serial.print ( " "); //print some spaces on the serial monitor to make it more readable. Serial.println(statusLed); //print the "statusLed" value on the serial monitor for debugging purposes. String closeCommand ="AT+CIPCLOSE="; //close the TCP/IP connection. closeCommand+=connectionId; //append the "connectionId" value to the string. closeCommand+="\r\n"; //append the "\r\n" to the string. it simulates the keyboard enter press. sendData(closeCommand,1000,DEBUG); //then send this command to the ESP8266 module to excute it. } } } /****************************************************************************************************************************************************************************************** * Name:sendData * Description:this Function regulates how the AT Commands will ge sent to the ESP8266. * * Params:command - the AT Command to send * - timeout - the time to wait for a response * - debug - print to Serial window?(true =yes, false =no) * * Returns:The response from the esp8266 (if there is a reponse) */ String sendData(String command, const int timeout, boolean debug) { String response =""; //initialize a String variable named "response". we will use it later. esp8266.print(command); //send the AT command to the esp8266 (from ARDUINO to ESP8266). long int time =millis(); //get the operating time at this specific moment and save it inside the "time" variable. while( (time+timeout)> millis()) //excute only whitin 1 second. { while(esp8266.available()) //is there any response came from the ESP8266 and saved in the Arduino input buffer? { char c =esp8266.read(); //if yes, read the next character from the input buffer and save it in the "response" String variable. response+=c; //append the next character to the response variabl. at the end we will get a string(array of characters) contains the response. } } if(debug) //if the "debug" variable value is TRUE, print the response on the Serial monitor. { Serial.print(response); } return response; //return the String response. } /****************************************************************************************************************************************************************************************** * Name:InitWifiModule * Description:this Function gives the commands that we need to send to the sendData() function to send it. * * Params:Nothing. * * Returns:Nothing (void). */ void InitWifiModule() { sendData("AT+RST\r\n", 2000, DEBUG); //reset the ESP8266 module. //delay(1000); sendData("AT+CWJAP=\"PUT YOUR SSID\",\"PUT YOUR PASSWORD\"\r\n", 2000, DEBUG); //connect to the WiFi network. delay (3000); sendData("AT+CWMODE=1\r\n", 1500, DEBUG); //set the ESP8266 WiFi mode to station mode. Verzögerung (1000); sendData("AT+CIFSR\r\n", 1500, DEBUG); //Show IP Address, and the MAC Address. Verzögerung (1000); sendData("AT+CIPMUX=1\r\n", 1500, DEBUG); //Multiple conections. Verzögerung (1000); sendData("AT+CIPSERVER=1,80\r\n", 1500, DEBUG); //start the communication at port 80, port 80 used to communicate with the web servers through the http requests. }  

    code explanation

    the code is pretty straightforward, we implemented two different functions InitWifiModule() and sendData()

    The sendData() function job is regulating how the AT commands will get sent to the ESP8266-01 module.

    the InitWifiModule() function job is to provide the sendData() function the AT commands that we need to send to the ESP8266-01.

    in the loop() function we read the income HTTP request header and search for the “+IPD, ” which means that the request has successfully arrived, then we read the pin value which it will be “111” if the user clicked the “LAMP ON” button and “110” if the user clicked “LAMP OFF” button.

    Don’t forget to put your wifi SSID and Password in the Arduino code line no. 103 sendData("AT+CWJAP=\"PUT YOUR SSID\",\"PUT YOUR PASSWORD\"\r\n", 2000, DEBUG);

    For more code explanation please read the comments in the code, it’s well documented

    Wie es funktioniert

    After uploading the code to the Arduino board, open the Serial monitor and read the responses that the ESP module is sending.

    at the beginning of the program, if you see something like the previous figure with “OK” at the end of the page, it means that the ESP8266-01 module is successfully connected to your wifi (Access point) and got an IP and MAC address. Now, you can open your fancy web page and try to control some stuff 😉

    But, if you see something like the previous figure with a “FAIL” or “ERROR” at the end of the page, it means that your ESP module cant connect to your wifi (Access point) for some reasons, try to check if entered the right SSID and password for your network.

    Adding a High Voltage Load

    After we tested our code and got sure that everything is working like a charm, we need to replace this boring LED with a High voltage load like an air conditioner, TV or a light bulb. But to control all of these high voltage appliances we have to deal with relays .

    What’s and why relays? Ok, the relay is a mechanical switch, which is toggled on or off by energizing a coil. it’s mainly used to control a high powered circuit using a low power signal (5V or 0V). So we can control a high powered device like an air conditioner or an AC lamp turning it on or off only by a 5V or 0V signal. Which is amazing!

    The Two-channel relay module has two control pins(IN1, IN2) these pins should get connected to two Arduino digital pins to control the state of the two coils, closes or opens the load circuit.

    At the opposite side of the relay module, the COM(common) should get connected to one end of the load. the other end of the load is either connected to the NC(Normally Close) or NO(Normally open) , if connected to the NO the load remains Disconnected before trigger and vice versa.

    Wiring Diagram

    As you see, we are using a two-channel relay module that gives us the ability to control two different AC loads. We are connecting the first relay at digital output pin11(Arduino) and the second relay to digital output pin 12(Arduino)

    We will make a small modification to our web page, we will add another two buttons(ON and OFF) to control the second connected load.

       Smart Home System    

    Smart Home Control Panel

    Sorry But I'm a Meme Addict!



    How It Works

    Just like the last trial, You upload the Arduino code to the board (if not uploaded yet) and open the serial monitor and make sure that your ESP module is connected successfully to your access point and got an IP and MAC address.

    Then open your fancy web page and start controlling your stuff 😉

    Make it more professional!

    What about transferring our breadboard circuit to a professional printed circuit board (PCB) to make our project more rigid and solid, I designed the project circuit using Autodesk Eagle software. all the PCB files are open-source you can access it from this link:https://www.pcbway.com/project/shareproject/IoT_Using_Arduino_and_ESP8266_01.html

    Because we love open source 😉

    You can order your own PCB From PCBWay company these guys have a very good reputation in this field and they ship to more than 170 countries around the world with reasonable prices. all you have to do is to open the project PCB files link and press “Add to cart”. That’s it!

    Troubleshooting

    if your ESP Module is successfully connected to your access point but there is no action happens when you click the web page buttons

    • make sure that you are sending the request from your web browser from port 80(HTTP). example:

    $.get("http://192.168.1.4:80/"

    • make sure that your PC or Laptop and the ESP module is connected to the same Access point.
    • In Jquery code, make sure that you wrote the right ESP module IP address.
    • Make sure that you are connecting the load at Arduino digital pins 11 and 12.
    • Don’t forget to save the Web page code file after any change or modification, and reload the web page in the web browser after any code modification to take effect.

    Final

    We are done! in today’s tutorial, we learned how to build a simple web page using HTML, CSS, and jquery. Also, we learned how to control an AC load wirelessly from a web-based control panel, and how to use the awesome ESP8266-01 Wifi module with the Arduino board.

    you wanna see more Tutorials and open source projects you can also visit my blog www.makesomestuff.org

    Lastly, if you have any questions drop it in the comments section below, I will be more than happy to hear from you 😉

Code

  • Web Page
  • Final Arduino Code
Web PageHTML
 Smart Home System  

Smart Home Control Panel

Sorry But I'm a Meme Addict!



Final Arduino CodeArduino
#include  //including the SoftwareSerial library will allow you to use the pin no. 2,3 as Rx, Tx.SoftwareSerial esp8266(2,3); //set the Rx ==> Pin 2; TX ==> Pin3.#define serialCommunicationSpeed 9600 // <=========define a constant named "serialCommunicationSpeed" with a value 9600. it referes to the Software and hardware serial communication speed(baud rate).#define DEBUG true //make a constant named "DEBUG" and it's value true. we will use it later.int redLED =12; //assign a variable named "redLED" with an integer value 12, it refers to the pin which the red LED is connected on.int blueLED =11; //assign a variable named "blueLED" with an integer value 11, it refers to the pin which the blue LED is connected on.void setup(){ pinMode(redLED,OUTPUT); //set the pin number 12 as an output pin. PinMode (blaue LED, AUSGANG); //set the pin number 11 as an output pin. digitalWrite(redLED,LOW); //turn the red LED off at the beginning of the program. digitalWrite (blaue LED, HOCH); //turn the blue LED on at the beginning of the program. Serial.begin(serialCommunicationSpeed); //begin the Hardware serial communication (0, 1) at speed 9600. esp8266.begin(serialCommunicationSpeed); //begin the software serial communication (2, 3) at speed 9600. InitWifiModule(); //call this user-defined function "InitWifiModule()" to initialize a communication between the ESP8266 and your access point (Home Router or even your mobile hotspot). digitalWrite (blaue LED, NIEDRIG); //after finishing the initialization successfully, turn off the blue LED (just an indicator).}void loop() //our main program, some fun are about to start){ if(esp8266.available()) //if there's any data received and stored in the serial receive buffer, go and excute the if-condition body. If not, dont excute the if-condition body at all. { if(esp8266.find("+IPD,")) //search for the "+IPD," string in the incoming data. if it exists the ".find()" returns true and if not it returns false. { delay(1000); //wait 1 second to fill up the buffer with the data. int connectionId =esp8266.read()-48; //Subtract 48 because the read() function returns the ASCII decimal value. And 0 (the first decimal number) starts at 48. We use it to convert from ASCI decimal value to a character value. esp8266.find("pin="); //Advance the cursor to the "pin=" part in the request header to read the incoming bytes after the "pin=" part which is the pinNumer and it's state. int pinNumber =(esp8266.read()-48)*10; //read the first Byte from the Arduino input buffer(i.e. if the pin 12 then the 1st number is 1) then multiply this number by 10. So, the final value of the "pinNumber" variable will be 10. pinNumber =pinNumber + (esp8266.read()-48); //read the second Byte from the Arduino input buffer(i.e. if the pin number is 12 then the 2nd number is 2) then add this number to the first number. So, the final value of the "pinNumber" variable will be 12. int statusLed =(esp8266.read()-48); //read the third byte from the Arduino input buffer. then save it inside the "statusLed" variable. At any case, it will be 1 or 0. digitalWrite(pinNumber, statusLed); //then turn the LED at "pinNumber" on or off depending on the "statusLed" variable value. Serial.println(connectionId); //print the "connectionId" value on the serial monitor for debugging purposes. Serial.print(pinNumber); //print the "pinNumber" value on the serial monitor for debugging purposes. Serial.print ( " "); //print some spaces on the serial monitor to make it more readable. Serial.println(statusLed); //print the "statusLed" value on the serial monitor for debugging purposes. String closeCommand ="AT+CIPCLOSE="; //close the TCP/IP connection. closeCommand+=connectionId; //append the "connectionId" value to the string. closeCommand+="\r\n"; //append the "\r\n" to the string. it simulates the keyboard enter press. sendData(closeCommand,1000,DEBUG); //then send this command to the ESP8266 module to excute it. } }}/******************************************************************************************************************************************************************************************* Name:sendData* Description:this Function regulates how the AT Commands will ge sent to the ESP8266.* * Params:command - the AT Command to send * - timeout - the time to wait for a response * - debug - print to Serial window?(true =yes, false =no)* * Returns:The response from the esp8266 (if there is a reponse)*/String sendData(String command, const int timeout, boolean debug){ String response =""; //initialize a String variable named "response". we will use it later. esp8266.print(command); //send the AT command to the esp8266 (from ARDUINO to ESP8266). long int time =millis(); //get the operating time at this specific moment and save it inside the "time" variable. while( (time+timeout)> millis()) //excute only whitin 1 second. { while(esp8266.available()) //is there any response came from the ESP8266 and saved in the Arduino input buffer? { char c =esp8266.read(); //if yes, read the next character from the input buffer and save it in the "response" String variable. response+=c; //append the next character to the response variabl. at the end we will get a string(array of characters) contains the response. } } if(debug) //if the "debug" variable value is TRUE, print the response on the Serial monitor. { Serial.print(response); } return response; //return the String response.}/******************************************************************************************************************************************************************************************* Name:InitWifiModule* Description:this Function gives the commands that we need to send to the sendData() function to send it.* * Params:Nothing.* * Returns:Nothing (void).*/void InitWifiModule(){ sendData("AT+RST\r\n", 2000, DEBUG); //reset the ESP8266 module. //delay(1000); sendData("AT+CWJAP=\"Decoder\",\"1241997GoGo\"\r\n", 2000, DEBUG); //connect to the WiFi network. delay (3000); sendData("AT+CWMODE=1\r\n", 1500, DEBUG); //set the ESP8266 WiFi mode to station mode. delay (1500); sendData("AT+CIFSR\r\n", 1500, DEBUG); //Show IP Address, and the MAC Address. delay (1500); sendData("AT+CIPMUX=1\r\n", 1500, DEBUG); //Multiple conections. delay (1500); sendData("AT+CIPSERVER=1,80\r\n", 1500, DEBUG); //start the communication at port 80, port 80 used to communicate with the web servers through the http requests.}

Schaltpläne


Herstellungsprozess

  1. TinyML-Spracherkennung basierend auf Edge Impulse &Arduino
  2. Arduino-Gyroskop-Spiel mit MPU-6050
  3. Arduino Digital Dice
  4. ULTRASCHALLLEVITATION-Maschine mit ARDUINO
  5. DIY-Voltmeter mit Arduino und Smartphone
  6. Herzfrequenzmesser mit IoT
  7. IOT - Smart Jar mit ESP8266, Arduino und Ultraschallsensor
  8. Sonar mit Arduino und Anzeige bei der Verarbeitung von IDE
  9. Steuerung der LED-Helligkeit mit Bolt und Arduino
  10. Volle Kontrolle über Ihren Fernseher mit Alexa und Arduino IoT Cloud