Comment créer et protéger un espace membre en PHP

La création d'un espace protégé par login et mot de passe est une demande courante dans les forums PHP. Dans ces quelques lignes, je vous montre comment obtenir un espace membre ou un espace backoffice simple utilisant un formulaire de connexion. Je n'utilise que du PHP simple et des variables de session : cette lecture est donc accessible aux débutants.

Le principe d'une authentification sur un site web est simple : l'utilisateur renseigne son identifiant et son mot de passe dans un formulaire, puis ces données sont comparées à celles qui se trouvent dans une base de données. Si les deux coincident, l'utilisateur est authentifié et redirigé vers la bonne page.

Pour réaliser l'authentification, nous aurons besoin :

  1. De savoir utiliser les sessions en PHP.
  2. De créer une table users dans une base de données mabase.
  3. De créer un formulaire de connexion : login.php.
  4. De créer une page d'accueil de backoffice ou d'espace membre : index.php.
  5. De créer une page dologin.php contenant la logique de l'authentification.

Dans le cadre de la programmation orientée objet, vous pouvez utiliser un composant objet dédié à l'authentification, ou créer votre propre composant. En utilisant des interfaces adaptées, vous pouvez aussi gérer plusieurs types de connexion : par formulaire, Twitter, Google ou encore Facebook.

Authentification en Orienté Objet?
Suivez le programme en ligne "ReCONVERT".

On y est presque! Merci de compléter le formulaire et de cliquer pour un accès immédiat.



ReCONVERT : Se former pas à pas aux métiers du web : html5, css3, php, wordpress, doctrine, bootstrap.
RECONVERT : "Devenez Développeur Web En Ligne" : récupérer le Guide Gratuit Maintenant!

Aucun spam dans votre boîte, votre email n'est jamais divulgué.
© Copyright - Formaself, 2016.



Comment créer un formulaire de login et mot de passe pour authentifier les utilisateurs.

Dans un premier temps, nous allons dire deux mots sur les sessions en PHP, la création et l'utilisation des variables de session.

1- Sessions et variables de session

Les sessions permettent de créer des variables qui traversent les pages. PHP dispose d'un gestionnaire de sessions que l'on doit activer sur toute page contenant des variables de session. Pour chaque utilisateur, un ID de session est créé et la plupart du temps stocké sur le client sous forme de cookie. Les variables associées à une session sont, quant à elles, stockées sur le serveur.

Activer une session et créer des variables

Voici le code minimal pour activer une session, créer et lire des variables de session. La fonction session_start() doit se trouver tout en haut, bien avant la création d'une variable de session :

<?php
    //Activer le gestionnaire de session
    session_start();
    
    //Creer la variable de session nom
    $_SESSION['nom'] = "Dupont";
    
    //Un echo suffit pour afficher le contenu de la variable
    echo $_SESSION['nom'];

?>

utiliser une variable de session

2- Créer une table users

Les utilisateurs enregistrés sur votre site sont présents dans une table users de votre base de données MySQL. Admettons que votre base de données est mabase.

Je vous propose la table users ci-après et ayant 7 champs ou colonnes.

#

id : colonne clé primaire, auto-incrément

active : permet de savoir si le compte est actif.

autres champs : de type VARCHAR. En pratique, il ne faut pas stocker le mot de passe en clair dans la table, mais il faut l'encrypter.

Vous pouvez aussi garantir l'unicité du login en associant à ce champ une contrainte de type UNIQUE.

Pour créer la table, vous pouvez jouer le code SQL ci-dessous. Si vous utilisez un outil comme phpMyAdmin, créez alors votre table via l'interface web de phpMyAdmin par exemple, si vous ne souhaitez pas taper de code SQL.


CREATE TABLE users(
    id INT(3) PRIMARY KEY AUTO_INCREMENT,
    login VARCHAR(20),
    pwd VARCHAR(15),
    nom VARCHAR(50),
    prenom VARCHAR(50),
    role VARCHAR(50),
    active TINYINT(1)
) ENGINE=InnoDB DEFAULT CHARACTER SET = utf8 COLLATE = utf8_general_ci;

code SQL : créer la table users

Après avoir créé votre table, insérez dedans 2 utilisateurs : un ayant le rôle d'administrateur, et le second celui d'opérateur. Il suffira de jouer un code SQL d'insertion :

INSERT INTO users
VALUES(NULL, 'admin', 'admin-pwd', 'DUPONT', 'Jean', 'ADMIN', 1),
(NULL, 'oper', 'oper-pwd', 'MARC', 'Lucie', 'OPERATEUR', 1);

code SQL : ajout de 2 utilisateurs

Vous n'avez pas assez de notions SQL?
Consulter mon cours en ligne "MYSQL Stepwise".

3- Créer le formulaire de connexion

Toutes les pages à créer auront l'extension .php, y compris le formulaire de login. En effet, il est possible d'y insérer un code PHP, par exemple le message affiché lorsque la connexion échoue.

Créons la page login.php contenant le formulaire de connexion. Ce formulaire contient juste du code HTML, avec 3 champs : un champ de type text pour le login, un champ de type password pour le mot de passe et un champ de type submit pour la soumission du formulaire.

Sa méthode est POST, et les données sont soumises à la page dologin.php pour le traitement. Notez qu'il est toujours possible de traiter les données du formulaire et la logique d'authentification dans login.php, sans qu'il y ait besoin de créer la page dologin.php.

