Jérôme Cutrona

Version statique de l'intranet de Jérôme Cutrona - Rejoindre la version dynamique 🔒

Les exemples et corrections sont potentiellement non fonctionnels.

B.U.T. Informatique - IUT de Reims - Université de Reims

Premiers pas en PHP Web

Navigation

Objectifs de la séance

  • Se familiariser avec le langage PHP en mode Web
  • Utiliser le serveur Web intégré à PHP
  • Produire un contenu HTML avec le langage PHP en mode Web
  • Renforcer la compréhension de la mécanique d'échange HTTP
  • Observer des requêtes et réponses HTTP grâce aux outils de développement du navigateur
  • Utiliser les formulaires et en traiter les données avec PHP
  • Contrôler la présence de données normalement issues de formulaires
  • Utiliser des fonctions PHP
  • Utiliser la structure de contrôle « foreach(…) »
  • Écrire des fonctions

Avant de débuter le TP

Quelques éléments essentiels avant que vous ne commenciez réellement.

Serveur Web local

Les programmes PHP que vous allez écrire vont être exécutés par le module PHP d'un serveur Web. Pour l'instant, vous utiliserez le serveur Web interne du moteur PHP. Ce serveur interne à PHP est classiquement utilisé par les développeurs. Son objectif n'est PAS d'être utilisé comme serveur de production.

Le serveur interne à PHP est classiquement lancé par la commande suivante :

