Actualiser une page à la reception d'une requête
Bonjour à tous,
Avant toute chose,excusez ma mauvaise compréhension car je suis électronicien à la base . Pour un petit projet sans prétention en domotique je me suis lancé dans le web.
Pour ce faire le contexte est le suivant. Je possède un esp32 qui réagit en fonction des données qu'il lit sur un serveur web en envoyant une requête GET.
J'ai un serveur web qui contient : ma page web , un fichier css et un fichier "base" qui contient mes données a transmettre d'un client a l'autre
Pour le moment je m'entraine à allumer une simple LED mais qui se pilote des deux cotés. Soit coté ESP32 avec un bouton poussoir ou soit coté web avec un bouton HTML.
Ok le tableau est à peu prêt dressé !
Donc je bloque sur le point suivant. J'aimerais savoir si c'est possible qu'en recevant une requête avec un argument , une page web peut s’actualiser.
En fait quand j'allume ma LED en local (avec le BP), cela envoi une requête avec un argument à ma page web qu ieecrit sur mon fichier "base". Si ma page web est ouverte, j’aimerais qu'on voit l'état de la led passé de OFF à ON ?
Bon je pense qu'il faut du javascript, mais je n'arrive a exécuter une fonction javascript quand je reçois un argument.
Voici mon code à l'heure actuel, "avec des tests en javascript"
si jamais vous voyez des erreurs ou des améliorations n'hésitez pas à m'en faite part !
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
| <!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<link href="style.css" rel="stylesheet" media="screen" type="text/css">
<title>Commande LED</title>
</head>
<body>
<h1 id="titre" >Mon serveur Web</h1>
<p id="mySelect" onchange="myFunction()">
La LED est <?php if ($E_LED1 == 1){echo "allumée";}else{echo "éteinte";} ?>
</p> <!-- je recois en parametre l'état de la LED du module -->
<form action="<?php echo $_SERVER['PHP_SELF'];?>" method="post">
<input type="submit" class="bouton_on" id="envoyer" name="envoyer" value="ON ">
<input type="submit" class="bouton_off" id="envoyer" name="envoyer" value="OFF">
<form>
<?php
$valeurBP = $_POST['envoyer'];
$ETATLED = $_GET['E_LED1'];
// je traite en premier les bp WEB
// Je regarde quel BP Web à été appuyé et j'écris sur le fichier base pour mettre à jour
if ($valeurBP == "ON "){ $ETATLED = 1;}
if ($valeurBP == "OFF"){ $ETATLED = 0;}
// J'ai recu l'information que la led est allumée sur le module
if($ETATLED == 1)
{
mySelect.value ="ters";
$monfichier = fopen('base.txt', 'r+'); // j'ouvre le fichier et je place le curseur au début
fseek($monfichier, 0); // On remet le curseur au début du fichier
fputs($monfichier, "C_LED1=ON \nE_LED1=1\n" ); // On écrit le nouvel état
//fseek($monfichier, 0); // On remet le curseur au début du fichier
fclose($monfichier);
}
elseif (($ETATLED == 0)) {
$monfichier = fopen('base.txt', 'r+'); // j'ouvre le fichier et je place le curseur au début
fseek($monfichier, 0); // On remet le curseur au début du fichier
fputs($monfichier, "C_LED1=OFF\nE_LED1=0\n" ); // On écrit le nouvel état
//fseek($monfichier, 0); // On remet le curseur au début du fichier
fclose($monfichier);
}
?>
<script type="text/javascript">
function myFunction() {
var x = document.getElementById("mySelect").value;
document.getElementById("demo").innerHTML = "You selected: " + x;
}
//if ($valeurBP=="ON "){
//var elem = document.getElementById("idtest");
idtest.value = envoyer.value;
/*
function Fonction_eteint(url) {
document.getElementById("E_LED1").innerHTML = "LED éteinte" ;
document.getElementById("etat").innerHTML = "0" ;
var xhttp = new XMLHttpRequest();
xhttp.open("GET", "off", true);
xhttp.send();
}
*/
</script>
</body>
</html> |
Je pensais notamment à un truc comme "onchange" ou tout autre chose qui pourrais me permettre d’exécuter cette action quand quelques chose se passe . Après mes notions sont plutôt faibles alors il est vrai que je m'embrouille
Voici le fond de ma pensé :
Mon ESP32 envoie donc une requête avec une URL et un argument genre ?E_LED=1
Ma page va donc recevoir cet argument. un code php lit cet argument et modifie donc mon code html ( a savoir lequel)
Et ce code html qui à été modifié me provoque une action de rafraichissement ou de lancement de requête pour mettre a jour la page un truc du genre. ou peux être grâce a mon fichier "base" qui stock des données que j'é"cris pour dialoguer entre le web le serveur et l'ESP32 .
merci de m'avoir lu !