Un bloc IF permet de tester si l'on a un paramètre msg dans l'URL pour afficher ou pas un message en cas d'erreur. Ce test utilise la superglobale $_GET.

<?php
    //Tester la superglobale
    if(isset($_GET['msg'])){
        echo "<b style='color:red;'>" . $_GET['msg'] . "</b>";
    }

?>

<form name="connexion" method="post" action="dologin.php">
    Identifiant : <input type="text" name="login"><br>
    Mot de passe : <input type="password" name="pwd"><br>
    <input type="submit" name="send" value="Connexion">
</form>

code du formulaire : login.php

4- Créer la logique d'authentification

L'authentification se fait selon une logique simple. L'algorithme comprend des instructions IF et une instruction SWITCH.

Algorithme :

  • Récupérer les saisies de l'internaute.
  • Préparer la requête SQL à exécuter dans MySQL.
  • Créer le lien de connexion à MySQL.
  • Exécuter la requête.
  • Si on a un résultat, l'authentification est OK.
    • Récupérer le tableau de données.
    • Si le compte est actif
      • Selon le role, créer des variables de session.
      • Rediriger vers le backoffice.
    • Sinon, rediriger vers la page de login.
  • Sinon on redirige vers la page de login.

Notez l'activation du gestionnaire de session au début de la page, et la création de variables de sessions que l'on peut afficher dans les pages du backoffice. Les variables de sessions serviront aussi à protéger les pages selon les rôles des internautes.

<?php
	//Formulaire soumis
    if(!empty($_POST['login'])){
	
		//Activer le gestionnaire de session.
		session_start();
		
		//Obtenir la saisie de l'internaute
		$login = $_POST['login'];
		$pwd = $_POST['pwd'];
		
		//Le code SQL
		$query = "SELECT * FROM users WHERE login='$login' AND pwd='$pwd';";
		
		//Lien de connexion (API MySQLi)
		$db = mysqli_connect('localhost','root','','mabase') or die("Connexion impossible " . mysqli_error());
		
		//Execution et obtention d'un curseur
		$curseur = mysqli_query($lien, $query) or die("exec impossible " . mysqli_error());
		
		//Test du nombre de lignes obtenu
		if(mysqli_num_rows($curseur) == 1){
			//Authentification OK, obtenir les infos
			$data = mysqli_fetch_object($curseur);
			
			//Compte actif ou pas?
			if($data->active == 1){
				//Variables de session
				$_SESSION['auth'] = $login;
				$_SESSION['nom'] = $data->nom;
				$_SESSION['prenom'] = $data->prenom;
				$_SESSION['active'] = $data->active;
				$_SESSION['role'] = $data->role;
				
				//Test des droits
				switch($data->role){
					case 'ADMIN': header("location:" . "admin/index-admin.php");
					exit;
					break;
					
					case 'OPERATEUR': header("location:" . "admin/index-operateur.php");
					exit;
					break;
					
				}
			}
			else{
				//Le compte est inactif
				$msg = "Login ou mot de passe incorrect";
				
				//Redirection
				header("location:" . "login.php?msg=$msg");
				exit;
			}
		}
		else{
			//Aucun utilisateur
			$msg = "Login ou mot de passe incorrect";
			
			//Redirection
			header("location:" . "login.php?msg=$msg");
			exit;
		}
	}
?>

Code authentifier : dologin.php

5- Protéger les pages du backoffice

Sans protection, les pages du backoffice peuvent être accessibles par un utilisateur qui en connait l'URL (ou qui essaie de le deviner), sans passer par le formulaire de login.

Pour protéger chaque page du backoffice, on peut tester tester une ou plusieurs variables de session. Si la variable existe, alors la session est active, sinon elle a expirée ou n'existe pas.

<?php
    //Tester une variable de session
    if(!isset($_SESSION['auth'])){
        //Message d'erreur
        $msg = "Login ou mot de passe incorrect.";
        
        //Redirection
        header("location:" . "../login.php?msg=$msg");
        exit;
    }
	
	//On peut aussi tester si le compte est actif
	if($_SESSION['active'] != 1){
        //Message d'erreur
        $msg = "contactez l'administrateur.";
        
        //Redirection
        header("location:" . "../login.php?msg=$msg");
        exit;
    }
?>

Envie d'aller plus loin en Orienté Objet?
Suivez le programme en ligne "ReCONVERT".

On y est presque! Merci de compléter le formulaire et de cliquer pour un accès immédiat.



ReCONVERT : Se former pas à pas aux métiers du web : html5, css3, php, wordpress, doctrine, bootstrap.
RECONVERT : "Devenez Développeur Web En Ligne" : récupérer le Guide Gratuit Maintenant!

Aucun spam dans votre boîte, votre email n'est jamais divulgué.
© Copyright - Formaself, 2016.




Léopold GAMBA, CEO Formaself

Par Léopold GAMBA

CEO de Formaself, chef de projet web et e-commerce, formateur de +2000 stagiaires en présentiel et en ligne (LIVE et VOD). Actuellement, je développe le Digital Learning.

+ site digital learning : formaself.com
+ plateforme LMS de formation : vod.formaself.com

N'hésitez pas à me suivre sur les réseaux sociaux.

#

WEB



#

E-MARKETING



#

MEDIAS SOCIAUX



Créer un blog en 1 jour, sans programmer : 12 vidéos incluses.

e-Cours gratuit pour créer votre Blog ou votre site web.