Déconnecter un utilisateur authentifié en PHP

Pour partager cette vidéo sur les réseaux sociaux ou sur un site, voici son url :


Sujets que vous pourriez aussi aimer :


Déconnecter un compte authentifié

Dans les formations PHP précédentes, nous avons bâti un formulaire d'inscription, un formulaire d'identification et un formulaire de compte utilisateur. Nous avions créé un état de session pour suivre l'utilisateur connecté dans sa navigation.

Désormais, nous souhaitons proposer à l'internaute de pouvoir se déconnecter.



Sources et présentation de la problématique
Nous devons donc commencer par récupérer ces travaux aboutis.

• Télécharger le fichier deconnecter-compte-authentifie.rar en cliquant sur son lien,
• Puis, le décompresser dans le dossier de votre choix,

La décompression conduit au fichier principal nommé index.php. Il s'agit du formulaire d'identification. A la racine, il est accompagné des pages pour le formulaire d'inscription et pour le formulaire de compte. Les sous dossiers offrent les ressources externes. On y trouve notamment le script Javascript pour les contrôles de saisie. Si vous n'avez pas suivi les formations précédentes, vous devez importer la petite base de données située dans le sous dossier bdd. Vous devez d'abord créer la base en la nommant bd_gestion. C'est ensuite que l'importation peut être réalisée. Le compte utilisateur doit être créé selon les informations de connexion proposées dans le fichier commun ouvrir.php. Le sous dossier commun propose en effet toutes les portions communes de codes Php. Elles sont imbriquées dans la construction grâce à l'instruction Php include.

Justement, comme ce bouton de déconnexion doit être accessible quelle que soit la page, il est placé dans le fichier commun page.php. Ce dernier est utilisé par toutes les rubriques de ce petit site pour finir la construction Html.

Nous proposons donc d'accéder à son code. Mais avant cela et comme vous le savez, le projet doit être référencé dans EasyPhp. Vous devez lui attribuer un nom et spécifier l'adresse du dossier issue de l'explorateur Windows. La formation pour débuter la programmation en Php détaille ces techniques.

• A la racine du dossier de décompression, double cliquer sur le sous dossier commun pour afficher son contenu,
• Cliquer avec le bouton droit de la souris sur le fichier pied.php,
• Puis, dans le menu contextuel, choisir de l'ouvrir avec un éditeur comme le Notepad++,

Dans l'imbrication des calques, balises Div en Html, en ligne 30 pour un éditeur Notepad, vous notez la présence du bouton permettant de réaliser la déconnexion.

...
?>
<a href='<?php echo $lien_compte; ?>' target='_self' title='Accédez à vos informations de compte'>
<img src='<?php echo $img_compte; ?>' style='width:40px;border:none;' alt='' />
</a>
<div style='float:right;'>
<form id='fermer' name='fermer' method='post' action='index.php?OUT=true'>
<input type='submit' id='soumettre' value='Se d&eacute;connecter' style='width:120px;height:25px;' />
</form>
</div>
</div>
...

Pour que la session soit clôturée, la variable de session doit être vidée. L'action doit explicitement être envoyée au serveur. C'est la raison pour laquelle ce bouton est placé dans un formulaire Html. Le type de ce bouton est submit. Cela signifie qu'un clic engage directement le PostBack, soit la soumission des données du formulaire. En effet, il s'agit de déconnecter l'utilisateur. Il n'y a pas d'information internaute à transmettre. Donc les contrôles en amont par le code Javascript ne sont plus nécessaires. La soumission peut se faire sans aucune vérification préalable.

La méthode action de ce formulaire est intéressante. Elle appelle la page d'accueil (index.php), soit le formulaire d'identification, mais en lui passant un paramètre (OUT=true). C'est ce paramètre, s'il est récupéré au chargement de la page, suite à un aller-retour serveur, qui doit enclencher la déconnexion. Comme nous passons manuellement ce paramètre dans l'Url de la page de traitement, nous conservons la méthode Post. Nous l'avions déjà évoqué, si nous choisissons la méthode Get, l'ensemble des données incluses dans les contrôles du formulaire sont concaténées dans l'Url. Ici, nous la construisons nous-mêmes.

Masquer - Afficher un contrôle de formulaire
Le bouton de déconnexion ne doit être proposé que lorsque l'internaute est connecté, soit identifié. Souvenez-vous, tel que nous l'avons programmé, c'est un état de session qui en témoigne avec l'attribut utilisateur.

Le code Php situé juste au-dessus en atteste :

...
<?php
if(isset($_SESSION['utilisateur']) && $_SESSION['utilisateur']!='')
{
$img_compte = 'images/compte.png';
$lien_compte = 'compte.php';
}
else
{
$img_compte = 'images/compte_nok.png';
$lien_compte = '.';
}
?>
<a href='<?php echo $lien_compte; ?>' target='_self' title='Accédez à vos informations de compte'>
<img src='<?php echo $img_compte; ?>'style='width:40px;border:none;' alt='' />
</a>
...

La session, si elle existe, est utilisée pour modifier l'icône et le lien d'accès au formulaire de compte. Dans le cas contraire, cet accès est barré puisque l'internaute n'est pas reconnu.

