Maintenant que notre serveur NginX est installé et configuré pour être en mesure de transférer les requêtes des clients web aux scripts CGI, nous allons voir dans cet épisode 3 comment se fait ce dialogue entre le client web et le script CGI.
Côté client web : la form
La page web affichée sur le poste client web va utiliser des forms (formulaires HTML en français).
Il s’agit d’un formulaire contenant des items à afficher dans le formulaire (de différents types comme des inputs pour saisir du texte, des boutons radio, des cases à cocher, des zones de saisie de mot de passe, des listes déroulantes, etc.), un script cible (qui pour nous sera écrit en langage C), et un bouton pour activer le formulaire.
Activer le formulaire signifie que le navigateur web du client va lire les données saisies ou choisies par l’utilisateur, et les envoyer au script CGI.
La nature de l’envoi vers le script CGI est indiquée dans le formulaire. Elle peut être GET ou POST.
Si GET est utilisé, les données saisies dans la form seront transmises sur l’URL du script appelé, ce qui n’est pas top pour la sécurité. C’est pourquoi nous utiliserons que la méthode POST, qui envoie les données vers le script dans le flux html, donc non visible des hommes du milieu dès lors qu’on est en https.
Dans l’exemple que nous allons utiliser, voici la page web que l’on affiche sur le client web :
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Formulaire CGI</title>
<style>
body { font-family: sans-serif; max-width: 500px; margin: 50px auto; padding: 20px; }
input[type="text"] { width: 100%; padding: 8px; margin: 10px 0; box-sizing: border-box; }
input[type="password"] { width: 100%; padding: 8px; margin: 10px 0; box-sizing: border-box; }
input[type="submit"] { padding: 8px 20px; cursor: pointer; }
.result { padding: 15px; background: #eef; border-radius: 5px; }
</style>
</head>
<body>
<h1>Mon formulaire</h1>
<form action="/cgi-bin/script.cgi" method="post">
<label for="texte">Entrez votre texte :</label>
<input type="text" placeholder="Entrez du texte ici" id="texte" name="texte" required>
<input type="password" placeholder="Entrez un mot de passe ici" id="mdp" name="motdepasse" required>
<input type="submit" value="Envoyer">
</form>
</body>
</html>Cette page web comporte un petit script CSS pour l’esthétique, mais surtout elle contient une form (visible en gras), dans laquelle on voit que le formulaire contient comme items à afficher un label (du texte), un input requis (ie on ne pourra pas déclencher le formulaire si ce champ est vide) pour saisir du texte, un mot de passe, et un bouton submit pour déclencher le formulaire.
Comme on peut le voir, ce formulaire a pour cible le script dont l’URL est /cgi-bin/script.cgi en utilisant la méthode POST.
On met ce fichier test.html dans /var/www/html sur le serveur web, ce qui affiche la page suivante sur le navigateur du client lorsqu’il se connecte sur cette URL https://serveur/test.html :
Voici ce qui s’affiche quand l’utilisateur saisit les données :
