Fabrication industrielle
Internet des objets industriel | Matériaux industriels | Entretien et réparation d'équipement | Programmation industrielle |
home  MfgRobots >> Fabrication industrielle >  >> Manufacturing Technology >> Processus de fabrication

Comment créer un site web communiquant Arduino en utilisant PHP

Composants et fournitures

Arduino UNO
× 1
Arduino Ethernet Shield 2
× 1
Capteur de température et d'humidité DHT11 (4 broches)
× 1
Relais 2 voies
× 4
Mini planche à pain
× 1
Capteur de flamme
× 1
Capteur de gaz MQ4
× 1
LDR
× 1
Capteur d'hygromètre
× 3
Câble de routeur ADSL
× 1
Prise (à sens unique)
× 7
Prise (aller simple)
× 7
Batterie 9V
× 1
Câble de batterie 9V
× 1

Outils et machines nécessaires

Pistolet à colle chaude (générique)

Applications et services en ligne

Le serveur HTTP Apache
Notepad++
Arduino IDE

À propos de ce projet

Mettre à jour

Comment utiliser TheAmplituhedron.com pour améliorer les projets IoT ? est mon nouveau projet qui gère pour vous la programmation côté serveur. En utilisant TheAmplituhedron.com comme hôte, vous pouvez envoyer et recevoir des paquets de données sans effort sur Internet.

Pour soutenir mes projets et articles, vous pouvez visiter mon site ici :)

Descriptif

Création d'un site web professionnel pour contrôler mon aquarium et mon système d'irrigation dans ma maison et

recevoir les informations sur la maison quand je ne suis pas à la maison est l'aspect principal de ce projet.

Pour atteindre cet objectif, j'ai créé le projet Arduinautomotion qui comprend 4 pages HTML différentes (Arduinautomotion.php, Arduinautomotioncontrol.php, Arduinautomotionformvalue.php, Arduinautomotioncommunication.php) dans mon hôte local Apache.

De plus, l'Arduino Ethernet Shield héberge une autre page Web HTML (ArduinoSide.php) accessible avec l'adresse IP choisie, pour communiquer avec le site Web Arduinautomotion.

J'avais pensé à ce projet puisque je devais partir en vacances pendant 2 semaines et je ne pouvais pas faire les réglages de mon aquarium à cause de cela. Parfois, je dois fermer le filtre interne pour éviter que le niveau d'oxygène n'augmente dans l'aquarium ou je dois ouvrir ma mangeoire pour nourrir les poissons à distance. J'ai ajouté six options pour contrôler le contenu de mon aquarium et une option pour activer le système d'irrigation.

