Vous êtes sur la page 1sur 7

Tutorial 2 : Web dynamique

(2019-2020)

Objectif : Création d'un panier.

Dans le répertoire wamp --> dans sous répertoire www créez un répertoire gestionPanier.

Accès réservé et identification


Ensuite, créez un fichier sous le nom : autentification.php. Je vous propose de créer un formulaire qui
demande le login et le mot de passe du visiteur :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Identification</title>
</head>
<body>
<div>
<form method="post" action="pageIndex.php">
<fieldset>
<legend>Identification :</legend>
<label>Login : </label><input type="text" name="login" />
<label>Pass : &nbsp;</label><input type="password" name="pass" />
<input type="submit" name="envoi" value="Entrer"/>
</fieldset>
</form>
<ul>
Ici, deux variables $_POST*’login’+ et $_POST*’pass’+ seront créées et elles contiendront le login et
le mot de passe respectivement.
Maintenant, je vous propose de créer la page « pageIndex.php ». Cette page va recevoir le
Login et le mot de passe dans deux variables nommées $_POST*’login’+ et $_POST*’pass’+.
Le contenu de la page « pageIndex.php » est :
<?php
session_start();
if(isset($_POST['login']) && isset($_POST['pass']))
if($_POST['login']=="Ahmed"&& $_POST['pass']=="1234")
{
echo 'Bonjour ';
echo $_POST['login'] ;
$_SESSION['acces']="oui";
$_SESSION['nom']=$_POST['login'];

1
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>LES SESSIONS</title>
</head>
<body>
Visiter les pages du site <br />
<ul>
<li><a href="pagehtml.php">pagehtml </a></li>
<li><a href="pagephp.php">pagephp</a></li>
</ul>
</div>
</body>
</html>

Les pages définies par les fichiers pagephp.php et pagehtml.php sont celles qui vont afficher
le contenu informatif réservé. Elles ont une structure identique, et vous pourriez en
créer une quantité sur le même modèle pour élargir le contenu du site. Chacune d’elles
commence par démarrer une session (repères (1)). Elles sont protégées contre tout accès
non autorisé, car si une personne essaye de les afficher directement dans un navigateur,
elle est redirigée (repères (2)) vers la page d’accueil tant que la variable $_SESSION
*'acces'+ n’a pas la valeur "oui" . Si l’accès est autorisé, le script affiche un message de bienvenue
incorporant le nom du visiteur (repères (3)) puis incrémente un compteur de visite pour la page
(repères 4). Il affiche enfin à la suite des liens vers les autres pages le nombre de fois qu’elles ont été
visitées (repères et ). Script de la page pagephp.php :
<?php
session_start(); (1)
if($_SESSION['acces']!="oui")
{
header("Location:pageindex.php"); (2)
}
else
{
echo "<h4>Bonjour ". $_SESSION['nom']."</h4>"; (3)
if( !isset($_SESSION['php'])) $_SESSION['php']=0;
$_SESSION['php'] ++; (4)
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>La page de PHP 5</title>
</head>
2
<body>
<h4> Accès réservé aux personnes autorisées</h4>
<p> Visiter les autres pages du site :
<?php echo "Page PHP vue ". $_SESSION['php']. " fois"; ?> (5)
<ul>
<li><a href="pageindex.php">Page d'accueil </a></li>
<li><a href="pagehtml.php">Page XHTML </a>
<?php if(isset($_SESSION['html']))echo " vue ". $_SESSION['html']. " fois"; ?>
</li>
</ul>
</p>
<h3>Contenu de la page PHP 5</h3>
</body>
</html>

Page PHP :

Script de la page pagehtml.php:


<?php
session_start();
if($_SESSION['acces']!="oui")
{
header("Location:pageindex.php");
}
else
{
echo "<h4>Bonjour ". $_SESSION['nom']."</h4>";
if( !isset($_SESSION['html'])) $_SESSION['html']=0;
$_SESSION['html'] ++;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>La page du (X)HTML.</title>
</head>
<body>
<h4> Accès réservé aux personnes autorisées</h4>
<p> Visiter les autres pages du site :
<?php echo "Page XHTML vue ". $_SESSION['html']. " fois"; ?>
<ul>
<li><a href="pageindex.php">Page d'accueil </a></li>
<li><a href="pagephp.php">Page PHP 5</a>
3
<? if(isset($_SESSION['php']))echo " vue ". $_SESSION['php']. " fois"; ?>
</li>
</ul>
<h3>Contenu de la page XHTML</h3>
</body>
</html>

La gestion de panier
Une utilisation classique des sessions est la gestion de panier sur un site de commerce en ligne dans lequel les articles sont
sélectionnés les uns après les autres et stockés dans un panier, ou Caddie. L’exemple suivant demande de remplir un bon de
commande en complétant un formulaire. Ce dernier ne permet la saisie que d’un article à la fois. La démarche serait la même
si le client pouvait choisir des articles dans différentes pages et qu’il fallait conserver l’ensemble de ces choix jusqu’à la fin
de sa commande.

Si la commande comportait plus d’un article, la saisie du premier article serait perdue lors de la saisie du deuxième. L’usage
des sessions permet de conserver l’ensemble des articles saisis jusqu’à la fin de la commande.
Le formulaire de saisie comprend trois zones de saisie ainsi que trois boutons Submit, chacun correspondant à une action
particulière. Le bouton Ajouter ajoute un article à la commande, le bouton Vérifier affiche l’ensemble de la commande et le
montant total et le bouton Enregistrer stocke la commande dans un fichier texte sur le serveur par commodité car, en réalité, il
serait préférable de stocker les informations dans une base de données.
Le code PHP :
<?php
session_start();
//initialisation des varibles (1)
if(! isset($_POST["envoi"])) $_POST["envoi"]="";
if(! isset($_SESSION['prixTotal'])) $_SESSION['prixTotal']=0;
if(! isset($_SESSION['code'])) $_SESSION['code']=0;
if(! isset($_SESSION['article'])) $_SESSION['article']="";
if(! isset($_SESSION['prix'])) $_SESSION['prix']=0;

//AJOUTER
if($_POST["envoi"]=="AJOUTER"&& $_POST["code"]!=""&& $_POST["article"]!=""&& $_POST["prix"]!="")
{
$code=$_POST["code"]; //(2)
$article= $_POST["article"]; //(3)
$prix= $_POST["prix"]; //(4)
$_SESSION['code']= $_SESSION['code']."//".$code; 5)
$_SESSION['article']= $_SESSION['article']."//".$article; (6)
$_SESSION['prix']= $_SESSION['prix']."//".$prix; (7)
}
//VERIFIER
if($_POST["envoi"]=="VERIFIER")
{
echo "<table border=\"1\">";
echo "<tr><td colspan=\"3\"><b>Récapitulatif de votre commande</b></td>";
echo "<tr><th>&nbsp;code&nbsp;</th><th>&nbsp;article&nbsp;</ th><th>&nbsp;
?prix&nbsp;</th>";

4
$total=0;
$tab_code=explode("//",$_SESSION['code']); // (8)
$tab_article=explode("//",$_SESSION['article']); //(9)
$tab_prix=explode("//",$_SESSION['prix']); //(10)

for($i=1;$i<count($tab_code);$i++) //(11)
{
echo "<tr><td>{$tab_code[$i]}</td><td>{$tab_article[$i]}</td><td>
?".sprintf("%01.2f", $tab_prix[$i])."</td>";
$_SESSION['prixTotal']+=$tab_prix[$i]; // (12)
}
echo "<tr><td colspan=2> PRIX TOTAL </td><td>".sprintf("%01.2f", $_SESSION['prixTotal'])."
?</td>";
echo "</table>";
}
//ENREGISTRER
if($_POST["envoi"]=="ENREGISTRER")
{
$idfile=fopen("commande.txt",w);
//
$tab_code=explode("//",$_SESSION['code']);
$tab_article=explode("//",$_SESSION['article']);
$tab_prix=explode("//",$_SESSION['prix']);

for($i=0;$i<count($tab_code);$i++) //(13)
{
fwrite($idfile, $tab_code[$i]." ; ".$tab_article[$i]." ; ".$tab_prix[$i].";\n");
}
fclose($idfile);
}
//LOGOUT
if($_POST["envoi"]=="LOGOUT")
{
session_unset(); (14)
session_destroy(); (15)
echo "<h3>La session est terminée</h3>";
}
$_POST["envoi"]=""; (16)
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Gestion de panier</title>
</head>
<body>
<form action="<?php $_SERVER['PHP_SELF'] ?>" method="post"
?enctype="application/x-www-form-urlencoded">
<fieldset>
<legend><b>Saisies d'articles</b></legend>
<table>
<tbody>
<tr>
<th>code : </th>
<td><input type="text" name="code" /></td>
</tr>
<tr>
<th>article : </th>
<td><input type="text" name="article" /></td>
</tr>
<tr>
<th>prix :</th>
<td><input type="text" name="prix" /></td>
</tr>
<tr>
5
<td colspan="3">
<input type="submit" name="envoi" value="AJOUTER" />
<input type="submit" name="envoi" value="VERIFIER" />
<input type="submit" name="envoi" value="ENREGISTRER" />
<input type="submit" name="envoi" value="LOGOUT" />
</td>
</tr>
</tbody>
</table>
</fieldset>
</form>
</body>
</html>

La partie PHP du script est divisée en quatres parties, chacune gérant une des actions possibles :

La première partie (1) est réservée à l’initialisation des variables de session

Si l’utilisateur clique sur le bouton Ajouter, le script récupère les informations dans les
variables $code, $article et $prix (repères (2), (3) et (4)) puis définit les variables de
session $_SESSION['code'], $_SESSION['article'] et $_SESSION['prix'] (repères (5), (6)
et (7)). Pour sauvegarder les données de plusieurs saisies, nous les enregistrons dans la
même variable en les concaténant et en les séparant par les caractères arbitrairement
choisis « // ». La variable $_SESSION['code'] contiendrait, par exemple, la
chaîne suivante après la saisie de trois codes : "code1//code2//code3".

Si l’utilisateur clique sur le bouton Vérifier, le script affiche l’ensemble des lignes de
la commande plus une ligne indiquant le prix total dans un tableau XHTML. Il nous
faut d’abord récupérer toutes les valeurs enregistrées dans les chaînes précédentes.
Ceci est fait en créant trois tableaux à l’aide de la fonction explode() appliquée successivement
aux trois variables de session (repères (8), (9) et (10)). Une boucle for permet
alors d’afficher toutes les données en parcourant les trois tableaux créés (repère (11)).

Le prix total est calculé en accumulant les valeurs successives des variables $tab_
prix[$i] (repère 12).
• Si l’utilisateur clique sur le bouton Enregistrer, le script enregistre dans un fichier texte
toutes les données saisies en parcourant de la même façon les tableaux $tab_code,
$tab_article et $tab_prix (repère (13)) .
Le script se termine en réinitialisant la variable $_POST["envoi"] de façon qu’elle ne
conserve pas sa dernière valeur (repère (16)).

Page de saisie de commandes

6
Affichage du contenu du panier

Pour un site réel en production, il est bon d’ajouter au formulaire un quatrième bouton,
nommé Déconnexion, ou Logout, permettant à l’internaute de terminer la session et de
faire disparaître les données saisies, en particulier son code d’accès. Cette précaution
n’est pas inutile, surtout si le poste client est utilisé successivement par plusieurs personnes
et c’est ce que nous avons mis en place dans le code de l’exemple.
Pour détruire toutes les variables de la session, vous utilisez la fonction session_unset()
(repère (14)) sans paramètre et qui ne retourne aucune valeur. Pour terminer la session,
vous disposez de la fonction session_destroy() (repère (15)) également appelée sans paramètre,
qui retourne une valeur booléenne TRUE si l’opération est réalisée et FALSE dans le
cas contraire.
Pour créer le bouton Submit, il vous resterait à ajouter le code HTML suivant :
<input type="submit" name="envoi" value="LOGOUT" />
puis, dans le script PHP, le code correspondant suivant :
if($_POST["envoi"]=="LOGOUT")
{
session_unset();
session_destroy();
echo "<h3>La session est terminée</h3>";
}
Si l’utilisateur clique sur le bouton "LOGOUT", personne ne peut plus afficher sa
commande, lui y compris.

Travail à faire :
En utilisant le code de ce tutorial, créer une application e-commerce dans laquelle :
1. I ‘identification du client par son login et mot de passe.
2. Gestion des achats par un panier.
3. Création de cookies.
4. Fermeture de la session.