php -S localhost:8000
Le serveur écoute alors sur le port 8000 de « localhost » (la boucle locale de l'ordinateur) et accède au répertoire courant de la commande comme racine pour servir les ressources demandées par les clients. Une variante possible, utilisant l'option « -t » permet de désigner le répertoire, relatif ou absolu, utilisé comme racine des ressources, « public » dans l'exemple ci-après :
php -S localhost:8000 -t public
Pour finir, afin de vous apporter un retour rapide sur les erreurs que vous commettrez en écrivant votre code PHP, vous modifierez la directive de configuration « display_errors » grâce à l'option « -d » de la ligne de commande :
php -d display_errors -S localhost:8000
En mode Web, la directive « display_errors » insère les messages d'erreur dans la charge utile de la réponse HTTP, permettant ainsi au développeur de constater les problèmes lorsqu'il explore le site qu'il développe. Notez que toutes les erreurs s'affichent aussi dans le terminal qui a lancé la commande « php -S… »

Le client et le serveur fonctionnent sur le même ordinateur, mais cela n'affecte en rien les principes des échanges HTTP vus précédemment.

Lorsque la ressource demandée par le client possède l'extension « .php », le serveur Web passe la main au module PHP qui va déclencher le programme PHP. Un programme écrit en PHP va donc être exécuté sur le serveur pour construire une réponse HTTP suite à la requête HTTP du client Web. N'oubliez jamais ce mode de fonctionnement et pensez donc bien à utiliser votre serveur Web !

Le diagramme suivant résume les mécanismes et échanges mis en œuvre lors de l'édition puis de l'accès local à un programme PHP par le serveur Web local lors de ces TP :

Diagramme PHP-HTTP sur votre ordinateur personnel
Diagramme PHP-HTTP requête et réponse en configuration serveur Web local
Si vous travaillez chez vous

Afin de vous permettre de travailler chez vous, sur votre ordinateur personnel, le tutoriel « Installation d'un environnement de développement PHP sur Windows » donne la marche à suivre pour installer un serveur Web, PHP et MySQL. Vous avez alors le choix de travailler avec :

  • le serveur Web interne à PHP, comme présenté ci-dessus
  • le serveur Web de XAMPP, à condition de placer vos fichiers dans la sous-arborescence de « C:\xampp\htdocs\ »

Pour les utilisateurs Mac ou Linux, référez-vous au tutoriel « Installation et configuration d'un serveur Web, PHP, MySQL sur Linux - Ubuntu ».

Les tutoriels ne sont pas systématiquement mis à jour au niveau des dernières versions de PHP sorties. Adaptez-les pour travailler avec PHP en version 8.1.

Style de codage

Vous allez réaliser vos premiers programmes PHP en mode Web. Avant de débuter, quelques remarques importantes s'imposent. En effet, ces activités entrent dans le cadre de la ressource « Qualité de développement », dont l'aspect « style de codage » demande de suivre des règles précises et communes à tous les développeurs :
  • Style de codage
    • la version de PHP utilisée est 8.1
    • votre code devrait suivre les règles de style de codage PSR-12 (qui prolonge, étend et remplace PSR-2)
    • des outils de contrôle automatisé de qualité de code seront mis en place dans les TP futurs
  • Principe du « tout PHP »
  • echo / return
    • le résultat de vos programmes est construit à l'aide de concaténations
    • utilisez la syntaxe Heredoc (voire Nowdoc) pour les chaînes de caractères multi-lignes (et nommez le marqueur de fin « HTML » ou « SQL » pour indiquer à votre éditeur de texte la colorisation à adopter)
    • un seul « echo » remplit la charge utile de la réponse HTTP transmise au navigateur en fin de programme PHP
    • les fonctions et méthodes qui produisent des résultats (chaînes de caractères par exemple) retournent ces résultats et ne comportent donc jamais de « echo ».
  • Typage
    • Le typage strict sera systématiquement utilisé et précisé dès les premières lignes du fichier :
      <?php
      
      declare(strict_types=1);
    • le type de retour des fonctions et méthodes doit systématiquement être précisé
    • le type des paramètres des fonctions et méthodes doit systématiquement être précisé
    • le type des propriétés des objets doit systématiquement être précisé

Rappel sur l'utilisation de PHP en mode serveur

La grande majorité des programmes que vous allez écrire en PHP en mode serveur ont pour but de produire une sortie texte au format HTML qui sera transmise au navigateur Web du client qui a demandé la ressource PHP. Vos programmes PHP vont donc souvent « construire dynamiquement des pages HTML ».

Le code d'exemple qui suit vous donne les grandes lignes de ce que seront vos premières réalisations :

Édition de code PHP avec PhpStorm

Vous utiliserez PhpStorm. Dans la cadre universitaire, vous pouvez disposer d'une licence gratuite pour les étudiants. Ceci vous permet d'utiliser les outils sur votre ordinateur personnel, tant que vous êtes étudiant. L'utilisation de PhpStorm au sein du département ne nécessite pas de démarche particulière puisque nous avons un serveur de licences JetBrains. Je vous invite néanmoins à demander une licence et à travailler sur votre ordinateur personnel en dehors des séances de TP. Un tutoriel de configuration est à vote disposition. Inutile pour l'instant d'installer Composer, PHP CS Fixer ou autre, ceci viendra plus tard. Une configuration simple de PhpStorm suffira pour ce TP.

Versionnage du projet

Pour ce sujet de TP, vous créerez un nouveau répertoire, vous initialiserez un dépôt Git dans ce répertoire et créerez un dépôt distant sur GitLab. Vous réaliserez une opération de validation avec git commit au moins une fois par question du sujet.

Initialisation du dépôt

  • Ouvrez un terminal puis utilisez la commande mkdir un_nom_de_répertoire pour créer un nouveau répertoire « php-web-premiers-pas » à l'endroit de votre choix suivie de la commande cd un_chemin_relatif_ou_absolu pour vous placer dans le répertoire
  • Initialisez le dépôt Git du projet
    git init
  • Effectuez une première validation
    git commit --allow-empty -m "Initial commit"
  • Éditez le fichier « .gitignore » pour exclure les fichiers binaires inutiles à votre projet (fichiers pptx du cours, …), les fichiers qui contiennent des mots de passe ou, dans le cas des projets collaboratifs, les fichiers créés par votre éditeur de texte (répertoire « .idea » pour PhpStorm)
  • Éditez un fichier « README.md » dans lequel doivent figurer :
    • un titre de niveau 1 contenant le titre explicite du projet
    • un titre de niveau 2 « Auteur(s) » vous permettant de préciser votre nom et votre prénom (ainsi que ceux de votre binôme, le cas échéant)
    • un titre de niveau 2 « Installation / Configuration » précisant les points essentiels permettant d'installer, de configurer et de lancer le projet
  • Ajoutez les fichiers au dépôt
    git add .
  • Effectuez une nouvelle validation
    git commit -m "Repository setup"
  • Si nécessaire, renommez la branche principale en « main » (une branche vide ne peut pas être renommée, c'est pourquoi ceci est fait après le premier commit)
    git branch -m main
    Notez que vous pouvez le faire de façon définitive avec la commande suivante, à condition d'utiliser git dans une version supérieure à 2.28
    git config --global init.defaultbranch main
  • Connectez-vous à l'application GitLab et créez un dépôt portant le même nom que votre nouveau répertoire en pensant à décocher la case « Initialize repository with a README »
  • Accordez la permission « Reporter » à votre enseignant de TP/TD
  • Associez le dépôt local et le dépôt distant
    git remote add origin https://iut-info.univ-reims.fr/gitlab/votre_login/php-web-premiers-pas.git
  • Poussez le dépôt local vers le dépôt distant
    git push -u origin main

Consignes

  • Vous effectuerez une validation après chaque question.
  • À la fin de chaque séance, vous effectuerez une validation. Si cette validation contient du code incomplet ou ne fonctionnant pas, mentionnez-le dans le message de validation. Vous pousserez ensuite votre travail vers le dépôt distant.
  • Ce dépôt sera utilisé par votre enseignant(e) de TP pour évaluer votre travail, que cela conduise à un note ou pas. Assurez-vous donc régulièrement que tous les fichiers que vous souhaitez lui rendre sont bien présents dans le dépôt. Respectez les noms des fichiers qui vous sont demandés si des consignes particulières vous sont données.
  • Le dépôt lui-même sera évalué, soignez l'écriture de vos messages : clarté, pertinence, orthographe.

L'aide-mémoire Git et l'aide-mémoire GitLab de Monsieur Nourrit pourront vous être utiles.

Première utilisation du serveur Web local

Vous allez effectuer la prise en main du serveur Web local à travers son lancement et une rapide présentation de son fonctionnement.

Travail à réaliser
  1. Dans le répertoire de votre projet, créez un fichier « exemple.php » contenant le code présenté dans l'exemple précédent
  2. Lancez le serveur interne à PHP avec :
    php -d display_errors -S localhost:8000
  3. Constatez que le serveur se lance correctement en observant le message produit par la commande précédente :
    [Thu Mar 17 20:34:36 2022] PHP 8.0.16 Development Server (http://localhost:8000/) started
    Information

    Vous pouvez cliquer directement sur le texte « http://localhost:8000/ » dans le terminal pour ouvrir l'URL dans le navigateur par défaut.

  4. Interrogez le serveur Web local en utilisant l'URL http://localhost:8000/exemple.php
  5. Constatez dans le terminal les traces d'exécution induites par cette requête faite au serveur Web local :
    [Thu Mar 17 20:36:25 2022] 127.0.0.1:59216 Accepted
    [Thu Mar 17 20:36:25 2022] 127.0.0.1:59216 [200]: GET /exemple.php
    [Thu Mar 17 20:36:25 2022] 127.0.0.1:59216 Closing
    [Thu Mar 17 20:36:25 2022] 127.0.0.1:59220 Accepted
    [Thu Mar 17 20:36:25 2022] 127.0.0.1:59220 [404]: GET /favicon.ico - No such file or directory
    [Thu Mar 17 20:36:25 2022] 127.0.0.1:59220 Closing
  6. Introduisez volontairement une erreur dans le code source PHP en supprimant le point-virgule à la fin de la ligne 5
  7. Actualisez la page de votre navigateur et constatez l'affichage de :
    ( ! ) Parse error: syntax error, unexpected variable "$html" in php-web-premiers-pas/exemple.php on line 12
    Remarque importante

    PHP a produit une réponse HTTP dont la charge utile contient le code HTML du message d'erreur.

  8. Constatez dans le terminal les traces d'exécution induites par cette requête faite au serveur Web local :
    [Thu Mar 17 20:43:48 2022] 127.0.0.1:59386 Accepted
    [Thu Mar 17 20:43:48 2022] PHP Parse error:  syntax error, unexpected variable "$html" in php-web-premiers-pas/exemple.php on line 12
    [Thu Mar 17 20:43:48 2022] 127.0.0.1:59386 [200]: GET /exemple.php - syntax error, unexpected variable "$html" in php-web-premiers-pas/exemple.php on line 12
    [Thu Mar 17 20:43:48 2022] 127.0.0.1:59386 Closing
    
  9. Corrigez l'erreur dans « exemple.php »
Information

Les traces d'exécution du serveur Web local servent à détecter les erreurs de vos programmes mais également à retracer toutes les requêtes faites par votre application Web. Elles sont particulièrement utiles pour le débogage.

Table des 12

Votre premier programme PHP sur serveur Web va consister à produire une page Web affichant la table des 12. Table des 12

Travail à réaliser
  1. Écrivez un programme « multiplication1.php » qui produit un document HTML qui contient chaque ligne de la table des 12. Vous veillerez à utiliser le symbole correspondant à la multiplication
  2. Consultez le rendu du navigateur du résultat de ce premier programme PHP en mode serveur à l'adresse Web http://localhost:8000/multiplication1.php

Si l'exercice précédent n'était qu'une formalité, vous pouvez l'améliorer en utilisant une table HTML pour mettre en évidence les colonnes de ces données tabulaires par des alignements appropriés. Table des 12 utilisant une table HTML pour présenter les données

Travail à réaliser
  1. Copiez votre précédent programme « multiplication1.php » en « multiplication2.php »
  2. Améliorez le résultat produit par « multiplication2.php » afin de mieux structurer vos résultats et obtenir des alignements plus esthétiques.

Visualisation des échanges HTTP entre le client et le serveur Web local

Le principe des serveurs Web est de répondre aux requêtes des clients que sont les navigateurs Web ou les robots des moteurs de recherche. Le serveur Web a pour mission de fournir des ressources aux clients qui les demandent, à condition qu'elles soient disponibles. Le dialogue entre le client et le serveur se fait à travers le protocole HTTP largement étudié dans les TP précédents. Lorsque vous saisissez une URL dans la barre d'adresse de votre navigateur, ce dernier se connecte au serveur correspondant. Une fois la connexion réseau établie avec le serveur, le client transmet sa requête au serveur. Le serveur localise la ressource concernée et en transmet le contenu au client. Dans le cas particulier des programmes PHP, le serveur Web, suite à la réception de la requête HTTP, passe la main au moteur PHP qui exécute le programme contenu dans le programme PHP. Ce programme produit généralement un contenu que le serveur Web transmettra au navigateur Web du client. Le contenu est alors véhiculé dans la charge utile d'une réponse HTTP.

Le schéma suivant résume les échanges et les points clés de la construction du contenu de la réponse HTTP.

Diagramme PHP-HTTP requête et réponse
Principe des échanges entre client et serveur lorsque la ressource demandée est de type PHP

Le principe des échanges avec les serveurs HTTP est strictement le même sur internet, intranet ou en local. Vous allez à présent observer les échanges en lien avec le code PHP que vous avez écrit.

Les outils de développement des divers navigateurs Web permettent d'observer en détail les requêtes du client et les réponses du serveur. Pour activer les outils de développement, il suffit généralement d'appuyer sur la touche « F12 ». Le fonctionnement est similaire sur tous les navigateurs : Onglet réseau des outils de développement de Firefox

Lorsque vous sélectionnez une ressource de la liste de l'onglet réseau, vous avez accès aux détails de la requête du client et de la réponse du serveur : Détails des requêtes et réponses HTTP dans l'onglet réseau des outils de développement de Firefox

Observez les requêtes de votre navigateur et les réponses du serveur en naviguant dans les divers sous onglets. Gardez à l'esprit que votre navigateur Web effectue une requête HTTP et reçoit en retour des données du serveur, généralement un contenu HTML, et que le navigateur en fait un rendu graphique. Lorsque vous écrivez du code PHP, c'est le serveur qui exécute ce code dont le résultat est un contenu transmis au client. Nous reviendrons plus loin dans le sujet sur ce principe pour découvrir que le navigateur peut aussi transmettre de l'information au serveur grâce à la « query string » transmise dans la requête.

Travail à réaliser
  1. Observez les échanges HTTP entre votre navigateur et le serveur Web local lorsque vous interrogez http://localhost:8000/multiplication2.php
  2. Consignez dans un fichier Markdown « http-multiplication2.md » tous les détails permettant de retranscire intégralement les événements, de la saisie de l'URL à l'affichage du résultat dans la fenêtre du navigateur

Visualiser le résultat de vos programmes

Maintenant que vous avez une vision claire du processus complet de l'échange HTTP, de la demande de ressource par le client jusqu'à son rendu graphique par ce dernier, il est important de définir précisément le rôle de vos programmes PHP.

Votre programme « multiplication2.php » permet d'obtenir le rendu suivant dans le navigateur : Table des 12

Le code PHP que vous avez écrit permet de générer le contenu HTML qui sera transmis au navigateur dans le corps de la réponse HTTP. Il est donc primordial que vous consultiez régulièrement le résultat de votre programme PHP, pas seulement le rendu du navigateur.

Travail à réaliser
  1. Consultez le réel résultat de votre programme PHP en affichant le code source de la page Web qui correspond à la ressource transmise par le serveur dans la réponse HTTP (bouton droit puis « Voir le code source » ou « CTRL+U »)
    Information

    Les onglets de code source HTML peuvent être actualisés si vous modifiez votre programme PHP.

  2. Corrigez éventuellement et améliorez possiblement le code HTML résultat de votre programme PHP.
  3. Vérifiez la validité du code HTML produit par votre programme PHP en installant un greffon de validation HTML dans votre navigateur.
Remarque importante

Observez toujours bien le code source HTML de la page Web générée. C'est le résultat de votre programme. Cela permet de détecter d'éventuels problèmes de votre programme qui ne seraient pas forcément perceptibles dans le rendu graphique réalisé par le navigateur à partir du code source.

12 c'est bien, 42 c'est mieux

Votre premier programme est rigide puisqu'il ne produit que la table des 12. En proposant au visiteur de choisir un nombre, vous allez rendre le programme plus flexible et découvrir la mécanique des formulaires.

Une page Web permettant d'effectuer la saisie sera nécessaire : Saisie d'un nombre

Le précédent formulaire transmettra le nombre saisi à votre nouveau programme de table de multiplication et le résultat sera produit pour un nombre quelconque : La table de multiplication

Travail à réaliser
  1. Concevez une page HTML « nombre.html » de saisie obligatoire d'un nombre entier. Le champ de saisie sera nommé n et le formulaire sera transmis selon la méthode GET vers « multiplication3.php ».
    Remarque importante

    N'hésitez pas à revoir les Base du Web de M. Gillard.

  2. Copiez « multiplication2.php » en « multiplication3.php »
  3. Modifiez le code de « multiplication3.php » afin qu'il produise la table de multiplication du nombre transmis par le précédent formulaire.
  4. Observez l'ensemble des échanges HTTP entre votre PC et le serveur de la demande du formulaire http://localhost:8000/nombre.html à l'affichage de la table de multiplication par http://localhost:8000/multiplication3.php, y compris les requêtes et réponses HTTP échangées. Aidez-vous de l'option « Conserver les journaux » de votre navigateur (ici Firefox) et également « Désactiver le cache » : Outils de développement réseau
    Information

    La désactivation du cache du navigateur permet au développeur d'obtenir systématiquement la dernière version des ressources qu'il modifie. Prenez l'habitude développer avec cette option activée.

  5. Consignez dans un fichier Markdown « http-multiplication3.md » tous les détails permettant de retranscire intégralement les événements de la saisie de l'URL du formulaire http://localhost:8000/nombre.html à la production du résultat de la table de multiplication par http://localhost:8000/multiplication3.php et son affichage dans la fenêtre du navigateur Outils de développement réseau

Visualisation des paramètres de requête HTTP transmis au serveur

Votre formulaire mis en place, vous allez vous intéresser à la façon dont la valeur saisie par l'utilisateur dans le formulaire transite jusqu'au serveur Web pour vous permettre de produire la table de multiplication désirée.

Travail à réaliser
  1. Observez la requête HTTP transmise au serveur et l'URL correspondante : Observation des paramètres de requête HTTP
  2. Observez en particulier le paramètre « n » transmis au serveur Web
  3. Complétez le fichier « http-multiplication3.md » en décrivant le lien entre l'URL et le paramètre n.
  4. Modifiez manuellement la valeur du paramètre transmis sans passer par votre formulaire et constatez les conséquences sur le résultat de votre programme PHP : Modification du paramètre de requête HTTP
  5. Complétez le fichier « http-multiplication3.md » en expliquant pourquoi vous pouvez modifier la valeur du paramètre n sans passer par le formulaire.
  6. Modifiez à présent la valeur du paramètre transmis sans passer par votre formulaire en lui donnant une valeur incompatible avec votre programme (par exemple, « hello ») et constatez les conséquences sur le résultat de votre programme PHP : Modification du paramètre de requête HTTP pour lui donner une valeur incohérente
  7. Complétez le fichier « http-multiplication3.md » en expliquant pourquoi le contrôle de formulaire est inopérant
  8. Expliquer pourquoi la fonction « is_int() » ne vous sera d'aucune aide pour effectuer le contrôle permettant d'éviter cette erreur dans votre programme PHP
  9. Donnez une fonction PHP permettant de contrôler la forme de la valeur de n (voir dans la documentation des fonctions « Ctype »).
  10. Corrigez votre programme afin qu'il n'admette que des valeurs de n valides.
  11. Pour finir, modifiez l'URL sans passer par votre formulaire en supprimant purement et simplement le paramètre et constatez à nouveau les conséquences sur le résultat de votre programme PHP
  12. Complétez le fichier « http-multiplication3.md » en expliquant pourquoi le contrôle que vous veniez d'ajouter dans votre programme PHP ne fonctionne pas dans ce cas précis et donnez la fonction permettant de palier ce problème.
  13. Corrigez votre programme afin qu'il ne produise plus aucune erreur.
Remarque importante

Vous venez de modifier un paramètre de requête HTTP sans passer par votre formulaire qui comprend normalement des contrôles sur la valeur transmise. Tout utilisateur visitant votre site Web est capable d'en faire autant. Vous devez donc systématiquement contrôler la présence et la cohérence des paramètres de la requête HTTP dans vos programmes puisqu'il est aisé de contourner les contrôles inclus dans vos formulaires.

Problématique de la réflexion (reflected XSS)

Les corrections que vous venez d'apporter à votre programme afin qu'il contrôle les données qu'il reçoit de l'utilisateur entrent dans la problématique des failles de sécurité basées sur le « Cross-Site Scripting (XSS) ». Vous en avez déjà observé les conséquences dans les TP précédents en étudiant le vol de cookie. Il est temps d'apprendre comment ne pas produire cette vulnérabilité.

L'une des failles les plus courantes et les plus exploitables est liée à la réflexion. Ceci signifie que votre programme insère dans le contenu qu'il produit, classiquement du HTML, une valeur fournie par l'utilisateur telle qu'elle a été transmise par ce dernier. L'exemple le plus courant consiste à demander son nom à l'utilisateur et produire un contenu le saluant. Vous allez travailler sur ce modèle et essayer de proposer un nom douteux au programme qui vous salue.

Travail à réaliser
  1. Observez le code HTML du formulaire de saisie nom.html :
  2. Observez à présent le code PHP « bonjour.php » du programme produisant le contenu HTML qui salue le visiteur ayant saisi son nom :
  3. Téléchargez ces deux fichiers et placez-les dans votre espace Web afin de pouvoir les essayer : « nom.html » puis « bonjour.php »
    Information

    Les démonstrations qui vont suivre mettent en évidence les vulnérabilités de votre serveur Web local. Aucune fuite de données n'est envisageable puisque vous seul accédez à ce serveur. Néanmoins, les vulnérabilités seraient exactement les mêmes sur un serveur Web public sur Internet et les conséquences seraient bien plus importantes !

  4. Essayez maintenant de saisir votre nom et de valider le formulaire. Le résultat est celui attendu : Bonjour bob
  5. Saisissez cette fois (en faisant un copier-coller) « <img src="https://iut-info.univ-reims.fr/users/cutrona/intranet/css/images/jerome-cutrona.jpg"> » au lieu de votre nom puis validez votre saisie. Le résultat est amusant parce que c'est ma tête et que vous êtes le seul à la voir : Bonjour bob
  6. Observez l'URL du résultat et constatez que si vous la collez dans un autre navigateur, le résultat est le même sans passer par le formulaire. Vérifiez-le en cliquant sur ce lien piégé
    Remarque importante

    Imaginez maintenant que le site concerné soit celui d'une entreprise renommée, que j'envoie un mail avec ce lien à de nombreux clients et que je choisisse une image moins amusante, l'effet n'est plus vraiment le même…

  7. Essayer maintenant de cliquer sur ce nouveau lien piégé, qui correspondrait à la saisie d'un nom contenant :
  8. Vous pouvez tenter cette fois de cliquer sur ce lien piégé, qui correspondrait à la saisie d'un nom contenant :
  9. Tentez de cliquer sur ce dernier lien piégé, qui correspondrait à la saisie d'un nom contenant :
    Remarque importante

    Observez bien ce qu'il se passe dans la barre de développement au niveau réseau. C'est invisible pour l'utilisateur mais redoutablement efficace !

    Imaginez maintenant que vous soyez le webmaster du site de l'entreprise et que vous ayez cliqué sur mon lien. J'ai maintenant votre cookie de session sur mon site et je peux accéder au vôtre avec vos droits, d'administrateur !

  10. Modifiez maintenant votre utilisation de la valeur fournie par l'utilisateur en lui appliquant préalablement la fonction « strip_tags() » et/ou « htmlspecialchars() ».
  11. Testez la solution plus radicale, mais bien plus efficace, de suppression des balises et de leur contenu à l'aide de « preg_replace() » et d'une expression rationnelle bien sentie :
    preg_replace('/<.*>/is', '', $_GET['nom'])
  12. Pour finir, envisagez ce qu'il pourrait se produire si votre programme avait inséré les « noms » d'utilisateurs non filtrés dans votre base de données et qu'ils sortaient, par exemple, dans les commentaires d'un article. Tout votre site serait défacé voire transmettrait des informations confidentielles à des tiers sans que cela se remarque facilement.

Production d'URL avec des paramètres

Vous allez à présent produire vous-même des URL comportant des paramètres, reproduisant ainsi le comportement de votre navigateur lorsque vous remplissez et soumettez un formulaire selon la méthode GET. URL comportant des paramètres

Travail à réaliser
  1. Copiez votre formulaire nombre.html en nombre2.html
  2. Ajoutez-y un lien vers la table des 12
  3. Ajoutez-y un lien vers la table des 42

Liste de choix

Vous allez maintenant utiliser un champ de saisie de type liste déroulante afin de proposer une liste des jours de la semaine.

Travail à réaliser
  1. Écrivez un programme « choisir-jour1.php » qui produit une liste déroulante des jours de la semaine à partir du tableau PHP suivant :
    [1 => 'lundi', 'mardi', 'mercredi', 'jeudi', 'vendredi', 'samedi', 'dimanche']
    Cette liste déroulante sera incluse dans un formulaire qui comprendra également un bouton d'envoi. Le numéro d'index du jour (champ « jour ») choisi sera transmis au programme « jour.php » (qui sera écrit plus tard) selon la méthode POST. Les jours de la semaine sous forme de liste déroulante
    Remarque importante

    Le choix d'un jour sera rendu obligatoire.

  2. Copiez votre précédent programme en « choisir-jour2.php » et transformez la liste déroulante en groupe de boutons radio.
    Remarque importante

    Le choix d'un jour sera rendu obligatoire.

    Veillez à ce qu'un seul bouton radio puisse être actif à la fois et utilisez des label afin d'obtenir une bonne ergonomie.

    Les jours de la semaine sous forme de boutons radio
  3. Réalisez maintenant le programme « jour.php » qui affiche le choix fait par l'utilisateur à l'aide de l'un des deux formulaires précédemment réalisés : Affichage du jour choisi En cas de problème de données, l'utilisateur devra voir le message suivant : Affichage en cas de problème dans le choix
  4. Décrivez dans un fichier Markdown « http-jour.md » l'ensemble des échanges HTTP, de la demande du formulaire par le navigateur à l'affichage du jour choisi, y compris les requêtes et réponses HTTP échangées.
  5. Trouvez un moyen de ne pas envoyer de données en POST à votre programme « jour.php » et décrivez-le dans « http-jour.md ».
  6. Trouvez un moyen d'envoyer « jour=14 » à votre programme « jour.php » et décrivez-le dans « http-jour.md ».
Remarque importante

Si vous pensiez qu'utiliser des formulaires en POST vous permettait d'empêcher l'utilisateur de fournir des données hors de votre contrôle, vous venez d'avoir la preuve que la méthode HTTP POST n'apporte aucun avantage à ce niveau par rapport la méthode GET. Vous devrez toujours vérifier et filtrer les données provenant de l'utilisateur de votre application Web.

Table de Pythagore

Revenons à présent à la génération d'un contenu HTML ne dépendant pas de données fournies par l'utilisateur. Table de Pythagore

Travail à réaliser
  1. Écrivez un programme « pythagore1.php » qui produit la table de Pythagore de 0 à 10.
  2. Modifiez votre programme afin d'y introduire INDICE_MAX, une constante définie à 10 qui borne la taille de votre table de Pythagore
  3. Jouez sur la valeur de la constante afin de produire une table de 20×20
  4. Vérifiez la validité du code HTML produit et corrigez-le si nécessaire

Sujet complémentaire

Si vous avez traité l'ensemble des questions du sujet, vous pouvez poursuivre avec le sujet complémentaire.