Recherche personnalisée

Comment faire un espace membre

Voici une petite application pour apprendre comment faire un espace membre. Vous devez avoir des connaissances en php et MySQL pour pouvoir suivre,si c'est pas le cas retournez voir nos cours.

Voici une petite application qui va permettre de réaliser un début d'espace membre basé sur l'utilisation des sessions.

Il sera composé de 4 pages :

- membre_index.php : qui contiendra le formulaire de login à l'espace membre
- - inscription.php : qui contiendra le formulaire d'inscription à cet espace membre
- - membre.php : la page d'accueil de l'espace membre
- - deconnexion.php : qui sera une page qui permet de se déloger de cet espace membre, et de revenir au formulaire de connexion à l'espace membre

Le minimum d'informations permettant d'accéder à un espace membre est :

- un login
- un mot de passe

Nous aurons besoin de créer une table SQL ne contenant que 3 champs pour notre espace membre :

- un champ id AUTO_INCREMENT permettant d'identifier chaque membre (chaque membre ayant un id différent). Ce sera notre clé primaire.
- un champ login de type text qui contiendra le login de chaque membre de l'espace membre
- un champ pass_md5 de type text contenant le mot de passe haché de chaque membre. Pour un maximum de sécurité, et pour encoder des mots de passe, on utilise une technique de hachage rendue possible par l'utilisation de la fonction PHP md5, parce que le hachage via md5 est irréversible

Et donc nous aurons la structure de table suivante :

Requête SQL table membre :

CREATE TABLE membre (
id int(11) NOT NULL auto_increment,
login text NOT NULL,
pass_md5 text NOT NULL,
PRIMARY KEY (id)
) TYPE=MyISAM;

Création de la pge d'accueil : membre_index.php

Cette page contient le formulaire de connexion à l'espace membre.

Ce formulaire est composé de deux champs :

- login, où l'utilisateur saisira son login
- pass, où l'utilisateur saisira son mot de passe

Cette page contient également un lien permettant aux utilisateurs de s'inscrire à l'espace membre.

Une fois le formulaire soumis, nous testons si ses champs sont bien remplis, le cas échéant, nous affichons un message sur la page informant l'utilisateur qu'il a oublié de remplir un champ.

Dans le cas où le formulaire a été rempli correctement, nous allons interroger la base de données afin de vérifier que le couple login / mot de passe saisi par l'utilisateur existe bien dans notre base de données (ce qui veut dire que nous allons vérifier que le couple login / mot de passe correspond à un vrai membre).

Sacher que nous voulons stocker des mots de passes hachés dans notre base de données. Donc si nous recherchons le mot de passe en clair dans la base de données, on risque de ne pas trouver grand-chose.

Afin de faire correspondre mot de passe saisi en clair dans formulaire et mot de passe haché stocké dans la base de données, nous allons passer un coup de md5 sur le mot de passe saisi dans le formulaire avant de rechercher ce mot de passe dans la table membre.

Si le couple login / mot de passe est trouvé, on démarre une session, puis on redirige le membre vers la page d'accueil de l'espace membre (membre.php).

Sinon, on reste sur notre formulaire de connexion.

Voici le code de la page membre_index.php :

<?php
// on teste si le visiteur a soumis le formulaire de connexion
if (isset($_POST['connexion']) && $_POST['connexion'] == 'Connexion') {
if ((isset($_POST['login']) && !empty($_POST['login'])) && (isset($_POST['pass']) &&
!empty($_POST['pass']))) {
$base = mysql_connect ('serveur', 'login', 'password');
mysql_select_db ('nom_base', $base);
// on teste si une entrée de la base contient ce couple login / pass
$sql = 'SELECT count(*) FROM membre WHERE login=«'.mysql_escape_string($_POST[
'login']).'« AND pass_md5=«'.md5(mysql_escape_string($_POST['pass'])).'«';
$req = mysql_query($sql) or die('Erreur SQL !<br />'.$sql.'<br />'.mysql_error());
$data = mysql_fetch_array($req);
mysql_free_result($req);
mysql_close();
// si on obtient une réponse, alors l'utilisateur est un membre
if ($data[0] == 1) {
session_start();
$_SESSION['login'] = $_POST['login'];
header('Location: membre.php');
exit();
}
// si on ne trouve aucune réponse, le visiteur s'est trompé soit dans son login,
soit dans son mot de passe
elseif ($data[0] == 0) {
$erreur = 'Compte non reconnu.';
}
// sinon, alors la, il y a un gros problème :)
else {
$erreur = 'Probème dans la base de données : plusieurs membres ont les mêmes
identifiants de connexion.';
}
}
else {
$erreur = 'Au moins un des champs est vide.';
}
}
?>
<html>
<head>
<title>Accueil</title>
</head>
<body>
Connexion à l'espace membre :<br />
<form action=«membre_index.php» method=«post»>
Login : <input type=«text» name=«login» value=«<?php if (isset($_POST['login'])) echo
htmlentities(trim($_POST['login'])); ?>»><br />
Mot de passe : <input type=«password» name=«pass» value=«<?php if (isset($_POST['pass'])
) echo htmlentities(trim($_POST['pass'])); ?>»><br />
<input type=«submit» name=«connexion» value=«Connexion»>
</form>
<a href=«inscription.php»>Vous inscrire</a>
<?php
if (isset($erreur)) echo '<br /><br />',$erreur;
?>
</body>
</html>

La page de l'espace membre : membre.php

Le test de l'existence du compte de notre membre ayant déjà été fait dans la page membre_index.php, il nous reste peu de chose à faire pour notre espace membre.
En effet, dans membre.php, il ne nous reste qu'à tester que la personne qui accède a cette page est bien passée par le formulaire de connexion de l'espace membre.

