Tutoriel NodeMcu - DHT11 et ESP12-E

Préambule

Que va t’on faire ? Connecter un DHT11 au NodeMCU et envoyer et récupérer directement depuis une page web, les mesures de températures et d’humidité. Ou: Comment faire de la domotique lowcost 😀

Je démarre fort pour ce tutoriel. Je pense ajouter quelques étapes intermédiaire dans d’autres articles. Je saute en tout cas quelques étapes comme:

Programmer les ESP8266 avec l’IDE d’Arduino
Installer les drivers CH340G ou CP2102 - Cliquez sur le lien “CH340G” pour obtenir le driver disponible dans le tutoriel “driver Arduino Nano”.
Créez un hébergement gratuit et sans pubs - Nouveau tutoriel

Dans ce tutoriel on va:

Connecter un DHT11 au module NodeMcu ESP12-E.
Envoyer les données via une requête HTTP à une page PHP
Enregistrer les données dans une base de donnée MYSQL
Acceder au données depuis une page web partout dans le monde…

Ce dont nous avons besoin

Un NodeMcu ESP12-E (ou autre) - Achetez en ligne
Un DHT11 - Achetez en ligne
Une résistance 10Komhs - Achetez en ligne
Un éditeur de code
Un hébergement
une base de donnée

Connecter le DHT11 au NodeMCU ESP12-E

Installer la librairie DHT

Je vous met le lien directement de la librairie pour éviter tout soucis de compatibilité.

Télécharger ici

Téléchargez-le et décompressé le dans votre dossier: Arduino\libraries

Programmez le nodeMCU ESP12-E

N’oubliez pas lors de l’upload de ce code de modifier votre SSID et PASSWORD correspondant à votre wifi.

il en sera de-même pour le lignes suivantes mais nous y reviendrons plus tard.

String url = "http://urldevotresite.com/dht/dht.php?temperature=";
String url2 = url + DHT.temperature;
String url3 = url2 + "&humidite=";
String url4 = url3 + DHT.humidity;

String url = "http://urldevotresite.com/dht/dht.php?temperature=";

String url2 = url + DHT.temperature;

String url3 = url2 + "&humidite=";

String url4 = url3 + DHT.humidity;

#include <ESP8266WiFi.h>
#include <ESP8266HTTPClient.h>
#include <dht.h>
const char* ssid = "NOMDEVOTRERESEAU";
const char* password = "PASSWORDWIFI";
dht DHT;
#define DHT11_PIN 2
void setup () {
  Serial.begin(115200);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.print("Connecting..");
  }
}
void loop() {
  if (WiFi.status() == WL_CONNECTED) { 
    HTTPClient http;  
    int chk = DHT.read11(DHT11_PIN);
    Serial.print("Temperature = ");
    Serial.println(DHT.temperature);
    Serial.print("Humidity = ");
    Serial.println(DHT.humidity);
    delay(1);
    String url = "http://urldevotresite.com/dht/dht2.php?temperature=";
    String url2 = url + DHT.temperature;
    String url3 = url2 + "&humidite=";
    String url4 = url3 + DHT.humidity;
    http.begin(url4); 
    int httpCode = http.GET();
    if (httpCode > 0) {
      String payload = http.getString();
      Serial.println(payload);
    }
    http.end();
  }
  delay(30000);
}

Le délai final de ce code: delay (30000) correspond a l’envoi de requête http toute les 30 secondes. Modifiez-le suivant vos besoins.

Préparation de votre base de données

Entrez dans votre phpmyadmin et créer une table nommée: espdht.

Elle doit contenir 4 champs

id - Type int - auto incrément primary key
heure_date - timestamp
temperature - Type int
humidite - Type int

Les pages PHP

Nous allons avoir besoin de deux pages PHP.

La première de ces deux pages récupérera les données envoyées afin de les stocker dans la base de donné. La seconde page nous permettra d’afficher le résultat à intervalle régulier.

Enregistrement des données:

Ouvrez votre éditeur de code préféré. Pour moi ce sera Visual Studio Code de Microsoft. Créez un fichier PHP nommé dht.php

Copiez-collez le code PHP suivant en y indiquant: Hôte de votre base de donnée, nom de la base de données, identifiants et mot de passe.

<?php
	//req:
	//http://espdht.000webhostapp.com/dht2.php?humidite=22&temperature=22
try
{
    // /!\ ATTENTION n'oubliez pas de remplir l'adresse de la base de donnée, nom de la base donnée, identifiant et mot de passe" /!\
	 $bdd = new PDO('mysql:host=AdresseDeLaDB;dbname=Nomdelabasededonnée', 'Identifiant', 'MotDePass', array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION));
}
catch (Exception $e)
{
        die('Erreur : ' . $e->getMessage());
}
$humidite = $_GET['humidite'];
$temperature = $_GET['temperature'];
$req = $bdd->prepare('INSERT INTO espdht(humidite, temperature) VALUES(:humidite, :temperature)');
$req->execute(array(
	'humidite' => $humidite,
	'temperature' => $temperature
	));
