Cours/TP n° 3 Technologies « coté serveur »

Transcription

Licence Professionnelle Nice – Sophia
G. Rey
2015-2016
Cours/TP n° 3
Technologies « coté serveur »
1 Présentation
Les objectifs de ce cours/TP sont de vous montrer comment installer et configurer un serveur web pour qu’il puisse
interpréter des scripts PHP. Nous verrons également comment fonctionne le langage PHP et comment utiliser PHP
conjointement avec AJAX. Enfin, dans la dernière partie du TP nous expérimenterons d’autres technologies
concurrentes à PHP tel que l’ASP.Net de Microsoft.
1.1 Pré-requis
Pour réaliser ce cours/TP, vous avez besoin d’un serveur web fonctionnel. Vous utiliserez le serveur http sous Linux
que vous avez configuré lors du cours/TP 1.
Vous aurez également besoin d’un éditeur de texte pour écrire le code de vos pages. Vous pouvez par exemple
utiliser un des logiciels Notepad++, ConText, Quanta+, WebExpert, SciTE …
Pour réaliser ce cours/TP, vous garderez les groupes constitués lors du premier cours/TP.
1.2 Le rendu
Vous devrez, en fin de séance, rendre un compte rendu de votre TP. Ce compte rendu devra OBLIGATOIREMENT
respecter les contraintes suivantes :
•
Etre envoyez par email à votre enseignant.
•
Avoir le sujet suivant : [2014][LPSIL][IDSE][TP3]nom1_Prenom1 – nom2_Prenom2 où nom1_Prenom1 et
nom2_Prenom2 les noms et prénoms du binôme.
•
Etre reçu par votre enseignant le jour du cours/TP.
•
Contenir dans le corps de l’email les questions que vous pourriez avoir (si vous souhaitez avoir une
réponse rapide car les comptes rendu ne sont pas évalués immédiatement).
•
Contenir en attachement 1 seul fichier .zip, .7z ou .tar.gz contenant lui-même 1 fichier de compte rendu (au
format pdf, rtf, doc, docx ou txt) ainsi que les divers fichiers (fichiers de configuration, pages (x)html, CSS,
php…) écrits dans le TP.
2 Installation et configuration du server HTTP
Pour nos exercices, il nous faudra disposer d'un serveur http acceptant les scripts PHP et donnant accès à une base
de données. Nous installerons donc PHP et mysql dans notre machine virtuelle linux-debian. Si vous avez installé le
forum phpBB lors du cours/TP 1, vous avez déjà fait une partie de ce travail.
2.1 Installation
Commençons par ajouter mysql à notre installation :
> apt-get install mysql-server
ou
> aptitude install mysql-server
Nous devons également installer les modules php pour apache. Pour cela, vous devez installer un interpréteur php
à l’aide de la commande suivante :
> apt-get install php5
ou
> aptitude install php5
Université de Nice – Sophia Antipolis
930, Route des Colles – B.P. 145 - 06903 Sophia Antipolis Cedex – France
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
http://www.polytech.unice.fr/
1
G. Rey
2015-2016
Cours/TP n° 3
Nous allons également installer le package suivant pour faire le lien entre php5 et mysql
> apt-get install php5-mysql
ou
> aptitude install php5-mysql
2.2 Configuration
La ligne suivante est nécessaire pour que les fichiers php soient bien interprétés par apache.
AddType application/x-httpd-php .php .php3 .php5 .phtml
Normalement celle-ci ou une ligne équivalente doit être ajoutée dans apache2.conf ou httpd.conf ou dans le fichier
de configuration du module correspondant.
Comme nous l’avons vu dans le cours/TP1, pour une gestion plus « propre », celle-ci se trouve aujourd’hui dans le
fichier de configuration du module php5 pour apache. Vérifiez cela :
> cat /etc/apache2/mods-enabled/php5.conf
Depuis la version 2.2.16 (introduite dans la version stable de debian 6), la ligne de configuration a été remplacée
par les lignes suivantes (toujours dans le fichier php5.conf) :
<FilesMatch "\.ph(p3?|tml)$">
SetHandler application/x-httpd-php
</FilesMatch>
Connectez-vous avec les droits root sous mysql. Créez une nouvelle base nommée tp3db puis créez un nouvel
utilisateur ayant les droits sur cette base.
> mysql –u root –p mysql
mysql> CREATE DATABASE tp3db;
mysql> USE mysql;
mysql> GRANT ALL PRIVILEGES ON tp3db.* TO 'phpuser'@'localhost' IDENTIFIED BY 'passphp' WITH
GRANT OPTION;
mysql> GRANT ALL PRIVILEGES ON tp3db.* TO 'phpuser' IDENTIFIED BY 'passphp' WITH GRANT
OPTION;
mysql> COMMIT;
mysql> QUIT;
2.3 Test
Créez un fichier index.php à la racine de votre serveur web (dans /var/www/ si vous n’utilisez pas d’autres serveurs
virtuels). Ce fichier devra contenir cette unique ligne :
<?php phpinfo(); ?>
Rendez-vous sur http://xxx.xxx.xxx.xxx/ (à modifier suivant l’adresse IP de votre serveur). Si votre serveur http est
bien configuré vous devriez voir la page suivante :
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
2
G. Rey
2015-2016
Cours/TP n° 3
3 PHP
3.1 Présentation du PHP
PHP a été créé en 1994 par Rasmus Lerdorf pour les besoins des pages web personnelles (livre d’or, compteurs,
etc.). A l’époque, PHP signifiait Personnal Home Page. PHP est un langage de script, c'est-à-dire que le code est
enregistré sous forme de fichier texte sur le disque dur, et qu'il est exécuté à la demande par un programme chargé
de l'interpréter. C'est habituellement l'internaute (par l'intermédiaire de son navigateur Web) qui demande
l'exécution d'un script lorsqu'il consulte une page Web. La demande est reçue par le serveur Web (par exemple
Apache HTTPD), qui se rend compte qu'il doit la sous-traiter à PHP.
En 1997, PHP devient un projet collectif et son interpréteur est réécrit par Zeev Suraski et Andi Gutmans pour
donner la version 3 qui s’appelle désormais « PHP Hypertext Preprocessor ».
Sa gratuité et le libre accès à ses sources en fait un langage très populaire surtout auprès de la communauté GNU
Linux. Sa syntaxe proche du C, et sa programmation « intuitive » en font le langage qui a fait la plus grande percée
auprès des webdesigners en 2001. De nombreux sites lui sont consacrés, on y trouve des scripts, des astuces et
même des concours de logos...
3.2 Documentation
Le site officiel de PHP est extrêmement bien fait. La documentation de n'importe quelle fonction est accessible
depuis l'URL :
http://php.net/nom_de_la_fonction
N'oubliez pas de consulter les commentaires utilisateurs, car de très nombreux commentaires donnent des conseils
très utiles.
La documentation complète de PHP est disponible en français à l’adresse :
http://www.php.net/manual/fr/
Pour vous aider dans l’identification et la correction des erreurs dans votre code php, nous allons modifier le fichier
de configuration pour qu’il fasse afficher celle-ci. Editez le fichier /ect/php5/apache2/php.ini et activez les traces de
debug des directives suivantes :
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
3
G. Rey
2015-2016
Cours/TP n° 3
display_errors
display_startup_errors
track_errors
html_errors
Comme cela est expliqué dans les commentaires de chacune de ces directives. L’activation de celles-ci est très
pratique pour le debug, mais il faut impérativement les désactiver sur un serveur en production.
3.3 Mon premier fichier en PHP
Voici
le
fichier
hello.php
(disponible
à
l’adresse
http://users.polytech.unice.fr/~rey/cours/supports/lpsil/hello.php.txt). Il utilise la fonction htmlentities (qui
convertit les caractères éligibles en entités HTML) pour afficher un message de bienvenue.
<?php echo '<?xml version="1.0"?>'; ?>
<!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="en" lang="en">
<head>
<title>PHP HelloWorld</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<?php
if(empty($_GET['user'])){
echo htmlentities('Bonjour', ENT_QUOTES, 'UTF-8');
}else{
echo htmlentities('Bonjour, '.$_GET['user'], ENT_QUOTES, 'UTF-8');
}
?>
</body>
</html>
Enregistrez ce fichier sur votre serveur web sous le nom de hello.php et ouvrez-le depuis votre navigateur.
http://xxx.xxx.xxx.xxx/hello.php
Testez ensuite avec un paramètre :
http:// xxx.xxx.xxx.xxx/hello.php?user=Gaetan
3.4 PHP 5 : un modèle objet
Depuis PHP5, il est possible d’adapter une approche objet lors de l’écriture de vos programmes en PHP. Voici un
petit exemple qui vous présente rapidement comment utiliser l’objet en php.
<?php
// Déclaration d’une classe
class Voiture {
const km_initial = 0 ;
private $km ;
// Constructeur de la classe
public function __construct($type = 'N/A', $km = 'N/A') { // Paramètres optionnels
if (!is_numeric($km) || !($km > 0 && $km < 1000000))
$this->km = self::km_initial;
else
$this->km = $km ;
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
4
G. Rey
2015-2016
Cours/TP n° 3
}
// Ecriture d’un accesseur
public function get_km(){
return $this->km ;
}
// Ecriture d’une fonction
public function is_dead(){
return $this->PV == 0 ;
}
}
// Création d'une classe fille de Voiture
class Voiture_sport extends Voiture {
private vitesse ;
}
// Création d'une instance de classe
$vehicule = new Voiture(30);
// Utilisation d’une instance
echo "Votre voiture a {$vehicule->get_km()} km";
// Constantes de classes
echo 'Les km d’une voiture neuve sont de ', Voiture::km_initial;
// Destruction d’une instance
unset($vehicule);
?>
3.5 Exercices PHP
3.5.1 Exercice 1 : Compréhension
Soit le code PHP suivant :
<?php
$i=0;
print( $i++ + "3 cochons" . " chiens<br/>");
print("$i" . "3 cochons" . " chiens<br/>");
print( $i + "4.1 cochons" + " chiens" . 3/2 . "<br/>");
?>
Indiquez, sans exécuter le code, le texte affiché lors de son exécution. Vérifiez votre réponse en exécutant le petit
programme ci-dessus.
<?php
$tab[0] = 2004 ;
$tab[1] = 31.14E7 ;
$tab[2] = "PHP4";
$tab[35] = ’MySQL’ ;
$tab[3] = 24 ;
$tab[] = TRUE ;
?>
Que contient le tableau après l’exécution de ce code ?
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
5
G. Rey
2015-2016
Cours/TP n° 3
Pour vérifier vos réponses, écrivez le code PHP qui permet d’obtenir le nombre d’éléments du tableau ainsi que
leur valeur. Vous pouvez par exemple utiliser un foreach :
foreach (array_expression as $key => $value)
commandes
Pour plus d’informations sur l’utilisation et le fonctionnement des tableaux en PHP, consultez cette page.
3.5.2 Exercice 2 : Quelques exemples simples
Ecrivez un fichier PHP qui affiche les éléments suivants :
• La date du jour (fonction date)
• La date de dernière modification (fonctions date et filemtime)
• Le contenu d’un fichier texte (fonction include)
• L’adresse IP du client (fonction getenv)
3.5.3 Exercice 3 : Compteur de visite
On désire réaliser un compteur de visite. Pour cela vous allez stocker le nombre de visites dans un fichier sur le
serveur. Ecrivez une version simple de ce compteur puis une fois que celle-ci est fonctionnelle, utilisez les images
du cours/TP précédent pour faire une version graphique de votre compteur.
Indice : vous pouvez par exemple lire la valeur dans un fichier et la modifier à chaque chargement de la page (fopen(),
fgets(), fwrite())
3.5.4 Exercice 4 : Upload de fichiers et visualisation
Ecrivez un fichier permettant de sauvegarder sur le serveur des fichiers images (.png, .jpeg, .gif) dans un répertoire
images créé préalablement. Pour cela, on utilisera la méthode POST ainsi qu’un enctype multipart comme dans
l’exemple ci-dessous :
<!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>
<title>TP3</title>
</head>
<body>
<form method="post" action="test2.php" enctype="multipart/form-data" >
<fieldset>
<legend>Envoi de fichiers</legend>
<input type="hidden" name="MAX_FILE_SIZE" value="900000" />
<p>
<label for="photo">Photo :</label>
<input type="file" id="photo" name="photo" />
</p>
<input type="submit" name="envoi" value="Envoyer les fichiers" />
</fieldset>
</form>
</body>
</html>
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
6
G. Rey
2015-2016
Cours/TP n° 3
Indice : le fichier transmis par un formulaire est récupérable en PHP via la variable superglobale $_FILES[]. La
description de cette variable (que vous pouvez obtenir avec « print_r($_FILES); ») est la suivante :
Array
(
[nom_du_fichier] => Array
(
[name] => nom.jpg
[type] => image/jpg
[tmp_name] => chemin_complet_du_fichier_uploadé
[error] => 0
[size] => 1250
)
)
Par exemple, $_FILES[‘nom_du_champs_name_de_l_input’][‘name’] vous donne le nom du fichier transmis.
Pour des explications sur les messages d'erreurs de chargement de fichiers, vous pouvez consulter la page suivante
sur le site de php.net.
Ajoutez, ensuite, une fonction qui affiche le contenu de ce répertoire images et qui propose de visualiser chacune
des images qu’il contient. On limitera la taille des fichiers transférables à environ 900Ko.
Que se passe-t-il si on change le formulaire si dessus en définissant une limite à 10Mo (MAX_FILE_SIZE) au lieu
des 900 Ko actuel ? Que doit ton modifier pour que cela fonctionne ?
3.6 PHP et mysql
Lire et écrire dans une base de données est relativement simple en PHP, puisqu' il existe justement des fonctions
élaborées dans ce but. Regardons rapidement comment utiliser tout cela.
Commencez par créer une table de test avec la commande suivante sous mysql.
CREATE TABLE test (
id int(11) NOT NULL auto_increment,
nom varchar(20) NOT NULL,
email varchar(50),
dateheure datetime,
PRIMARY KEY (id)
);
Je vous rappelle que vous pouvez vous connecter à votre base mysql avec la commande suivante :
> mysql -u phpuser -ppassphp tp3db
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
7
G. Rey
2015-2016
Cours/TP n° 3
Pensez à ajouter quelques données dans votre table comme le montre l’exemple ci-dessous:
INSERT INTO test(nom,email,dateheure) VALUES('gaetan','[email protected]',NOW()) ;
3.6.1 Connexion avec la base de données depuis le code PHP
Avant d'envoyer des requêtes à la base de données, il faut déjà s'y connecter. PHP offre 3 APIs différentes pour se
connecter à MySQL (ext/mysql depuis PHP 2.0, ext/mysqli depuis 5.0 et PDO_Mysql depuis PHP 5.1). Il est
recommandé d'utiliser soit l'extension mysqli, soit l'extension PDO_MySQL. L'ancienne extension mysql est
obsolète depuis PHP 5.5.0, et sera supprimée dans un futur proche.
Pour cela on utilise la fonction mysqli_connect() :
// version mysql (ancienne version)
$c = mysql_connect(serveur, utilisateur, mot_de_passe) ;
mysql_select_db(base_de_donnees);
// version mysqli (style objet)
$mysqli = new mysqli(serveur, utilisateur, mot_de_passe , base_de_donnees);
// version mysqli (style procedural)
$link = mysqli_connect('localhost', 'my_user', 'my_password', 'my_db');
// version PDO_mysql
$pdo = new PDO('mysql:host=serveur;dbname= base_de_donnees, utilisateur, mot_de_passe);
La déconnection (avant la fin du script) se fait avec la fonction mysqli_close() :
//version mysql (ancienne version)
mysql_close() ;
$mysqli->close();
mysqli_close($link);
$pdo = null ;
3.6.2 Insertion de données dans la table
Une fois la base créée, vous pouvez y ajouter des données à l'aide de PHP. Comme vu précédemment, connectezvous d'abord avec mysql, puis sélectionnez la base sur laquelle vous voulez travailler. Envoyez ensuite des requêtes
(query) à la base.
//version mysql (ancienne version)
resource mysql_query ( string $query [, resource $link_identifier ] )
mixed mysqli::query ( string $query [, int $resultmode = MYSQLI_STORE_RESULT ] )
mixed mysqli_query(mysqli $link , string $query [, int $resultmode = MYSQLI_STORE_RESULT ])
public PDOStatement PDO::query ( string $statement )
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
8
G. Rey
2015-2016
Cours/TP n° 3
mysql_query(), mysqli_query() et query() envoient une seule requête à la base de données courante sur le serveur
associé. La chaîne de requête ne doit pas se terminer par un point-virgule.
<?php
switch($_POST['action']){
// INSERTION DANS LA BASE
case "inserer":
// déclaration de quelques variables
$host = "localhost";
$user = "phpuser";
$pass = "passphp";
$bdd = "tp3db";
$table = "test";
// connexion avec MySQL
@mysql_connect($host, $user, $pass) or die("Impossible de se connecter а la base de
données");
// Le @ indique а php de ne pas afficher de message d'erreur
@mysql_select_db($bdd) or die("Impossible de se connecter а la base de données");
// affichage sélection
echo '<p>Bonjour '.htmlentities($_POST['nom']).', votre email est ' .
htmlentities($_POST['email']).'</p>';
// stockage dans la bdd
$nom = $_POST['nom'];
$email = $_POST['email'];
if(!get_magic_quotes_gpc()){
// si php n'est pas configuré pour le faire automatiquement, on ajoute des \ devant les '
// deux raisons : autoriser d'ajouter des ', et sécuriser notre requête
// on y reviendra dans un prochain tutorial
$nom = addslashes($nom);
$email = addslashes($email);
}
$sql = "INSERT INTO " . $table . "(nom, email, dateheure) VALUES('" . $nom . "','" .
$email . "', NOW())";
$res = mysql_query($sql);
// déconnexion avec MySQL
mysql_close();
break;
// AFFICHAGE FORMULAIRE HTML
default:
?>
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<input type="hidden" name="action" value="inserer" />
<p>Votre nom : <input type="text" name="nom" /></p>
<p>Votre email : <input type="text" name="email" /></p>
<p><input type="submit" name="Submit" value="Ok" /></p>
</form>
<?
break;
}
?>
Adaptez le code ci-dessus en utilisant mysqli ou PDO au lieu de mysql.
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
9
G. Rey
2015-2016
Cours/TP n° 3
3.6.3 Affichage du résultat d’une requête
Vous avez maintenant des données dans la base, il ne vous reste plus qu'à les afficher. Le principe est le même que
précédemment : se connecter, puis envoyer des requêtes.
<?php
$sql = "SELECT * FROM " . $table;
$res = mysql_query($sql);
// Tant qu'une ligne existe, place cette ligne dans la variable $val
// sous la forme d'un tableau associatif.
while ($val = mysql_fetch_assoc($res)) {
$nom = $val['nom'];
$email = $val['email'];
$dateheure = $val['dateheure'];
echo $dateheure . ' : ' . $nom . '(' . $email . ')<br />';
}
?>
Adaptez le code ci-dessus en utilisant mysqli ou PDO au lieu de mysql.
3.7 Exercices PHP et mysql (conseillé)
Soit une base de données « magasin ». Cette base contient une table article, une table client, une table purchase et
une table order_. Vous pouvez télécharger le fichier pour créer la structure de cette table, ou créer le vôtre
répondant aux caractéristiques suivantes :
Un article aura un nom, une description, un prix, une disponibilité (en stock / 48 heures / 5 à 7 jours / 3
semaines / épuisé) et un identifiant unique.
• Un client aura un nom, un prénom, une date d’anniversaire (jour et mois), un mot de passe, une adresse
email et un identifiant unique.
• Un achat aura un numéro de commande, un identifiant d’article et une quantité d’article.
• Une commande aura une date de commande, un état (en préparation / bloquée / annulée / en livraison /
terminée), un identifiant de client et un numéro de commande
Peuplez votre base de données avec des éléments dont vous choisirez le thème.
•
3.7.1
•
•
Exercice 1 : Gestion du magasin (conseillé)
Concevez une page web qui permet d’ajouter un nouvel article ou de modifiez un article existant.
Concevez une page web permettant de créer un nouveau client.
On ne s’occupe pas pour le moment de savoir qui a le droit d’effectuer telle ou telle opération.
3.7.2
•
•
Exercice 2 : Achat en ligne (optionnel)
Concevez une page web qui affiche l’ensemble des articles, avec leur description ainsi que leur prix.
Donnez la possibilité à l’utilisateur de choisir une certaine quantité de chaque article et de valider une
commande. Tout se passe sur la même page, on utilisera des identifiants fixe pour l’utilisateur. La
commande et les achats seront sauvegardés dans la base de données.
3.7.3
•
Exercice 2 : Achat en ligne (optionnel)
Concevez une page qui permet d’afficher seulement les articles correspondant au nom saisi par
l’utilisateur.
Concevez une page qui affiche le détail d’une commande si on saisit son identifiant.
•
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
10
G. Rey
2015-2016
Cours/TP n° 3
3.8 Les sessions en PHP
Les sessions sont adaptées à la sauvegarde de données confidentielles ou importantes. On peut citer quelques
exemples courants de leur mise en application :
• authentifier un visiteur ;
• garder des informations sur un utilisateur tout au long de sa présence dans votre application ;
• gérer le panier d’achat d’un internaute sur votre site marchand ;
• mettre en place des formulaires en plusieurs parties et donc retenir les informations fournies dans les
pages précédentes ;
• effectuer un cache par utilisateur de certaines actions coûteuses en ressources.
3.8.1 Qu'est-ce qu'une session ?
Au lieu de stocker vos informations chez le visiteur, vous les stockez sur le serveur. Techniquement, vous attribuez
au visiteur un identifiant. À chaque fois qu'il revient en annonçant cet identifiant, PHP récupérera toutes les
informations qu'il avait sauvegardé et qui sont relatives à ce visiteur.
3.8.2 Lecture et écriture
L'utilisation des sessions est très simple pour le programmeur : la manipulation est presque transparente et il suffit
de lire ou d'écrire dans un tableau associatif classique une fois l'initialisation de la session faite.
La session s'initialise avec session_start(). PHP essaie alors de lire l'identifiant fourni par l'utilisateur, va chercher le
fichier correspondant, et vous met à disposition les informations sauvegardées dans la variable $_SESSION[].
bool session_start ( void )
session_start() crée une session ou restaure celle trouvée sur le serveur, via l'identifiant de session passé dans une
requête GET, POST ou par un cookie. Pour utiliser des sessions basées sur les cookies, session_start() doit être
appelée avant d'afficher quoi que ce soit dans le navigateur.
<?php
// initialisation
session_start() ;
// tester la présence de la variable 'langage' dans la session
if ( isset( $_SESSION['langage'] ) ) {
echo 'langage existe dans la session et sa valeur est ' ;
// lecture de la variable de session 'langage'
echo $_SESSION['langage'] ;
} else {
echo 'langage n\'existe pas dans la session' ;
}
?>
Pour écrire dans une variable de session il suffit d'initialiser la session via session_start() et d'écrire dans la variable
$_SESSION[].
<?php
// initialisation
session_start() ;
$_SESSION['langage'] = 'PHP 5';
?>
Apres cette instanciation il sera possible, sur toutes les pages suivantes, d'afficher la valeur de la variable de session
$_SESSION['langage'].
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
11
G. Rey
2015-2016
Cours/TP n° 3
3.8.3 Suppression d'une session
PHP efface la session de lui-même au bout d'un certain temps.
Si vous voulez forcer la destruction de la session vous pouvez utiliser la fonction session_destroy().
<?php
// on initialise et utilise la session
session_start();
$_SESSION['nom'] = 'Pierre';
echo $_SESSION['nom']; // affiche Pierre
// divers traitements
// on détruit la session
session_destroy();
unset($_SESSION);
echo $_SESSION['nom'] ; // n'affiche rien
?>
Notez que cette fonction ne fait qu'effacer le fichier de données sur le serveur, elle n'efface pas les variables
présentes dans $_SESSION[] ni ne supprime le cookie. Si vous voulez éviter tout risque de confusion, effacez
$_SESSION[] aussi.
3.9 Exercices SESSIONS
3.9.1 Exercice 1 : gestion des connexions (obligatoire)
Créez une page d’accueil index.php qui :
•
Affiche votre login, un lien de déconnexion et un message de bienvenue si une session PHP contenant
votre login existe.
•
Affiche un lien vers une page de connexion et un message vous invitant à vous connecter si aucune session
PHP est actuellement ouverte.
Créez, ensuite une page co_deco.php qui va gérer les connexions et déconnexions. Cette page prend deux
paramètres :
•
le mode (login ou logout) qui lui permettrons de connaitre s’il s’agit d’une action de connexion ou une
action de déconnexion. Exemple http://xxx.xxx.xxx.xxx/co_deco.php?mode=login
•
un identifiant de session permettant de savoir, en cas de déconnexion seulement, qu’elle session doit être
fermée. Exemple http://xxx.xxx.xxx.xxx/co_deco.php?mode=logout&sid=125369
Si on vient sur cette dernière page pour une déconnexion, elle devra fermer la session et afficher un lien vers la
page d’accueil. Si on vient sur cette page pour une connexion, elle devra afficher deux champs de saisie, un pour
l’identifiant un autre pour le mot de passe ainsi qu’un bouton de connexion. Vous vérifierez si le couple saisie
correspond bien à un utilisateur enregistrer dans votre base de données. La page réagira donc en fonction des
valeurs saisies :
•
Au moins un des champs de saisie est resté vide : la page se réaffiche et signale à l’utilisateur qu’il n’a pas
saisi le champ en question.
•
Les champs sont bien saisis mais le couple ne correspond pas à un couple login/pass existant : la page se
réaffiche et signale à l’utilisateur que les informations saisies sont incorrectes.
•
Les champs sont bien saisis et le couple correspond bien à un couple login/pass existant : la page se
réaffiche sans afficher les champs de saisie mais en faisant apparaitre un lien vers la page d’accueil.
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
12
G. Rey
2015-2016
Cours/TP n° 3
3.9.2
•
Exercice 2 : Gestion du magasin (optionnel)
Modifiez la page web qui permet d’ajouter un nouvel article ou de modifiez un article existant. Attention,
seul l’administrateur du site marchand devra pouvoir faire la modification.
•
Modifiez une page web permettant de créer un nouvel utilisateur. Cette page de création sera accessible à
tous les clients. Les clients enregistrés pourront modifier leur profil.
3.10 Les Cookies en PHP
Un cookie est un petit fichier texte placé dans l'ordinateur de l'internaute à la demande du serveur lors de la visite
d'une page. Ce fichier permet de stocker un petit nombre d'informations, comme un mot de passe, le nombre de
visites, etc. Il est conseiller d’utiliser les cookies avec parcimonie, car un internaute peut les supprimer ou
configurer son navigateur pour les refuser.
AVERTISSEMENT : Les cookies peuvent être considérés par certaines personnes comme une
violation de leur vie privée. La CNIL (Commission Nationale de l'Informatique et des
Libertés, France) recommande aux webmasters qui ont recours aux cookies de le signaler très
clairement sur leur page d'accueil.
Ainsi, il est souvent préférable d'utiliser les sessions à la place des cookies.
Un cookie peut être envoyé depuis un script PHP avec la fonction setCookie(). Cette fonction doit être utilisée
avant tout envoi d'en-tête HTTP au navigateur (il ne faut rien afficher avant d'utiliser cette fonction).
3.10.1 Création de cookie
Cette fonction prend pour paramètres :
• $name : le nom du cookie (cette chaîne de caractères ne doit contenir ni virgule, ni espace, ni les deux
points « : »).
• $value : la valeur du cookie.
• $expires : la date d'expiration du cookie au format timestamp Unix (c'est-à-dire le nombre de secondes
écoulées depuis le 1er janvier 1970), s'elle n'est pas spécifiée, le cookie sera supprimé lors de la fermeture
du navigateur.
• $path : le répertoire du site web pour lequel le cookie est valide (les sous-répertoires sont acceptés) : par
défaut le répertoire actuel
• $domain : le nom de domaine pour lequel le cookie est valide
• $secure : indique (0 ou 1) si le cookie doit être transmis via une connexion sécurisée par le protocole
HTTPS
Tous les paramètres sont optionnels sauf $name.
<?php
setcookie("TP3", "1", time()+24*3600, "/", "unice.fr", 0);
?>
Cet exemple envoie le cookie nommé TP3 de valeur 1, de date d'expiration : le jour suivant (aujourd'hui + 24
heures). Il est valide dans tout le site web (c'est-à-dire depuis la racine / du site) pour le domaine unice.fr. Il ne
requiert pas de connexion sécurisée par HTTPS.
3.10.2 Lecture de cookie
En PHP il n'est pas nécessaire d'aller chercher quoi que ce soit : PHP le fait tout seul automatiquement. Tous les
cookies valides pour le domaine et le répertoire du script PHP en cours vont être mis en mémoire. Ainsi des
variables portant le nom des cookies et valant leur valeur respective vont être créées. Le tableau $_COOKIE
contient la liste des cookies disponibles.
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
13
G. Rey
2015-2016
Cours/TP n° 3
<?php
echo $_COOKIE[TP3];// affiche "1"
?>
3.10.3 Suppression de cookie
Pour supprimer un cookie il suffit de le recréer à l'identique mais sans valeur et avec une date d'expiration
dépassée.
<?php
setcookie("TP3", "", time()-1000, "/", "unice.fr", 0);
?>
3.11 Exercices Cookies
3.11.1 Exercice 1 : gestion des styles (obligatoire)
Ecrivez une petite page PHP ainsi que au moins deux mises en forme différentes à l’aide de deux fichiers CSS
différents. Offrez sur cette page, la possibilité à l’utilisateur de choisir parmi les styles que vous proposez. Le choix
de l’utilisateur sera sauvegardé dans un cookie. Effectué la manipulation, puis fermer votre page. Rouvrez celle-ci.
Le choix de l’utilisateur devra être respecté.
3.11.2 Exercice 2 : gestion des connexions (conseillé)
Modifiez les pages écrites lors de l’exercice 1 de la partie SESSIONS et ajoutez-y les fonctionnalités suivantes :
•
La page de connexion/déconnexion crée un cookie sécurisé contenant le login et un autre le mot de passe
de l’utilisateur en plus de créer la session. Cette création devra uniquement se faire lors d’une connexion
valide.
•
La page de connexion/déconnexion détruit le cookie en cas de déconnexion.
•
La page d’accueil, dans le cas où il n’y a pas de session, vérifie la présence du cookie de connexion. S’il
existe, elle crée la session et s’affiche comme en cas de session ouverte. S’il n’existe pas, elle affiche le
même message qu’avant quand la session n’existait pas.
3.12 PHP et JavaScript
Voici un petit fichier PHP qui permet d’afficher la résolution de votre écran … Il utilise pour cela JavaScript pour
obtenir les valeurs. Comme on peut le voir dans le code, si les variable 'width'et 'height' n’ont pas de valeur, alors
PHP génère un page xhtml qui appellera la fonction JavaScript. Cette dernière calcule la résolution de l’écran puis
recharge la page PHP avec des valeurs pour les paramètres 'width'et 'height'.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>PHP HelloWorld</title>
<script type="text/javascript">
function resolution() {
document.location="<?php echo $_SERVER['PHP_SELF'];?>?width="
+screen.width+"&height="+screen.height;
}
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
14
G. Rey
2015-2016
Cours/TP n° 3
</script>
</head>
<?php
if(!isset($_GET['width']) and !isset($_GET['height'])){
echo '<body onload="resolution();">';
}else{
echo '<body>';
echo 'Votre résolution est ' . $_GET['width'] . ' * ' . $_GET['height'];
}
?>
</body>
</html>
Comme on le voit, il est très simple de partager des variables entre PHP et JavaScript.
Puisque AJAX correspond juste à une utilisation particulière de JavaScript, il est évidement possible de combiner
AJAX et PHP sur une même page. PHP gérant la dynamicité du côté du serveur (en calculant de nouvelles données
ou en allant les lire dans une base de données) et AJAX prenant en charge la dynamicité du côté du client.
3.13 Exercice PHP et JavaScript (Obligatoire)
Créez une page web qui affiche la liste des articles que contient votre base de données. Quand la souris survol un
élément de cette liste, celui est mis en valeur et une photo de l’article ainsi que sa description sont chargées depuis
la base de données et affiché comme le montre les photos ci-dessous.
4 ASP.NET
Nous allons finir ce cours/TP en regardant rapidement une autre technologie pour concevoir des pages
dynamiques coté client. Puisque vous devriez voir JSP/Servlet (la technologie de Sun Microsystems basé sur Java)
dans un autre cours, nous allons nous attarder un peu sur la troisième force, je veux bien sûr parler d’ASP de
Microsoft.
4.1 ASP, c’est quoi ?
Active Server Pages (ASP) est une technologie développée par Microsoft utilisée dans la programmation Web. C'est
une technologie web dynamique, équivalente et concurrente de PHP. Alors qu’ASP semblait en perte de vitesse
fasse à PHP et JSP, la version 4, nommée ASP.NET et basé sur le nouvel environnement de Microsoft, a propulser
ASP sur les devant de la scène. Plutôt que d’essayer de vous convaincre moi-même sur la qualité d’ASP.NET, je
vous propose de lire le petit document de Thomas Pétillon avant de poursuivre ce TP.
Asp.NET est basé sur la technologie .NET. Il permet la programmation d’applications Web dynamiques, du côté du
serveur. Les navigateurs Web, à l’aide de pages au format html, servent donc d’interface entre l’application .NET et
l’utilisateur. Contrairement à asp et php, où le code était inclus directement dans la partie html, asp.NET est un
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
15
G. Rey
2015-2016
Cours/TP n° 3
langage compilé. La partie html (interface) et la partie c# (traitements) peuvent ainsi être séparées au sein d’un
même fichier ou même dans des fichiers différents. Il est ainsi possible, pour un designer web, de mettre en forme
une page web sans pour cela connaître le langage c#. L’inverse est également vrai. Ainsi, il est possible de travailler
de manière séparée et d’avoir des personnes spécialisées pour chaque partie de la page. Ceci est un gros avantage
d’asp.NET.
Pages xhtml, Pages aspx, Feuilles de style css, Autres ressources …
Serveur ASP.NET
Réponse avec des
pages asp
Réponse avec
des pages html
Non
Première
exécution ?
Oui
Compilation
MSIL
Oui
Changement ?
Non
HTML
Requête
Navigateur Web du Client
Il est important de comprendre le fonctionnement de l’architecture client/serveur pour développer dans cette
architecture. C’est la raison pour laquelle nous allons voir cette architecture de manière schématisée.
Une page asp.NET possède une extension .aspx. Cette page a la forme générale suivante :
<head>
<script language= "c#" runat="server">
type fct (type i) { … }
</script>
<script language= "javascript">
function f ;
</script>
</head>
<body>
<table> …
</table>
<asp :Label [Propriétés]></asp :Label>
<% =fct(5) %>
</body>
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
16
G. Rey
2015-2016
Cours/TP n° 3
On peut séparer cette "page-type" en trois parties.
•
La première partie fait apparaître les scripts. On remarque que du c# et du JavaScript cohabitent dans la
même page. En quelques lignes, nous verrons ce qu'il est possible de mettre dans les balises de ce type.
•
La deuxième, permet de montrer que le code html est identique au code html d'une page web statique.
•
Et la dernière montre les balises qui déroutent le plus le non initié, c'est à dire <asp :…> et <% … %>. Il
s'agit en fait de, respectivement, la balise d'ouverture pour un WebForm asp.NET et d'une balise de
fonction. Nous allons les détailler quelque peu.
Tout script écrit en c# pour asp.NET doit se trouver entre les balises suivantes :
<script language= "c# " runat= "server ">
…
</script>
Le tout doit se trouver entre la balise html ouvrante et celle fermante. Mais en asp.NET, on peut utiliser n’importe
lequel des langages .Net. Par exemple,si l'on avait utilisé un autre langage tel que VB.NET, on aurait eu :
<script language= "VB.NET " runat= "server ">
…
</script>
Nous allons maintenant détailler ce qui se trouve dans ces balises.
•
La propriété language permet de déclarer le langage dans lequel le script est écrit. On ne peut définir qu'un
seul langage .NET pour la partie script par page .aspx.
•
La valeur "server" assignée à la propriété runat signale que le script doit s'exécuter sur le serveur
d'application. Le navigateur client ne recevra que du code html.
•
Entre les balises <body> et </body>, nous allons trouver les balises suivantes : <form runat= "server"> et
</form> qui signifient que nous utilisons un formulaire qui doit être traité par le serveur. Effectivement, le
client ne doit recevoir que du code html, le seul code compris par tous les navigateurs. Les balises <asp :
seront donc traitées avant l’envoi de la page html.
4.1.1 Syntaxe d'un WebForm asp.NET
Qu'est-ce qu'un WebForm ? Il s'agit d'un contrôle qui se trouve du côté serveur et qui est donc manipulé par les
scripts de traitement. Il n'est pas visible du côté du client puisque la page que celui-ci reçoit ne contient que du
html. Pour insérer un WebForm asp.NET, nous utiliserons l’une des deux méthodes suivantes :
<asp : … />
ou
<asp :Type [Propriétés]>
…
</asp :Type>
4.1.2 Exécution et appel de fonctions dans une page Web
Comme avec PHP, il est possible d’appeler du code directement dans une page web. Par exemple, on peut afficher
la date du jour directement et utiliser une fonction pour afficher celle du lendemain :
<head>
<script language= "c#" runat= "server">
string Demain(){
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
17
G. Rey
2015-2016
Cours/TP n° 3
DateTime Jour=DateTime.Now ;
Jour=Jour.AddDays(1) ;
return Jour.ToString() ;
}
</script>
</head>
<body>
<form runat="server">
Date du jour : <% =DateTime.Now.ToString() %><br>
Date de demain : <% =Demain() %>
</form>
</body>
4.2 Installation de l’environnement de développement (conseillé)
Pour commencer, nous allons installer l’environnement .net ainsi que Visual Web Developer. Attention, pour
VWD, plusieurs versions de Visual Studio sont disponibles : vbsetup.exe pour Visual Basic, vcsetup.exe pour Visual
C++, vcssetup.exe pour Visual C# et vwdsetup.exe pour Visual Web Developer. Choisissez ce dernier et installer
Silverlight Runtime en même temps car on l’utilisera dans le prochain TP. Il n’est pas nécessaire d’installer SQL
Server.
Attention, vous devez installer ces logiciels sur vos ordinateurs personnels ou sur les
machines de l’IUT dont vous êtes administrateur et cela seulement s’ils ne l’ont pas déjà
été.
4.3 Création de mes premières pages en asp.net
Afin de créer votre premier projet ASP.NET 2.0, ouvrez Visual Web Developer puis sélectionnez File -> New Project
-> Visual C# ->Web…, comme sur la fenêtre suivante :
Allez dans votre page Default.aspx et ajouter un champ texte, un bouton et un label :
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
<br />
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
18
G. Rey
2015-2016
Cours/TP n° 3
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
Ajoutez le code suivant a votre page Default.apsx.cs
protected void Button1_Click(object sender, EventArgs e){
this.Label1.Text = this.TextBox1.Text;
}
Testez votre page en cliquant sur la petite flèche verte, vous devriez obtenir la page suivante :
Bien sûr, il est possible de faire toute ces manipulations (et bien plus) à l’aide de l’interface graphique de Visual
Web Developer. Par exemple dans le cadre de cet exemple, seul le contenu de la méthode Button1_Click est à saisir.
On se rend vite compte que le principe est semblable à la programmation classique sous Visual Studio.
4.4 Exercices
4.4.1 Exercice 1 : vérification de valeurs (conseillé)
Ecrire une page ASP.NET qui fait la somme de 2 nombres saisis dans des champs textes. Si un champ texte ne
contient pas un nombre, il sera mis en rouge et le résultat sera vide.
4.4.2 Exercice 2 : Login et mot de passe (optionnel)
Créez une page contenant les éléments suivants :
•
Un champ nom d’utilisateur d’une longueur minimale de 5 caractères et de maximum 10
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
19
G. Rey
2015-2016
Cours/TP n° 3
Un champ nom de famille facultatif dont la longueur doit être inférieure à 25 caractères. La zone fera à
l’écran 15 caractères de large.
• Un champ prénom dont longueur est identique au nom.
• Un champ email.
• Un mot de passe.
• Un champ confirmation de mot de passe dont la valeur doit être identique à celle du champ mot de passe.
Ajoutez des mécanismes de contrôle sur les valeurs saisies pour qu’elles respectent les contraintes indiquées cidessus.
Organisez tout cela pour que ça ressemble à l’image ci-dessous :
•
Ajoutez un champ date de naissance. Ce champ pour être rempli soit directement par l’utilisateur soit en utilisant
un calendrier comme celui-ci :
La validation de la page par le bouton « envoi ! » ne pourra avoir lieu que si toutes les contraintes sont vérifiées.
Cela affichera une page avec les informations saisies comme un récapitulatif. Pour cela vous utilisez (pour le
moment) la méthode Response.Redirect(url) pour l’envoi des données. L’url sera du type :
nom_de_ma_page.aspx?att1=val1&att2=val2
Le traitement sur la page du récapitulatif se fera avec la méthode Request.Params[att] comme dans l’exemple :
Label1 = "<span>Nom de famille: " + Request.Params["nomF"].ToString() + "</span>";
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
20
G. Rey
2015-2016
Cours/TP n° 3
4.5 Variables de Sessions et d’Applications
4.5.1 Les variables de Sessions
Comme on l’a déjà vu avec PHP, les variables de session sont stockées en mémoire sur le serveur. Il peut y avoir
autant de variables de session que l’on le désire, cependant il ne faut pas perdre de vue qu’avec l’accroissement du
nombre de variables utilisées, ce sont souvent les performances qui sont en chute libre. Il faut donc trouver le juste
milieu entre performances et facilité. Les informations utilisées de manière répétée, si elles n’ont pas un trop haut
coût en mémoire, peuvent donc être stockée dans ce type de variables.
Ces variables sont accessibles du début à la fin de la session d’un navigateur, c’est à dire jusqu’à moment de non
activité du navigateur plus le timeout. Une session est un espace mémoire/disque sur le serveur associé à un et un
seul utilisateur/navigateur. Cette session possède un identifiant unique généralement stocké au niveau du
navigateur. Les variables de session sont stockées sur le serveur et sont accessibles par toutes les pages web
associées à cette session (mais uniquement pour cette session). Cet accès sera valable tant que le navigateur n’aura
pas été fermé et tant que la durée d’inactivité d’un utilisateur ne dépassera pas le timeout associé à la gestion de
session.
Comme pour le passage d’arguments dans l’url, les variables ne doivent pas être déclarées. Il faut donc faire
attention à l’orthographe du nom de nos variables. Celles-ci sont stockées dans le tableau Session et sont utilisable
de la manière suivante :
Session["nom_de_la_variable"] = val ; // affecte une valeur à la variable
String var = Session["nom_de_la_variable"] ; // récupère le nom de la variable
If (Session["nom_de_la_variable"] !=null) { // test si la variable existe
4.5.2 Les variables d’Applications
On a dit que les variables de sessions ne peuvent être accédées que pour une session. On peut cependant imaginer
vouloir partager des informations entre les différents navigateurs clients, comme par exemple la liste des
utilisateurs connectés. Ces dernières variables sont des variables d’application.
La syntaxe et l’utilisation des variables d’application sont les mêmes que pour les variables de sessions si ce n’est
que ces variables sont accessibles par toutes les sessions, il est donc possible de les faire communiquer. Celles-ci
sont dans le tableau Application[« nom_de_la_variable »].
4.6 Exercice (optionnel)
Concevez une page qui affiche le nombre de personne qui sont entrain de la consulter.
5 Références
Vous pourrez trouver des informations complémentaires à ce cours/TP dans les ouvrages et sites suivants :
•
PHP 5 - MySQL 5 – AJAX : 1ère édition, 12/2007 Editions Editions ENI, ISBN13 : 978-2-7460-4057-1
•
Pratique de MySQL et PHP : 3ème édition, Janvier 2005 Editions O'Reilly, ISBN13 : 9782841773381
•
PHP 5 et Apache 2 : 1 édition, 2006-06-08 Editions ENI, ISBN13 : 9782746033252
•
Les Cahiers du programmeur PHP 5 : 1 édition, 2004-06-01 Editions Eyrolles, ISBN13 : 9782212112344
•
Premières applications Web 2.0 avec Ajax et PHP : Janvier 2008 Editions Eyrolles, ISBN13 : 9782212120905
•
PHP 5 Avancé : 3eme édition, 2 octobre 2006 Editions Eyrolles, ISBN10 : 2212120044
Ce cours/TP a été créé en se servant des documents suivants :
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
21
G. Rey
2015-2016
Cours/TP n° 3
•
Cours complet de PHP4 et MySQL par Hugo ETIEVANT
•
Cours PHP par Guillaume Rossolini
•
ASP.NET : une architecture novatrice pour vos sites dynamiques par Thomas Pétillon
•
ASP.NET par Didier Danse
Tél : +33 (0)4 92 96 50 50 – Fax : +33 (0)4 92 96 50 55
22

Cours/TP n° 3 Technologies « coté serveur »

Transcription

Documents pareils

Schéma d`un territoire de l`innovation : le technopôle de Sophia

UNIVERSITE DE NICE (SOPHIA ANTIPOLIS) Référence GALAXIE

Programme 10 mars autour des images

Transport

Modélisation 3D dense temps réel par approche directe

Diplôme d`Ingénieur spécialité Bâtiments

Master II Stratégies d`entreprises et Développement

Diplôme et Spécialité : Ingénieur en Electronique