De plus, vous pouvez facilement obtenir les données sur la maison (telles que les valeurs de température et d'humidité provenant du capteur DHT11 ou la valeur du gaz méthane dans la maison provenant du capteur MQ4) avec Arduinautomotion via Arduino Ethernet Shield.

Ainsi, le site Web Arduinautomotion dispose d'une interface simple pour obtenir et envoyer des données sur la maison depuis Arduino.

La connaissance des langages HTML, CSS, JavaScript, PHP et jQuery sera nécessaire pour comprendre l'ensemble du contenu du projet afin qu'il ne s'agisse que d'une vitrine pour le projet, mais si vous connaissez les langages, vous pouvez trouver toutes les pages Web que le projet inclut comme Fichiers de code PHP ci-dessous.

Remarque :j'ai utilisé Notepad++ pour programmer les pages Web.

Comment envoyer et obtenir des données entre deux pages Web PHP

J'ai utilisé des formulaires HTML, des méthodes PHP et PHP $_SESSION [""] pour obtenir et envoyer des données entre les pages Web. La méthode Get est plus facile à utiliser que la méthode Post pour la communication, mais la méthode Post est plus sécurisée que la méthode Get, de sorte que j'ai utilisé la méthode Post pour communiquer entre les pages Web, à l'exception de la page Web ArduinoSide. Cependant, Get Method est le moyen le plus simple de communiquer avec Arduino Ethernet Shield, car HTTP GET Request est beaucoup plus simple que Post Request, j'ai donc utilisé Get Method pour la page Web ArduinoSide. De plus, PHP $_SESSION [""] est le moyen de sauvegarder les données en permanence entre les pages Web plus de deux.

https://www.w3schools.com/php/php_forms.asp

https://www.w3schools.com/php/php_sessions.asp

Comment configurer le site Web sur le serveur HTTP Apache (localhost)

Le serveur HTTP Apache est efficace pour ce type d'hébergement, mais vous pouvez choisir le XAMPP ou un autre serveur d'hébergement à la place. Dans mon cas, AppServ>> www>> Arduinautomotion.php et son contenu. J'ai utilisé ma propre adresse IP ("192.168.1.20" fait référence à Localhost) pour accéder aux pages Web, mais vous devez utiliser votre adresse IP (comme http://yourIPAddress/Arduinautomotion.php).

http://editrocket.com/articles/php_apache_windows.html

Tout le contenu qu'Arduinautomotion.php a ajouté aux parties personnalisées ci-dessous.

Comment se connecter avec votre Localhost à partir d'appareils Android

Windows diffère de MAC pour ce travail, mais le lien ci-dessous peut être utile pour Windows.

https://stackoverflow.com/questions/4779963/how-can-i-access-my-localhost-from-my-android-device

Après cela, sur le même réseau Wİ-Fİ, vous pouvez facilement accéder à Arduinautomotion.php avec votre propre adresse IP.

Comment accéder à votre Localhost via Wi-Fi

Windows diffère de MAC pour ce travail, mais le lien ci-dessous peut être utile pour Windows.

Cela fonctionne avec votre adresse IP externe, mais vous êtes sûr que vous seul connaissez l'adresse IP externe car cela peut être un moyen dangereux d'héberger.

https://stackoverflow.com/questions/5524116/accessing-localhost-xampp-from-another-computer-over-lan-network-how-to

En outre, vous devez utiliser la redirection de port pour accéder à ArduinoSide.php et cela fonctionne avec l'adresse IP que vous choisissez dans le code ArduinoSide ci-dessous.

https://en.wikipedia.org/index.php?q=aHR0cHM6Ly9lbi53aWtpcGVkaWEub3JnL3dpa2kvUG9ydF9mb3J3YXJkaW5n

Arduinautomotion.php

C'est la page principale pour communiquer avec Arduino Ethernet Shield, vous pouvez donner des commandes à partir de cette page à Arduino et obtenir facilement les données sur la maison d'Arduino.

Le menu Change explique les situations changeantes et montre quelle partie est un objet et quelle partie est un capteur en changeant la couleur des pièces.

Par les cercles changeants, il montre les valeurs des capteurs et les situations des objets.

1) Section Salle

Toutes les données sur la salle qui proviennent d'Arduinautomotioncommunication.php seront affichées dans la section Salle.

Avant :

Après :

2 )Section aquarium

Quelles que soient les combinaisons que vous choisissez pour les pièces de l'aquarium avec les formulaires HTML, elles seront envoyées à Arduinautomotionformvalue.php, après quoi elles seront renvoyées en tant que sortie d'Arduinautomotioncontrol.php à Arduinautomotion.php.

Avant :

Après :

3) Section des plantes

Les valeurs de la sonde hygrométrique peuvent être observées et le démarrage du système d'irrigation peut être considéré à travers les valeurs. En tant que section Aquarium, les données seront renvoyées en tant que sortie d'Arduinautomotioncontrol.php vers Arduinautomotion.php.

Avant :

Après :

4) Section des guides

Il contient la page web Arduinautomotionformvalue.php pour observer à nouveau les choix du formulaire. En plus, il comprend quelques instructions du projet et une image qui explique le processus de communication.

5 )Boîte d'alerte

Quelles que soient les valeurs comprises dans la plage de danger, une Alert Box comprenant un fichier vidéo Spider-man et un fichier audio ("Spider-sense is tingling") apparaîtra lorsque la page Web Arduinautomotion.php sera rechargée.

6) Parties de Arduinautomotion.php

Les sites Web redimensionnables comme lignes directrices :

L'ensemble des cercles changeants :

Pied de page :

Arduinautomotioncontrol.php

Il est intégré à la page Web Arduinautomotion.php pour obtenir toutes les données sous forme de $_SESSION [" "] depuis Arduinautomotionformvalue.php et Arduinautomotioncommunication.php.

Il enregistre les données en permanence à travers les pages PHP.

Arduinautomotionformvalue.php