Nous proposons de compléter ce code afin d'affecter une variable qui définira si le bouton Déconnecter est visible ou masqué.

• Compléter ce code Php avec les instructions notées en gras dans l'extrait ci-dessous :

...
<?php
$etat='';
if(isset($_SESSION['utilisateur']) && $_SESSION['utilisateur']!='')
{
$img_compte = 'images/compte.png';
$lien_compte = 'compte.php';
$etat='visibility:visible;';
}
else
{
$img_compte = 'images/compte_nok.png';
$lien_compte = '.';
$etat='visibility:hidden;';
}
?>
...

Nous déclarons une variable $etat que nous affectons d'un attribut Html. Il s'agira de l'intégrer dans le contrôle Submit. La valeur de cet attribut change en fonction de l'état de session. S'il existe, son attribut visibility est réglé sur visible et sur hidden, le cas échéant. En d'autres termes, le bouton doit être disponible si l'internaute est connecté et masqué dans le cas contraire.

Pour l'exploiter, nous devons l'imbriquer dans la propriété style du contrôle submit par concaténation. Il s'agit de techniques usuelles désormais.

• Adapter le code du bouton submit, selon l'instruction notée en gras dans l'extrait :

...
<form id='fermer' name='fermer' method='post' action='index.php?OUT=true'>
<input type='submit' id='soumettre' value='Se d&eacute;connecter' style='width:120px;height:25px;<?php echo $etat; ?>' />
</form>
...

• Enregistrer les modifications (CTRL + S) et basculer sur l'interface d'EasyPhp,
• Cliquer sur le lien du projet que vous avez référencé pour ouvrir le formulaire d'identification,
• Renseigner des identifiants qui n'existent pas en base de données : aaaa, 5555,
• Puis, cliquer sur le bouton Valider pour soumettre cette paire de connexion,

Comme vous le remarquez, puisque l'identification échoue, l'accès au formulaire de compte se verrouille. Ça nous le savions déjà. Mais dans le même temps, le bouton de déconnexion se masque.

• Renseigner cette fois une paire valide : tatouille@free.fr, 122333, inscrite en base de données,
• Cliquer sur le bouton Valider pour transmettre ces informations,

L'utilisateur est reconnu. En conséquence l'accès au compte est déverrouillé et la déconnexion lui est proposée.

Il s'agit maintenant de rendre fonctionnelle la déconnexion. Le principe consiste à analyser le paramètre de l'Url s'il existe, grâce à l'instruction Php Get. Ce paramètre, nous l'avons nommé OUT. Dans ce cas, il suffit simplement de vider la variable de session. Si elle ne porte plus aucune valeur, l'utilisateur n'est plus reconnu.

La page appelée par le PostBack généré par le bouton submit est la page d'identification, soit le fichier index.php. Nous allons donc l'exploiter pour le code de réception des données transmises par l'Url. Notez que nous pourrions très bien rester dans la page pied.php. Elle est en effet commune à toutes les rubriques. Donc, elle est appelée par la page index du formulaire d'identification.

• A la racine du dossier de décompression, cliquer droit sur le fichier index.php,
• Dans le menu contextuel, choisir de l'ouvrir avec le Notepad,

En entête, nous y découvrons le code Php que nous avions développé pour récupérer les informations de l'internaute et les rechercher en base de données. Il en résulte l'identification. Notre nouveau code doit intervenir après cette instruction conditionnelle qui a pour effet de restituer l'état de session.

• Dans la section Php, après l'instruction conditionnelle, ajouter les lignes de code suivantes :

...
if($retour['inscr_num']!='')
$_SESSION['utilisateur'] = $retour['inscr_num'];
}

if(isset($_GET['OUT']) && $_GET['OUT']=='true')
{
$_SESSION['utilisateur']='';
header('Location: .');
exit();
}
?>
...

L'instruction $_GET permet donc de récupérer un paramètre d'Url selon l'attribut qui lui est passé. Nous testons tout d'abord son existence grâce, comme toujours, à la fonction Php isset. Puis, nous nous assurons que la valeur du paramètre est bien true. Si tel est le cas, nous vidons la variable de session. Cette action a pour effet d'effacer les informations de l'internaute, donc de le déconnecter. Et puis, grâce à l'instruction header, nous redirigeons la transaction vers la page d'accueil sans paramètre. Le point matérialise la racine du dossier local sur le serveur. C'est donc la page index.php qui sera rechargée. De fait, nous mettons fin à l'exécution des traitements en cours grâce à l'instruction exit.

• Enregistrer les modifications et basculer sur le navigateur Web,
• Accéder à une autre rubrique à l'aide du jeu d'icône, comme la page de compte par exemple,
• Puis, dans le pied de page, cliquer sur le bouton Se Déconnecter,

Comme vous le remarquez, nous sommes redirigés vers la page d'accueil du formulaire d'identification. En pied de page, le bouton Se Déconnecter a disparu. L'accès aux informations de compte est désormais verrouillé. L'internaute a bien été déconnecté. Il a suffi de vider sa variable de session.