Un crud avec espace de connexion en php

Un crud avec espace de connexion en php

crudlogin

Pour faire suite au tuto ‘CRUD’ , on va tenter ici de l’améliorer en lui rajoutant un espace de connexion.Vu que c’est un exercice, qu’il n’y a ni admin ni user, on va construire un mini scénario : on a les mêmes pages que dans le précédent tutoriel  :

  • index.php,
  • add.php,
  • delete.php,
  • update.php,
  • edit.php,
  • database.php

Maintenant, en tapant sur l’index, on va faire en sorte de tomber sur une interface de connexion; et c’est en se connectant seulement qu’on pourra accéder au reste des pages et donc à l’appli CRUD.

L’arborescence

On va donc rajouter deux pages à notre application:  login et logout

arbo2

La base de donnée

On rajoute aussi deux champs dans notre base login et password

base2

Login.php

<?php
/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
   
require 'database.php';
if ($_SERVER["REQUEST_METHOD"] == "POST" && !empty($_POST)) {
    $loginError = '';//on initialise nos messages d' erreurs
    $passwordError = '';
    $password = htmlentities(trim(sha1($_POST['password']))); //on securise les données
    $login = htmlentities(trim($_POST['login']));

    // on vérifie les input
    $valid = true;
    if (empty($login)) {
        $loginError = 'Please enter Login';
        $valid = false;
    }
    if (empty($password)) {
        $passwordError = 'Please enter password';
        $valid = false;
    }


    if ($valid) { //si c'est bon, on connecte à la base
        $pdo = Database :: connect();
        $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
        $sql = "SELECT * FROM user WHERE login= ? AND password=? ";
        $q = $pdo->prepare($sql);
        $q->execute(array($login, $password));
        $data = $q->fetch(PDO::FETCH_ASSOC);
      if ($data['password'] == $password && $data['login'] == $login ) // Acces OK ! s'il y a des data et qu'elle correspondent
	{
            session_start(); //on ouvre la session
	    $_SESSION['login'] = $data['login'];//on assigne nos valeurs
	    $_SESSION['password'] = $data['password'];
	  
	    echo '<p>Bienvenue '.$data['login'].', 
			vous êtes maintenant connecté!</p>
			<p>Cliquez <a href="./index.php">ici</a> 
			pour revenir à la page d accueil</p>';
            header('location:index.php'); //et on renvoie vers l'index
	}
        
        
	else // Acces refusé on reste sur la page!
	{
	    echo '<p>Une erreur s\'est produite 
	    pendant votre identification.<br /> Le mot de passe ou le pseudo 
            entré n\'est pas correcte.</p><p>Cliquez <a href="./login.php">ici</a>'; 
	   
	    
	}
  
 
    }

    Database::disconnect();
}
?>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Crud</title>
        <link href="css/bootstrap.min.css" rel="stylesheet">
        <script src="js/bootstrap.js"></script>

    </head>
    <body>
        <div class="container">
            <form method="POST" action="login.php">
                <div class="control-group <?php echo!empty($loginError) ? 'error' : ''; ?>">
                    <label class="control-label">Login</label>
                    <div class="controls">
                        <input type="text" name="login" value="">
                        <?php if (!empty($loginError)) : ?><!-- affiche erreur-->
                            <span class="help-inline"><?php echo $loginError; ?></span>
                        <?php endif; ?>
                    </div>
                </div>
                <div class="control-group<?php echo!empty($passwordError) ? 'error' : ''; ?>">
                    <label class="control-label">Password</label>
                    <div class="controls">
                        <input type="password" name="password" value="">
                    <?php if (!empty($passwordError)) : ?> <!-- affiche erreur-->
                            <span class="help-inline"><?php echo $passwordError; ?></span>
                        <?php endif; ?>
                    </div>

                </div>
                <input type="submit" value="submit" name="submit">
            </form>
        </div>
    </body>
</html>

J’ai volontairement commenté le code pour plus de clarté.

  • On fait appel à la base
  • on initialise nos messages d’ erreurs
  • on sécurise les données
  • On vérifie les input
  • Si c’est bon on se connecte à la base de donnée.
  • Si le login et password inséré correspondent à un login et mot de passe trouvé en base ( $data[‘login’] ), alors on ouvre une session avec les valeurs assignées
  • On affiche un message de succès et on redirige vers l’index

Logout.php

Dans l’index, on va par la suite rajouter un bouton déconnexion qui renverra vers la page logout.php. On place notre lien juste en dessous du lien pour rajouter un user.

<div class="container">
            <div class="row">
                <h2>Crud en Php</h2>
            </div>
            <div class="row">
                <p>
                    <a href="add.php" class="btn btn-success">Ajouter un user</a>
                    <a href="logout.php" class="btn btn-danger">Deconnexion</a>
                </p>

Logout.php contient juste la fonction de déconnexion avec un session_destroy(); on détruit la session utilisateur et on redirige vers la page de connexion

<?php
session_start();
session_destroy();
header('location:login.php');
exit;
/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
?>

On a donc la nos deux fichiers pour la connexion-déconnection. Il va maintenant falloir intervenir dans les autres fichiers pour dire « si tu n’es pas connecté, retourne au login’. Notre CRUD devient donc un véritable backoffice dont l’accès n’est possible qu’avec un identifiant et un mot de passe défini.

Définir la session utilisateur

En début de chaque fichier (add, update, delete, edit et index) on va placer ce bout de code qui vérifie la session utilisateur. S’il y a une session, ok et on affiche un message, sinon renvoie vers le login. Ici je vérifie le $_SESSION[‘login’], on pourrait le faire avec l’ID. Le message affiché sur chaque page est la juste pour montrer qu’on est bien connecté.

<?php 
  session_start();
if (isset($_SESSION['login']))
{
    echo 'Bonjour ' . $_SESSION['login'];
}else{
    header('location:login.php');
}
?> 

 

Voila, on a un crud avec une partie login!!

Les limites et améliorations possibles

On s’arrête ici, et on remarque déjà les limites de l’exercice. Notre base contient bien deux nouveaux champs login et password. Mais je n’ai pas rajouté les champs dans mes tableaux html, ni cherché à les récupérer pour les afficher. J’ai crée un user en dur avec un mot de passe(en sha1 dans phpMyAdmin) et un login, et donc seul ce user peut rentrer dans l’appli. Une fois dans l’appli, je ne peux pas ici rajouter de login et mot de passe pour mes users, puisque les input ne sont pas crées .On aura donc des colonnes vides dans notre base.

On peut donc imaginer la suite, créer dans tous les fichiers les champs additionnels login et password, pour pouvoir les rajouter, supprimer, modifier ou lire. Dans ce cas, tous les users auraient un login et password pour accéder à l’appli. Il faudrait donc imaginer ensuite toute la partie front office pour l’user et garder le crud en backoffice pour l’administrateur, et définir des droits pour les accès.

5 commentaires sur “Un crud avec espace de connexion en php

  1. RIMANI

    Est-ce que on peux télécharger le dossier CRUD ? Si oui Comment?

    copier/coller suffisante sauf pour les fichiers .php

    mais pour les dossiers Bootstrap js, IMG, CSS comment le telecharger???????????

  2. copier coller Auteur de l'article

    Pour Bootstrap il suffit de télécharger les fichiers sur le site de bootstrap..attention ils sont passés à la version 4, il faudra donc adapter en fonction..

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.