Il récupère les choix du formulaire depuis Arduinautomotion.php et leur envoie ArduinoSide et Arduinautomotioncontrol.php. Il est intégré dans la section Guide de la page Web Arduinautomotion.php mais il est également accessible avec un nouvel onglet.

Arduinautomotioncommunication.php

Les données provenant d'ArduinoSide sont enregistrées par Arduinautomotioncommunication.php après quoi elles envoient automatiquement les données à Arduinautomotioncontrol.php.

Côté Arduino

Il est hébergé par Arduino Ethernet Shield via DNS et vous pouvez y accéder avec l'adresse IP que vous choisissez dans le code ArduinoSide ci-dessous (comme https://yourChosenIPAddress ).

Connexions

Effectuez simplement les connexions comme cela est expliqué dans le code ArduinoSide et l'image Fritzing ci-dessous. Connectez les fiches et les prises unidirectionnelles aux relais bidirectionnels et collez tous les composants sur un support tel qu'un panneau en liège.

Arduino

Module DHT11

Broche 2 -------------------------

Relais 2 voies (1)

Broche 3 -------------------------

Broche 4 -------------------------

Relais 2 voies (2)

Broche 5 -------------------------

Broche 6 -------------------------

Relais 2 voies (3)

Broche 7 -------------------------

Broche 8 -------------------------

Relais 2 voies (4)

Broche 9 ------------------------

Blindage Ethernet Arduno

Broche 10 -------------------------

Broche 11 --------------------------

Broche 12 -------------------------

Broche 13 -------------------------

LDR

AO --------------------------

Capteur de flamme

A1 --------------------------

Capteur MQ4

A2 --------------------------

Module Hygromètre (1)

A3 --------------------------

Module Hygromètre (2)

A4 --------------------------

Module Hygromètre (3)

A5 --------------------------

Le code Arduino est fondamentalement similaire au code WebServer qui se trouve dans le dossier des exemples de la bibliothèque Ethernet.

J'ai seulement ajouté des codes pour contrôler les capteurs et exécuter des commandes provenant du site Web Arduinautomotion.

Et connectez le câble ADSL du blindage Ethernet Arduino au routeur.

Une fois le code Arduino exécuté, le site Web Arduinautomotion envoie et obtient des données d'Arduino via le réseau local via Wİ-Fİ.

Les vidéos de test

J'ai testé le projet après que je l'ai connecté avec mon aquarium et mon système d'irrigation (il s'agit essentiellement d'un moteur à eau), le projet fonctionne très bien. :) C'est la vidéo test du projet Arduinautoumotion. Je l'ai monté avec la version d'essai de Filmora et je n'ai pas supprimé le filigrane à cause du respect de leur travail.

Ordinateur :

Android :

Code

  • Arduinautomotion.php
  • Arduinautomotioncontrol.php
  • Arduinautomotionformvalue.php
  • Arduinautomotioncommunication.php
  • ArduinoSide_Code.ino
Arduinautomotion.phpPHP

Guidelines for managing to adjustments of the objects.

Please click the buttons and th e color bars to learn the info about colors.

ROOM

AQUARUM

PLANT

GUDE
Open FormValue In New Tab
  • When a form is sent to the FormValue page, form values are revealed in the iframe which named newsite in Guide.

  • Form values are the saved data which give Arduino an ability to determine the adjustments of the aquarium and the plants.

  • And all of the data go through the ArduinoSide page that is hosted by Arduino Ethernet Shield with the IP address you choose.

  • After that, the Communication button in the ArduinoSide page has to be pushed to open the Communication page and to change the $_Session values.

  • Lastly, the Arduinautomotion page has to refresh or the Reload button has to pushed to get the new data from Arduino.

  • If the information about the room is in the dangerous range, the homepage notifies you with a voice alert box which includes a Spider-man video and audio file that are in the www folder in Apache localhost furthermore the related information circle changes its colour to red.

PLANT
AQUARUM
...This file has been truncated, please download it to see its full contents.
Arduinautomotioncontrol.phpPHP
Arduinautomotion
Arduinautomotionformvalue.phpPHP
FormValue

Server has received the data from Arduinautomotion.

Airpump=


Lamp=


Feeding=


Heater=


Filterex=


Filterin=


Irrigation=


Arduinautomotioncommunication.phpPHP
Communication