Pour ce faire, nous testons si la variable de session $_SESSION['login'] est bien définie :

- si elle ne l'est pas, nous redirigeons le visiteur vers le formulaire de connexion de l'espace membre
- sinon, on affiche le contenu de notre espace membre (dans cet application, remarquez que nous n'affichons pas grand-chose à part un lien permettant de se déconnecter de l'espace membre mais vous pouvez y ajouter ce que vous voulez.

Voici le code de la page membre.php :

<?php
session_start();
if (!isset($_SESSION['login'])) {
header ('Location: membre_index.php');
exit();
}
?>
<html>
<head>
<title>Espace membre</title>
</head>
<body>
Bienvenue <?php echo htmlentities(trim($_SESSION['login'])); ?> !<br />
<a href=«deconnexion.php»>Déconnexion</a>
</body>
</html>

La page de déconnexion de l'espace membre : deconnexion.php

Ici, nous allons finir la session en cours, et rediriger le visiteur vers le formulaire de connexion à l'espace membre.

Voici le code de la page deconnexion.php :

<?php
session_start();
session_unset();
session_destroy();
header('Location: membre_index.php');
exit();
?>

La page d'inscription à l'espace membre : inscription.php

Dans cette page, nous allons placer le formulaire d'inscription à notre espace membre, qui sera composé de 3 champs :

- un champ login contenant le login que l'utilisateur voudra utiliser pour se connecter à l'espace membre
- un champ pass contenant son mot de passe (que nous devrons hacher par la fonction md5 de PHP avant de le stocker dans la base de données)
- un champ pass_confirm demandant à l'utilisateur de retaper son mot de passe (ceci, afin d'être bien sur que l'utilisateur tape bien le mot de passe qu'il souhaite taper )

Une fois le formulaire soumis, il nous reste à vérifier diverses choses avant d'enregistrer ce nouveau membre.

Nous testons si le formulaire est bien rempli.
Si il ne l'est pas, nous affichons un petit message en dessous du formulaire.
Si il l'est, nous passons au prochain test, testant si le mot de passe et sa confirmation saisis par le visiteur sont identiques.
Puis, nous nous connectons à notre base de données, et nous vérifions si le login saisi par l'utilisateur n'existe pas déjà dans notre table membre.
Si il ne l'est pas, nous validons l'inscription tout en prenant soin de stocker le mot de passe haché du nouveau membre dans notre table, puis nous redirigeons notre visiteur vers notre espace membre.

Voici le code de la page inscription.php :

<?php
// on teste si le visiteur a soumis le formulaire
if (isset($_POST['inscription']) && $_POST['inscription'] == 'Inscription') {
// on teste l'existence de nos variables. On teste également si elles ne sont pas
vides
if ((isset($_POST['login']) && !empty($_POST['login'])) && (isset($_POST['pass']) &&
!empty($_POST['pass'])) && (isset($_POST['pass_confirm']) && !empty($_POST[
'pass_confirm']))) {
// on teste les deux mots de passe
if ($_POST['pass'] != $_POST['pass_confirm']) {
$erreur = 'Les 2 mots de passe sont différents.';
}
else {
$base = mysql_connect ('serveur', 'login', 'password');
mysql_select_db ('nom_base', $base);
// on recherche si ce login est déjà utilisé par un autre membre
$sql = 'SELECT count(*) FROM membre WHERE login=«'.mysql_escape_string($_POST[
'login']).'«';
$req = mysql_query($sql) or die('Erreur SQL !<br />'.$sql.'<br />'.mysql_error(
));
$data = mysql_fetch_array($req);
if ($data[0] == 0) {
$sql = 'INSERT INTO membre VALUES(««, «'.mysql_escape_string($_POST['login']
).'«, «'.md5(mysql_escape_string($_POST['pass'])).'«)';
mysql_query($sql) or die('Erreur SQL !'.$sql.'<br />'.mysql_error());
session_start();
$_SESSION['login'] = $_POST['login'];
header('Location: membre.php');
exit();
}
else {
$erreur = 'Un membre possède déjà ce login.';
}
}
}
else {
$erreur = 'Au moins un des champs est vide.';
}
}
?>
<html>
<head>
<title>Inscription</title>
</head>
<body>
Inscription à l'espace membre :<br />
<form action=«inscription.php» method=«post»>
Login : <input type=«text» name=«login» value=«<?php if (isset($_POST['login'])) echo
htmlentities(trim($_POST['login'])); ?>»><br />
Mot de passe : <input type=«password» name=«pass» value=«<?php if (isset($_POST['pass'])
) echo htmlentities(trim($_POST['pass'])); ?>»><br />
Confirmation du mot de passe : <input type=«password» name=«pass_confirm» value=«<?php
if (isset($_POST['pass_confirm'])) echo htmlentities(trim($_POST['pass_confirm'])); ?>
«><br />
<input type=«submit» name=«inscription» value=«Inscription»>
</form>
<?php
if (isset($erreur)) echo '<br />',$erreur;
?>
</body>
</html>

Et voila un bon début d'espace membre, minim, mais fonctionnel
A vous de stocker plus d'informations dans la table membre, de placer les informations de votre choix dans votre espace membre, de faire une confirmation d'inscription via une adresse E-Mail, et de ...

Beaucoup de travail en perspective ou quoi ?

Retourner au haut de la page.. haut de page…

...Acceuil...  Vous êtes ici:comment faire un espce membre		Voir la suite…

Vous pouvez copier, modifier des copies de cette page, tant que cette note apparaît clairement
Vous devez citer le nom de l'auteur original et faire un lien hypertexte vers http://apprendre.uuuq.com