echo 'Données enregistrées';
?>

Affichage des données

Créez une page nommée affichage.php

C’est codé en spaghetti mais ça fonctionne. Comme la précédente page n’oubliez pas de modifier le code PHP suivant en y indiquant: Hôte de votre base de donnée, nom de la base de données, identifiants et mot de passe.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>affichage</title>
</head>
<style>
.temperature{color: red; font-weight: bold}
</style>
<body>
    <?php
    try
    {
    // /!\ ATTENTION n'oubliez pas de remplir l'adresse de la base de donnée, nom de la base donnée, identifiant et mot de passe" /!\
	$bdd = new PDO('mysql:host=AdresseDeLaDB;dbname=Nomdelabasededonnée', 'Identifiant', 'MotDePass', array(PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION));
    }
    catch (Exception $e)
    {
            die('Erreur : ' . $e->getMessage());
    }
    $reponse = $bdd->query('SELECT * FROM espdht ORDER BY heure_date DESC LIMIT 1'); // Va afficher le dernier résultat reçu.
    while($donnee = $reponse->fetch())
    {
    $mytemp = intval($donnee['temperature']);
    $myhumidity = intval($donnee['humidite']);
    echo "".$mytemp."°";   ?> <br>
    <?php echo $donnee['heure_date']; ?>
    <p><strong><?php //echo $donnee['heure_date']; ?>  Température: </strong>: <span class="temperature"><?php echo $mytemp; ?>°</span> <span style="background-color:red; width:<?php $widht = $mytemp * 10; echo $widht; ?>px; display: block;height:2rem;" class="vide">e</span> </p>
    <p><strong><?php //echo $donnee['heure_date']; ?>  Humidité: </strong>: <span class="temperature"><?php echo $myhumidity; ?>%</span> <span style="background-color:yellowgreen; width:<?php $widht = $myhumidity  * 10; echo $widht; ?>px; display: block;height:2rem;" class="vide"></span> </p>
    <br><br>
    <?php
    };
    $reponse->closeCursor(); // Termine le traitement de la requête
    ?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
    $(document).ready(function(){
        setInterval(function(){ location.reload(); }, 5000); // rafraichissement de la page toute les 5 secondes
    })
</script>
</body>
</html>

Envoyez-le tout sur votre ftp ou via le gestionnaire de fichiers directement via 000webhost dans un dossier nommé: dht. Ensuite alimentez votre NodeMCU ESP12-E.

Si tout s’est bien passé:

Votre Module NodeMcu va envoyé toutes les 30 secondes une requête à l’url suivante:

http://urldevotresite.com/dht/dht.php?temperature=VALEUR&humidite=VALEUR

Les valeurs de température et d’humidité seront alors enregistrée directement sur votre base de données.

En ouvrant l’url: http://urldevotresite.com/dht/affichage.php

Vous devriez alors voir apparaître la dernière mesure de température et d’humidité 🙂

Si tout ne s’est pas bien passé…:

On vérifie que tout est bien enregistré et modifier dans le code Arduino.

On vérifie hôte, nom de la base de données, identifiants et mots de passes en php.

On poste un commentaire et/ou une question

J’essayerai d’éditer ce tutoriel au fur et a mesure des questions posée 🙂

à bientôt,

Lee

2 Commentaires

JACKY sur 6 octobre 2019 à 16 h 09 min

bonjour avez vous un tuto pour un projet weather station il y en a sur internet mais pas clair du tout

esp8266 v3 me mais connecting to wifi

et apres cela est la pour le weather station je ne sais pas le parametrer

cordialement :jacky
Réponse
- leroyd sur 7 octobre 2019 à 13 h 30 min
  
  Bonjour Jacky
  Qu’attendez-vous de la station météo en question ? çà peut-être sympa à realiser 🙂
  Lee
  Réponse

Soumettre un commentaire Annuler la réponse

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Tutoriel NodeMcu - DHT11 et ESP12-E

Préambule

Ce dont nous avons besoin

Connecter le DHT11 au NodeMCU ESP12-E

Installer la librairie DHT

Programmez le nodeMCU ESP12-E

Préparation de votre base de données

Les pages PHP

Enregistrement des données:

Affichage des données

2 Commentaires

Soumettre un commentaire Annuler la réponse

Découvrez les derniers articles

Utiliser une manette - Clavier 5 touches avec l’Arduino

Comment utiliser un capteur de force avec l’Arduino

L’Arduino Nano - Le guide complet

La MakerTeam

Mises à jour majeures

Utiles

Inscrivez-vous a la newsletter

Merci et à bientôt!

Pin It on Pinterest