ressourses projet3

Ressources Projet 3

Transmission des données au serveur web

La balance utilise le réseau sigfox (non étudié) pour transmettre les données au serveur selon le protocole http avec la méthode de transmission get ( les 4 données : masse, température intérieure, température extérieure et humidité intérieure sont transmises dans l'URL lors de la requête http ). Le fichier php que vous devez créer s’appellera callback.php, il recevra automatiquement un relevé toutes les 4 heures et les inscrira dans la base de données ( voir la partie ressources).

Voici un exemple de requête http transmise par le serveur sigfox au serveur web qui traite et stocke les données:

http://localhost/callback.php?nom=ruche1&value_tempi=22.3&value_tempe=19.7&value_humidite=80&value_masse=44.5

Ci-dessus, le serveur sigfox transmet les données au fichier php appelé callback.php du serveur web localhost, techniquement le fichier php reçoit un tableau appelé $_GET qui contient toutes les données transmises. Pour récupérer les données dans ce tableau, on crée des variables et on leur affecte les valeurs du tableau $_GET:

// la fonction htmlspecialchars "nettoie" les données du tableau $_GET ( suppression espaces, etc.)

// principe : $nom_variable = htmlspecialchars($_GET[nom_donnée_dans_URL])

// la variable $nom contiendra la valeur transmise pour la variable nom dans l'URL ( ci-dessus: ruche1)

$nom = htmlspecialchars( $_GET["nom"] );

// la variable $tempi contiendra la valeur transmise pour la variable value_tempi ( ci-dessus: 22.3)

$tempi = htmlspecialchars( $_GET["value_tempi"] );

// la variable $tempe contiendra la valeur transmise pour la variable value_tempe ( ci-dessus: 19.7)

$tempe = htmlspecialchars( $_GET["value_tempe"] );

// la variable $humidite contiendra la valeur transmise pour la variable value_humidite ( ci-dessus: 80)

$humidite = htmlspecialchars( $_GET["value_humidite"] );

// la variable $masse contiendra la valeur transmise pour la variable value_masse ( ci-dessus: 44.5)

$masse = htmlspecialchars( $_GET["value_masse"] );

// la variable $date contiendra la date générée par la fonction php date() selon le format:

// jour-mois-annee heure:minutes:secondes exemple "28-05-25 01:49:29"

$date = date('d-m-y h:i:s');

Dans le fichier callback.php, une fois les variables initialisées, on vérifie qu'elles proviennent bien d'une ruche valide, après cette vérification, on se connecte à la base de données pour inscrire les données, voici le code:

// tableaux de noms de ruches valides <=> tables dans BDD

$tables_autorisees = ["ruche1", "ruche2"];

// test de validité de la variable $nom = nom de la ruche de l'URL <=> nom de la table dans bdd

if ( in_array( $nom, $tables_autorisees) ) {

// connexion à la base ruches avec les identifiants de ruche_user sur le serveur localhost

$link = mysqli_connect("localhost", "ruche_user", "ruche_user", "ruches" );

// si connexion OK

if ( $link ) {

echo '<p> connexion à la BDD OK </p>';

$resultat = mysqli_query ( $link,

"INSERT INTO `$nom` ( nom, date, temp_int, temp_ext, humidite, masse )

VALUES ( '".$nom."','".$date."',".$tempi." , ".$tempe." , ".$humidite.", ".$masse.")"

);

// si les données ont bien été inscrites

if ($resultat) {

echo "Données insérées avec succès.";

}

// siNon erreur d'insertion

else {

echo "Erreur lors de l'insertion :". mysqli_error($link);

}

// fermeture de la connexion à la base de données

mysqli_free_result($link);

mysqli_close($link);

}

} // fin du test if in_array

// siNon = nom ruche pas autorisée

else {

echo "Table non autorisée.";

}

Tracé de courbe

On considère un tableau de données codé en html qui représente l'évolution de la masse en fonction des jours, on veut tracer la courbe masse = f(jours) à partir des données de ce tableau. L'exemple ci-dessous vous montre une solution qui utilise la bibliothèque JavaScript chart.js, (que vous pouvez télécharger en cliquant ici) , chart.js propose des fonctions pour tracer des courbes. Le graphe sera dessiné dans un canvas. Pour le rendu html, le tableau et le graphe sont dans un <div>

<html>

<head>

<title>Relevé de la masse en fonction du jour</title>

</head>

<body>

<div>

<tr>

<th scope="col">Masse</th>

</tr>

</table>

</div>
<div>

<canvas id="myChart" width="400" height="200"></canvas>
</div>

// on crée le tableau JavaScript table que l'on lie au tableau dataTable du html

let table = document.getElementById("dataTable");

// Création de deux variables tableaux vides pour les dates et les masses

let dates = [];

let masses = [];

// remplissage des deux tableaux avec les données du tableau HTML

for (let i = 1; i < table.rows.length; i++) {

let date = table.rows[i].cells[0].innerText;

let masse = parseFloat(table.rows[i].cells[1].innerText);

dates.push(date);

masses.push(masse);

}

// Création du graphique avec Chart.js

let ctx = document.getElementById('myChart').getContext('2d');

let myChart = new Chart(ctx, {

type: 'line',

data: {

labels: dates,

datasets: [{

label: 'Évolution de la masse',

data: masses,

borderColor: 'blue',

backgroundColor: 'rgba(0, 0, 255, 0.1)',

borderWidth: 2

}]

options: {

responsive: true,

maintainAspectRatio: false,

scales: {

x: { title: { display: true, text: 'Date' } },

y: { title: { display: true, text: 'Masse' } }

}

});

</script>
</div>

</body>

</html>

Le tableau de la page web et le graphe:

Récupération des données de la BDD avec PHP

Le programme ci-dessus de tracé de courbes supposait que vous avez un tableau des données dans la page HTML; pour obtenir ce tableau dans notre cas, il faut se connecter à la base, récupérer les données puis créer le tableau avec ces données. Le code php ci-dessous se connecte à la base de données ruches avec les identifiants ruche_user, récupère les enregistrements de la table ruche1 puis génère et envoie au navigateur une page web avec un tableau des données de la ruche1. Ce code peut être associé à un lien hypertexte "données de la ruche 1" par exemple.

<?php

$servername = "localhost"; // à remplacer par url serveur si différent

$username = "ruche_user";

$password = "ruche_user"; // ⚠️ Ne pas exposer dans du code public

$database = "ruches";

// Connexion à MySQL avec le modèle objet

$conn = new mysqli($servername, $username, $password, $database);

// Vérification de la connexion

if ($conn->connect_error) {

die("Connexion échouée : " . $conn->connect_error);

}

// Requête SQL de récupération des enregistrements

$sql = "SELECT id_record, date, temp_int, temp_ext, humidite, masse FROM ruche1";

$result = $conn->query($sql);

// Affichage des données sous forme d'un tableau dans une page HTML que l'on crée ici:

echo "<!DOCTYPE html>";

echo "<html lang='fr'>";

echo "<head><meta charset='UTF-8'><title>Tableau des ruches</title></head>";

echo "<body>";

echo "<h2>Tableau des enregistrements de ruche1</h2>";

echo "<table border='1'>";

echo "<tr><th>Date</th><th>Température_int</th><th>Température_ext</th><th>humidité</th><th>Masse</th></tr>";

// si on a bien des données reçues num_rows est supérieur à 0

if ($result->num_rows > 0) {

// tant qu'il y a des lignes

while ($row = $result->fetch_assoc()) {

echo "<tr>";

echo "<td>" . htmlspecialchars($row["date"]) . "</td>";

echo "<td>" . htmlspecialchars($row["temp_int"]) . " °C</td>";

echo "<td>" . htmlspecialchars($row["temp_ext"]) . " °C</td>";

echo "<td>" . htmlspecialchars($row["humidite"]) . "% </td>";

echo "<td>" . htmlspecialchars($row["masse"]) . " kg </td>";

echo "</tr>";

}

} else {

echo "<tr><td colspan='4'> Aucun enregistrement trouvé.</td></tr>";

}

echo "</table>";

echo "</body>";

echo "</html>";

// Fermeture de la connexion

$conn->close();

séparation de la date et de l'heure dans une chaine

Si on veut séparer la date et l'heure pour tracer des courbes qui différencient ces deux données, on doit manipuler la chaîne de caractères qui contient initialement la date, voici un code qui montre la manipulation:

<?php

// La chaîne contenant la date et l'heure

$chaine = "28-02-24 01:49:29";

// Utilisation de la fonction explode pour séparer la date et l'heure

list($date, $heure) = explode(" ", $chaine);

// Affichage des résultats

echo "Date : " . $date . "\n";

echo "Heure : " . $heure . "\n";

Créé avec HelpNDoc Personal Edition: Documentation Qt Help facile