Créer des sites Web dynamiques en PHP (PHP Hypertext Preprocessor)

Auteur: Mohamed CHINY Durée necessaire pour le cours de Créer des sites Web dynamiques en PHP (PHP Hypertext Preprocessor) Niveau recommandé pour le cours de Créer des sites Web dynamiques en PHP (PHP Hypertext Preprocessor) Supports vidéo disponibles pour ce cours Exercices de renforcement disponibles pour ce cours Quiz disponible pour ce cours

Page 15: Exercice - Authentification

Toutes les pages

Enoncé

Dans cet exercice on va mettre en pratique les sessions lors de l’authentification. L'objectif et de créer trois pages PHP:
  • login.php: qui authentifie l'utilisateur. Elle contient un formulaire renfermant une zone de texte, une zone de mot de passe et un bouton d'envoi.
  • session.php: qui représente la page à accès limité. Aucun visiteur n'a le droit de voir son contenu s'il n a pas été authentifié par la page login.php.
  • deconnexion.php: est la page qui permet de déconnecter le client (détruire la session) et rediriger le navigateur vers la page login.php.


Si le client tente d'accéder directement à la page session.php alors qu'il n'est pas authentifié, il sera aussitôt redirigé vers la page login.php. Si'il fournit un bon login et un bon mot de passe alors il sera redirigé vers la page session.php qu'il a désormais le droit de consulter.

Pour simplifier, nous allons définir statiquement le bon login qui est "user" et le bon mot de passe qui est "1234".
Pour rediriger le navigateur automatiquement vers une autre page on peut le faire en HTML, Javascript ou en PHP. Cependant, il est préférable de le faire en PHP grâce à la fonction header(). Par exemple, si on veut rediriger le navigateur vers la page session.php alors on fait header( location : session.php ). Notez que la fonction header() est une fonction entête comme c'est le cas pour session_start(). Il faut donc prendre le soin de la déclarer avant d'envoyer du contenu au navigateur.

Correction

Je vous donne les codes des trois pages et après je vous explique les points importants.

Codes source

Code source de login.php:
<?php
   session_start();
   @$login=$_POST["login"];
   @$pass=$_POST["pass"];
   @$valider=$_POST["valider"];
   $bonLogin="user";
   $bonPass="1234";
   $erreur="";
   if(isset($valider)){
      if($login==$bonLogin && $pass==$bonPass){
         $_SESSION["autoriser"]="oui";
         header("location:session.php");
      }
      else
         $erreur="Mauvais login ou mot de passe!";
   }
?>
<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8" />
      <style>
         *{
            font-family:arial;
         }
         body{
            margin:20px;
         }
         input{
            border:solid 1px #2222AA;
            margin-bottom:10px;
            padding:16px;
            outline:none;
            border-radius:6px;
         }
         .erreur{
            color:#CC0000;
            margin-bottom:10px;
         }
      </style>
   </head>
   <body onLoad="document.fo.login.focus()">
      <h1>Authentification</h1>
      <div class="erreur"><?php echo $erreur ?></div>
      <form name="fo" method="post" action="">
         <input type="text" name="login" placeholder="Login" /><br />
         <input type="password" name="pass" placeholder="Mot de passe" /><br />
         <input type="submit" name="valider" value="S'authentifier" />
      </form>
   </body>
</html>
Code source de session.php:
<?php
   session_start();
   if($_SESSION["autoriser"]!="oui"){
      header("location:login.php");
      exit();
   }
   if(date("H")<18)
      $bienvenue="Bonjour et bienvenue dans votre espace personnel";
   else
      $bienvenue="Bonsoir et bienvenue dans votre espace personnel";
?>
<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8" />
      <style>
         *{
            font-family:arial;
         }
         body{
            margin:20px;
         }
         a{
            color:#DD7700;
            text-decoration:none;
         }
         a:hover{
            text-decoration:underline;
         }
      </style>
   </head>
   <body onLoad="document.fo.login.focus()">
      <h1><?php echo $bienvenue?></h1>
      [ <a href="deconnexion.php">Se déconnecter</a> ]
   </body>
</html>
Code source de deconnexion.php:
<?php
   session_start();
   session_destroy();
   header("location:login.php");
?>

Explications

Comme pour l'exercice de la page 9, il faut avoir l'habitude de commencer par intégrer les code HTML et CSS, puis Javascript s'il y en a, et en fin PHP.

Page login.php:

On commence par démarrer une session avec session_start() au tout début du document, car des variables de sessions sont prévues dans cette page. Après on récupère les posts (l'arobas sert à échapper les notifications qui disent que les indexes du tableau $_POST ne sont pas reconnus, et ce avant de poster le formulaire). On déclare ensuite le bon login le bon mot de passe que l'utilisateur doit saisir pour s'authentifier.
Notez que cette manière de déclarer le login et le mot de passe n'est pas du tout recommandée (surtout que le mot de passe est déclaré en clair). Or, l'objectif de l'exercice est de savoir comment se servir des sessions.
On vérifie ensuite que les posts du clients correspondent au bon login et le bon mot de passe. Si oui, une variable de session du nom $_SESSION["autoriser"] est créée et on lui attribue la valeur "oui". On vérifiera ensuite que cette variable a bien cette valeur ce qui signifiera que le client s'est correctement authentifié. Aussitôt, le navigateur est redirigé vers la page session.php.

Si le login ou le mot de passe ne sont pas correctes, alors on affiche le message d'erreur "Mauvais login ou mot de passe" qu'on a préalablement affecté à la variable $erreur.

Page sessions.php:

La page session.php est une page à accès limité. Seules les personnes qui se sont correctement authentifiées peuvent y accéder, c'est pourquoi on a d'abord vérifié si la variable de session$_SESSION["autoriser"] a comme valeur "oui" (après avoir restauré la session courante avec session_start()).

Vous avez certainement remarqué la fonction exit() qui permet d'arrêter prématurément l’exécution du code si la variable de session n'a pas la valeur souhaitée (ce qui signifie que le client ne s'est pas authentifié correctement). En fait, la fonction exit() n'est d'aucune utilité dans ce cas, car le navigateur serait déjà redirigé vers la page login.php. Mais elle est là si vous avez opté pour une redirection avec HTML ou Javascript. Ces deux langages s’exécutent sur le client, alors il est possible que le visiteur interrompe leur exécution et se retrouve alors avec la page session.php qui s'affiche devant lui, même s'il n'est pas correctement authentifié.

Pour plus de personnalisation, on a opté d'afficher un message de bienvenue qui peut être soit "Bonjour et bienvenue dans votre espace personnel" ou "Bonsoir et bienvenue dans votre espace personnel". Pour décider si on affiche "Bonjour" ou "Bonsoir" on a fait appel à la fonction date("H"). Dans ce cas, elle retourne l'heure du serveur en format 24h. On a estimé qu'avant 18h il convient de dire "Bonjour" et entre 18h et minuit "Bonsoir" serait plus logique. Mais attention. L'heure est celle du serveur, alors si ce serveur est en Asie et le client en Amérique du nord, les choses ne se passeront pas comme prévu à cause du décalage horaire. On peut donc personnaliser le message à l'aide de Javascript qui s’exécute sur le client.

Si le visiteur clique sur le lien "Se déconnecter", il sera envoyé vers la page deconnexion.php.

Page deconnexion.php:

Dans le jargon du Web on appelle ce genre de page page tunnel. En effet, la page deconnexion.php n'est pas destinée à afficher du contenu, mais plutôt à faire un traitement et rediriger le navigateur vers une autre page sans même que l'internaute ne se rend compte de sa présence.

La page deconnexion.php restaure la session courante qu'elle détruit juste après à l'aide de session_destroy(). Dans ce cas, la session est supprimée et la variable de session $_SESSION["autoriser"] est détruite également. En suite, le navigateur est redirigé vers login.php.

Désormais, si on tente d'accéder à la page session.php, celle ci nous renvoie immédiatement vers la page d'authentification.

Authentification statique en vidéo