Sites web dynamiques avec PHP et Mysql Mettre en place un site web dynamique Mise en application Annie Danzart Annie.Danzart@telecom-paristech.fr http://www.infres.enst.fr/~danzart/php/ http://www.infres.enst.fr/~danzart/php/exemples/ 1
Sites web dynamiques avec PHP et Mysql Organisation du cours (7 séances sur 5 semaines) Objectif du module: un site de cartes de vœux numériques dynamiques Côté numérique: mettre en place un site web Côté dynamique: construire une carte en ligne avec le langage php Côté persistance: stocker les informations dans une base de données Mysql Annie Danzart, a.danzart@gmail.com http://www.infres.enst.fr/~danzart/php/ http://www.infres.enst.fr/~danzart/php/exemples/ http://www.infres.enst.fr/~danzart/mysql/ 2
Mise en place du site: côté technique Création de votre espace personnel: le home directory, votre login: login le dossier public_html le fichier index.html organisation des fichiers les droits d accès aux fichiers la page de vitrine: vous êtes libres d y placer les informations que vous voulez, sous la forme qui vous convient. Intégrez des images, des liens externes Serveur de fichiers perso.telecom-paristech.fr ~login ~login/public_html/index.html - public_html - Fichiers - Dossiers - Etc. - images - index.html - vitrine.html 3
La vitrine du site vitrine.html formulaire.php formulaire.php 4
Affichage sans serveur: Comment ça marche? file:///perso.telecom-paristech.fr/~login/vitrine.html Poste client chrome Javascript 3 Le navigateur est capable d afficher des pages html locales 1 2 Serveur de fichiers perso.telecom-paristech.fr perso.enst.fr Il est capable d interpréter des scripts javascript ~login/public_html/vitrine.html 5
Utilisation d un serveur: Comment ça marche? http://www.infres.enst.fr/~login/vitrine.html Poste client chrome Serveur Apache www.infres.enst.fr 1 4 httpd Serveur de fichiers 2 3 perso.telecom-paristech.fr Le serveur reçoit la requête et la traite en envoyant au client la page demandée ~login/public_html/vitrine.html 6
Schéma de fonctionnement du système de création formulaire.php validation.php execution.php validation.php execution.php Insertion dans la base de données Envoi d un email modification. carte.php 7
Schéma de principe du système formulaire.php validation.php execution.php (inclut connexion_inc.php) <form > validation.php <form > execution.php insert into </form> carte.php Modification </form> mail recapitulatif.php select * from cartes where C_ID=3 ; select * from cartes ; Mail : http://www.infres.enst.fr/~login/carte.php?nb=3 8
Les fichiers qui constituent le système vitrine.html: page d accueil du site. Écrite en html. Elle permet d accéder au site de cartes de vœux. Elle peut permettre d autres actions. formulaire.php: formulaire dynamique (en php) qui propose à l utilisateur de faire son choix. Il sera ensuite capable de prendre en compte des données précédemment saisies pour effectuer une modification. validation.php: page php qui récupère et restitue les choix de l utilisateur. execution.php: page php qui stocke les caractéristiques de la carte dans la base de données et envoie un email d annonce à son destinataire. Elle indique à l utilisateur qui tout s est bien passé. carte.php: page php qui affiche la carte de vœux constituée. recapitulatif.php: page php qui permet de visualiser la liste des cartes qui ont été envoyées. 9
Le formulaire de choix de carte formulaire.php validation.php validation.php Partie statique: nom, mail, message, thèmes Partie dynamique: mes images puisées dans un répertoire Hautement dynamique: on affiche les choix de l utilisateur pour que celui-ci vérifie qu ils lui conviennent 10
Créer un formulaire dynamique Comment créer un formulaire? formulaire.php Partie dynamique: des images puisées dans un répertoire Partie statique: nom, mail, message, thèmes, validation http://www.infres.enst.fr/~danzart/formulaires/formulaire-balises.html 11
Première étape: créer la partie statique Comment créer un formulaire statique? L attribut action du formulaire contient le nom du fichier qui s exécutera à la validation, soit validation.php noms, mails, message: champs de type input Thème: menu déroulant Validation: champ de type submit formulaire.php 12
Deuxième étape: valider la partie statique Comment créer un formulaire statique? Les informations transmises par le formulaire sont affichées pour confirmation. Ce mécanisme vient de l exécution d un script php capable de les récupérer et de les utiliser pour générer du source html dynamique qui les inclut. validation.php 13
Deuxième étape: valider la partie statique Il faut récupérer les données transmises par notre formulaire et les afficher sous une forme appropriée (html). Pour cela on utilise un script dont le but est de faire le travail. On peut ajouter une ligne qui affiche la date courante (fonction date() ). Elle sera également dans un script php. validation.php Nous sommes le 13/11/2012 14
Pages web dynamiques avec PHP et Mysql Ecrire un script PHP Annie Danzart Annie.Danzart@telecom-paristech.fr http://www.infres.enst.fr/~danzart/php/ http://www.infres.enst.fr/~danzart/php/exemples/ 15
Historique de PHP 1994 : Rasmus Lerdorf, Personnal Home Pages Pre Hypertext Processor Langage de scripting traité par le serveur, orienté web Module mod_php d'apache Gratuit, libre de droits (license GNU GPL) Nombreuses extensions (sgbd, ldap, gif, pdf, smtp, ) Syntaxe proche de celle de C, Java, Perl Comparable à ASP, asp2php Extensible Des milliers de sites de par le monde Versions 3, 4, 5, 6? 16
Différentes versions de PHP? php3: Première version stable, répond à la majorité des besoins des sites dynamiques php4: Introduction de la notion d objet et de sessions php5: SQLite: Un SGBD embarqué SimpleXML: Un nouveau parseur XML très efficace et très simple un nouveau modèle POO: Le modèle objet complètement remanié, l'ancien restant correctement interprété par php php6 (développement suspendu): Support d'unicode, Amélioration de la Programmation Orienté Objet, Amélioration et sécurisation des fonctionnalités php et les CMS: http://www.scriptol.fr/cms/liste.php 17
Les pages php Une page php = page html contenant des scripts, extension spécifique du fichier Page php ü Une page html ü Des scripts php. ü L ensemble des scripts d une page utilise le même contexte ü Chaque script peut générer du code html qui s intègre à sa place dans la page html où il se trouve ü L extension de la page doit être php, ou php3, phtml, php4, php5 sinon le serveur ne sait pas qu il doit interpréter des scripts 18
Les scripts php Formulation des scripts php, identification <?php?> <??> <script language="php"> </script> <%php %> <?=$nom?> Ecriture la plus standard (recommandée) Encore très utilisée. A la Javascript Compatible avec ASP Ecriture raccourcie, pas toujours correctement interprétée 19
Php: définir des scripts Environnement d un script, résultat d exécution: premier exemple <html> <head><title>bienvenue</title> </head> <body> <?php // commentaire?> $nom="martin"; <h1 align="center"> Bonjour <?php echo $nom;?> </h1><br> Il est <?php echo date("h:i");?> <br> </body> </html> Exemple : http://www.infres.enst.fr/~danzart/ php/exemples/scripts_test.php Remarque : la fonction date : http://www.infres.enst.fr/~danzart/php/ phpplus.php#dates 20
Interprétation d un script php : Comment ça marche? http://www.infres.enst.fr/~danzart/validation.php Poste client chrome Serveur Apache www.infres.enst.fr 1 5 4 httpd mod_php5 Serveur de fichiers perso.telecom-paristech.fr 2 3 Le serveur passe le fichier au module php avant de le retourner au client ~danzart/public_html/validation.php 21
Les scripts, les variables Les variables: les identificateurs, les types ü Types de base: entiers, réels, chaînes de caractères ü Tableaux, tableaux associatifs ü Objets ü Les noms de variables commencent par le caractère $ ü php est sensible à la casse ($i et $I sont deux variables différentes) ü Un nom peut commencer par une lettre ou un _ ü Il peut comporter des caractères, des chiffres et _ ü Les variables ne sont pas typées, n ont pas besoin d être déclarées ü Elles ont une valeur par défaut qui dépend du contexte d utilisation 22
Php: Les scripts, les variables Variables, types de variables <html> <head><title>bienvenue</title> </head> <body> <?php // definition d une variable $a=10; echo "<font color=\"red\">"; echo "Hello C est $a"; $a=$a+10;?> </font></body> </html> Remarque: - une variable peut changer de valeur en cours de script 23
Les scripts, les variables Les Constantes <html> <head><title>bienvenue</title> </head> <body> <?php // définition d une constante define("salut","bonjour a tous<br />"); echo "<font color=\"red\">"; echo "Hello ".Salut;?> </font></body> </html> Exemple: http://www.infres.enst.fr/ ~danzart/php/exemples/ commentaires_test.php Remarques: - l opérateur. de concaténation - insertion de balises html - échappement de caractères 24
Les variables en php Affectation d une valeur à une variable, quelques opérations $chaine = "Poire"; // chaîne de caractères $nombre = 0; $nombre++; // nombre 1 (entier) $nombre+=1; // entier (2) $nombre = $nombre + 1.3; // réel (3.3) Simple et double quote Chaîne dynamique $val = 'Rusti'; echo "Hello $val"; // Hello Rusti echo 'Hello $val'; // Hello $val Exemple: http://www.infres.enst.fr/~danzart/ php/exemples/variables_test.php 25
Les variables en php Les variables: opérateurs arithmétiques, opérateurs logiques Principaux opérateurs arithmétiques : +, -, *, /, %, ++, --, +=, ==, Arithmétiques $a + $b - $c $a * $b / $c $a % $b $a++ Incrément de 1 $b-- Décrément de 1 Assignation de valeur =, +=, -=, *=, /=, %=,.= Comparaison entre expressions ==, =, <, >, <=, >= Concaténation $chaine="votre nom est ".$val; Opérateurs Logiques not,, &&,, AND, XOR, OR rque : précédence de or sur $a = foo() bar() or die(); Binaires bitwise &,, ^, ~, >>, <<, - Autres @ : contrôle d'erreur? : opérateur ternaire 26
Les tableaux Manipulation de tableaux, tableaux dynamiques // on donne l indice $fruits[0]= "pomme"; $fruits[1]= "banane"; //un indice par défaut $fruits[] = "orange"; // équivaut a $fruits[2]= "orange" //initialisation en bloc $fruits= array(3=> "pomme", 1=>"banane",4=> "orange" ); //initialisation en bloc //avec des indices par defaut $fruits= array( "pomme", "banane", "orange" ); A priori, les indices commencent à 0. Pas besoin de déclarer la dimension ni le type des valeurs. Si on ne donne pas d indice, l indice pris en compte sera celui qui suit la valeur la plus haute (0 si rien n a encore été mis). L initialisation peut se faire «en bloc», en précisant ou non les indices. Les tableaux dynamiques sont très utiles lors de l utilisation de champs de type «checkbox» dans un formulaire. Exemple : http://www.infres.enst.fr/~danzart/php/ exemples/tableaux_test.php 27
Les tableaux Les tableaux: fonctions associées, Traitement du tableau dans sa globalité sizeof($t) = count($t) is_array($t) reset($t) end($t) current($t) Positionnement dans un tableau : next($t) prev($t) représenté par une liste de doublets (indice,valeur) sort, rsort, ksort, krsort, usort shuffle($t) max($t) min($t) arraywalk($t,"nomfonction") Taille d un tableau Est-ce un tableau? Tri ascendant, descendant sur la valeur, sur la clé, avec une fonction utilisateur Mélange aléatoire Calcul des valeurs extrêmes Applique une fonction à toutes les valeurs d un tableau 28
Les tableaux Parcours d un tableau $t = array("i","n","f","3","4","7"); sort($t); // instruction de boucle sur les // éléments de tableau for ($i=0;$i<count($t);$i++) echo "t[$i]=".$t[$i]."\n"; sort($t); reset($t); // autre instruction de boucle while(list($cle,$valeur)= each($t)) echo "t[$cle]=".$t[$cle]."\n"; L ajout de "\n" dans l affichage introduit un saut à la ligne dans le source. $a = each($t) renvoie l'index et la valeur courante dans un tableau à 2 éléments; $a[0] contient l'index, $a[1] la valeur. list($cle, $valeur,... ) construit un tableau temporaire à partir des variables scalaires passées en argument. Exemple: http://www.infres.enst.fr/~danzart/ php/exemples/tableaux_fonctions_test.php 29
Les tableaux Les Tableaux associatifs: Les indices ne sont pas forcément numériques $mois["janvier"]= 1; $mois["février"]= 2; $mois[] = array("janvier"=>1,"février"=>2, "Mars"=>3); while (list($cle,$val) = each($mois)) echo "<br> No de $cle : $val "; foreach ($mois as $cle => $val) echo "<br> No de $cle : $val "; key($t):index de l'élément courant du tableau uasort($t,"f_comp"): tri à l aide d une fonction en gardant les indices associés Les indices du tableau sont alors des chaînes de caractères qui pourront être traitées en tant que telles. L emploi de la fonction each s avère importante pour parcourir les tableaux associatifs. On peut aussi utiliser la boucle foreach. Exemple: http://www.infres.enst.fr/~danzart/ php/exemples/ tableaux_associatifs_test.php 30
Un formulaire: comment le gérer en php Déclaration, balises, méthode <form method="post" action="execution.php"> <H2>Questionnaire</H2> Prénom? <input name="prenom" value="xxx"><p> Votre nom? <input name="nom" value="yyy"><p> Votre couleur favorite? <select name="couleur"> <option selected value="white">blanc <option value="yellow">jaune <option value="green">vert </select><p> Cliquez sur <input type="submit" value="valider"> pour valider. </form> La balise form délimite le formulaire Son attribut method détermine le mode de transmission des paramètres L attribut action précise le programme qui s exécute lors de la validation Balises: form, input (type, name, value), select (name), option (value), Les balises d'un formulaire Exemple: http://www.infres.enst.fr/~danzart/php/exemples/ formulaire_test.html 31
Un formulaire: comment le gérer en php Formulaires: Récupération des valeurs transmises On écrit un script php dans le fichier d exécution execution.php A chaque paramètre du formulaire transmis est associée dans ce script une variable php qui contient la valeur choisie par l utilisateur. En fait ces variables sont des éléments d un tableau associatif dont le nom dépend de la méthode de transmission choisie: Méthode post => tableau $_POST Méthode get => tableau $_GET Pour le paramètre prenom, la valeur transmise est $_POST["prenom"] Il en est de même pour les paramètres nom, couleur, et même le bouton de soumission si on lui donne un nom. Il peut être pratique de définir localement des variables qui auront le même nom que les paramètres: $prenom = $_POST["prenom"]; $nom = $_POST["nom"]; Puis on peut afficher leur valeur: echo $prenom; Exemple: http://www.infres.enst.fr/~danzart/php/exemples/ formulaire_test.html 32
Php: Les formulaires, le type image Cas particulier du type image <H1>Formulaire2 </H1> <form method="post" action="execution.php"> <H2>Questionnaire</H2> Votre prénom? <input name="prenom" value="xxx"><p> Cliquez sur <input type="image" name="im1" src="images/bouton.gif"> pour valider. </form> L image remplace le bouton de soumission du formulaire. Les coordonnées du point où l'utilisateur aura cliqué seront : $im1_x et $im1_y Exemple : http://www.infres.enst.fr/ ~danzart/php/exemples/images_test.php 33
Php: Les formulaires, les checkbox Les checkbox: paramètres html, récupération des données sous forme de tableau <form method="post" action="execution3.php3"> <H2>Questionnaire : votre choix</h2> <input type="checkbox" name="fruits[]" value="pomme"> Pommes <input type="checkbox" name="fruits[]" value="poire"> Poires Cliquez sur <input type="submit" value="valider"> pour valider. </form> Le nom du champ de type checkbox prévoit que les valeurs choisies seront stockées dans un tableau dynamique. Seules les valeurs choisies seront transmises sous le nom fruits[] L appel de la fonction php count($fruits) permettra de savoir combien de valeurs sont dans le tableau. Exemple : http://www.infres.enst.fr/~danzart/php/ exemples/checkbox_test.php Source du script 34
Votre formulaire de choix de carte formulaire.php validation.php validation.php Partie statique: nom, mail, message, thèmes Hautement dynamique: on affiche les choix de l utilisateur pour que celui-ci vérifie qu ils lui conviennent 35
Partie dynamique du formulaire Comment créer un formulaire? formulaire.php Partie dynamique: des images puisées dans un répertoire Ce sont ces images qui serviront dynamiquement à la création des boutons radio de choix d image 36
Première étape: préparer le dossier d images Dans votre espace personnel: placez les images de votre choix dans un sous-dossier images assurez-vous que leurs noms respectent les règles suivantes: - noms courts sans espace ni accent - attention aux majuscules/minuscules - donnez les bons droits au dossier d images (755: lecture et exécution pour tous) - donnez les bons droits aux images (644: lecture pour tous) Il faut ensuite modifier votre formulaire pour y intégrer ces images. Serveur de fichiers perso.telecom-paristech.fr ~login - public_html - Fichiers - Dossiers - Etc. - images - index.html - vitrine.html ~login/public_html/index.html 37
Php: Les fichiers, les répertoires Un script qui permet de lire le contenu d un dossier /* affichage des entrées d'un répertoire */ $repertoire="images"; $d = dir($repertoire); echo "chemin : $d->path<br>"; while ($entry = $d->read()) echo "$entry<br\n"; $d->close(); Ou $d = opendir($repertoire); while ($entry = readdir($d)) echo "$entry<br\n"; $close($d); On peut utiliser la liste de ces entrées pour créer des liens vers ces fichiers ou répertoires echo "<a href=\"$repertoire/ $entry\">$entry</a><br>\n"; On peut aussi utiliser ces entrées pour afficher des images echo "<img src=\"$repertoire/ $entry\» />$entry<br>\n"; Exemple : http://www.infres.enst.fr/~danzart/php/ exemples/rep_test.php 38
Php: Les instructions de boucle Les boucles finies (for), les boucles conditionnelles (while, do while) <?php $n=28; for ($I=1;$I<$n;$I++) { } print("$i,<br>"); for ($I=1;$I<$n;$I++): print("$i,<br>"); endfor;?> <?php $n=28; while ($I<$n) { } print("$i,<br>"); $I=$I+1; while ($I<$n) : print("$i,<br>"); $I=$I+1; endwhile;?> <?php $n=28; do { } print("$i,<br>"); $I=$I+1; while ($I<$n);?> 39
Php: Les instructions de boucle, les conditions Comment construire une condition: les opérateurs Opérateurs: de comparaison entre expressions : ==, =, <, >, <=, >= Logiques : not,, &&,, AND, XOR, OR Valeurs logiques par défaut: Entier 0 è false 0 è true Réel 0.0 è false 0.0 è true Chaîne de caractères "" è false "" è true Tableau ou objet Null è false Null è true 40
Php: Les instructions de boucle Les instructions de boucle pour tableaux associatifs <?php foreach ($tab as $val) { }?> echo "valeur : $val<br/>\n"; <?php est équivalent à : reset($tab); while (list(,$val)=each($tab)) { }?> echo "valeur : $val<br/>\n"; <?php foreach ($tab as $cle => $val) {// bloc d instructions } echo "clé : $cle<br/>\n"; echo "valeur : $val<br/>\n";?> est équivalent à : <?php reset($tab); while (list($cle,$val)=each($tab)) {// bloc d instructions?> echo "clé : $cle<br/>\n"; echo "valeur : $val<br/>\n";} 41
Php: Les instructions conditionnelles Instructions conditionnelles: if, switch // notion de bloc {} if ($a > $b) { echo "a supérieur à b"; } elseif ($a == $b) { echo "a égal à b"; } else { } echo "a inférieur à b"; if ($a > $b): echo "a supérieur à b"; elseif ($a == $b) : else : endif echo "a égal à b"; echo "a inférieur à b"; $jour=date("l"); $mois=date("f"); switch ($mois) { case "January" : ;break; case "February": ;break;.... case "November": ;break; case "December": ;break;} printf(date(" Y ")); switch ($mois) case "January" : ;break;.... case "December": ;break; endswitch 42
Le formulaire: parcourir le dossier d images Parcours simple du dossier pour affichage des images // ouverture du repertoire de nom "images» $pointeur=opendir('images'); // boucle qui parcourt le dossier while ($entree = readdir($pointeur)) { // on peut choisir les fichiers a afficher if (($entree = ".") && ($entree = "..")) echo "<img src=\"$repertoire/$entree\" width='25'>"; } // fermeture du repertoire repere par $pointeur closedir($pointeur); 43
Le formulaire: parcourir le dossier d images Ajout des boutons de radio Un exemple // ouverture du repertoire de nom "images» $pointeur=opendir('images'); // boucle qui parcourt le dossier while ($entree = readdir($pointeur)) { // on peut choisir les fichiers a afficher if (($entree = ".") && ($entree = "..")) { echo "<img src=\"$repertoire/$entree\" width='25'>"; echo "<input type=\"radio\" value=\"$entree\">"; } } // fermeture du repertoire repere par $pointeur closedir($pointeur); 44
Le formulaire: parcourir le dossier d images On n affiche que 4 images par ligne // ouverture du repertoire... $n=0; // on initialise un compteur // boucle qui parcourt le dossier while ($entree = readdir($pointeur)) { // on peut choisir les fichiers a afficher if (($entree = ".") && ($entree = "..")) { $n = $n + 1; // on compte une image de plus if ($n == 5) // la ligne courante est pleine { echo "<br />"; // on passe a la ligne $n = 1; // on reinitialise le compteur a 1 (1 image) } echo "<img src=\"$repertoire/$entree\" width=\"25\">"; echo "<input type=\"radio\" value=\"$entree\" name=\"image\">"; } } // fermeture du repertoire repere par $pointeur... 45
Le formulaire de choix de carte modifié formulaire.php validation.php validation.php Maintenant le formulaire est dynamique, il contient autant d images que dans le dossier «images» Le fichier validation prend en compte cette donnée et affichera l image choisie par l utilisateur. Le nom du fichier est dans $image. 46
Validation du formulaire: le contrôle validation.php carte.php carte.php La page de validation contient un bouton de contrôle qui envoie l affichage de la carte ainsi générée. La carte est composée dynamiquement à partir des informations envoyées par l utilisateur. 47
Validation du formulaire: le bouton de contrôle Le mécanisme de contrôle visuel de la carte ainsi définie Le bouton de contrôle est en fait un formulaire dynamique contenant tous les champs transmis comme données input envoyés en champs cachés (hidden) validation.php <form action="carte.php" method="get"> <input type="hidden" name="nom" value="<?php echo $nom;?>">... <input type="submit" value="contrôler"> </form> 48
Validation du formulaire: la carte Constitution de la carte de voeux carte.php La carte de vœux fonctionne exactement comme la validation du formulaire. Seule la présentation des informations change (plus ergonomique) et elle ne présente pas les boutons de confirmation, contrôle ou modification. 49
Modifications des informations transmises validation.php formulaire.php formulaire.php La page de validation contient un bouton de contrôle qui renvoie l affichage du formulaire dynamique. Le formulaire dynamique prend en compte les valeurs des paramètres transmises pour les initialiser 50
Validation du formulaire: le bouton de modification Le mécanisme de modification des paramètres saisis par l utilisateur Le bouton de modification est, comme le bouton de contrôle, un formulaire dynamique contenant tous les champs transmis comme données input envoyés en champs cachés (hidden) validation.php <form action= "formulaire.php" method="get"> <input type="hidden" name="nom" value="<?php echo $nom;?>">... <input type="submit" value="modifier"> </form> 51
Retour sur le formulaire dynamique Initialiser les paramètres du formulaire avec les informations transmises 1) On récupère les valeurs transmises grâce au tableau $_GET ou $_POST selon la méthode utilisée. Par exemple: $nom=$_get["nom"]; 2) Pour chaque champ de type input, on ajoute un attribut value avec la valeur dynamique. Par exemple, pour le paramètre nom, on indique en plus: value="<?php echo $nom;?>" formulaire.php 3) Pour l image, il faut inclure un test dans la boucle d affichage. 4) La validation du formulaire ne change pas. 52
Le formulaire: initialiser l image choisie Pour chaque image du répertoire, on teste si c est le nom d image transmise ou non // ouverture du repertoire... $n=0; // on initialise un compteur // boucle qui parcourt le dossier while ($entree = readdir($pointeur)) { // on peut choisir les fichiers a afficher if (($entree = ".") && ($entree = "..")) { // gestion des images dans les lignes...... echo "<img src=\"$repertoire/$entree\" width=\"25\">"; if ($entree == $image) // c est l image transmise echo "<input type=\"radio\" checked value=\"$entree\" name=\"image\">"; else echo "<input type=\"radio\" value=\"$entree\" name=\"image\">"; } } // fermeture du repertoire repere par $pointeur... 53
Le formulaire: initialiser le thème choisi Dans les choix possibles du menu, on rajoute le choix de l utilisateur <select name="theme"> <option value="<?php echo $value;?>" selected ><?php echo $value;?></option> <option value="bon anniversaire">bon anniversaire</option> <option value="bravo ">Bravo </option> <option value="joyeuses fêtes">joyeuses fêtes</option> </select> 54
Confirmation du formulaire: le bouton de confirmation Le mécanisme de validation définitive de la carte ainsi définie Le bouton de confirmation est, comme le bouton de contrôle, un formulaire dynamique contenant tous les champs transmis comme données input envoyés en champs cachés (hidden) execution.php <form action= "execution.php" method="get"> <input type="hidden" name="nom" value="<?php echo $nom;?>">... <input type="submit" value="confirmation"> </form> 55
Confirmation du formulaire: le bouton de confirmation Le mécanisme de validation définitive de la carte ainsi définie execution.php A la confirmation du formulaire, le script php qui s exécute aura 3 fonctions importantes: 1) Enregistrer les caractéristiques de la carte dans une base de données. 2) Envoyer un email au destinataire afin qu il puisse aller visualiser la carte qui a été conçue pour lui. Le contenu de ce message va dépendre de l endroit où les informations sont stockées dans la BDD. 3) Indiquer à l utilisateur que tout s est bien passé. C est la partie la plus simple puisqu elle consiste simplement à afficher dynamiquement une page de confirmation. 56
Pourquoi utiliser une base de données? Annie Danzart Annie.Danzart@enst.fr http://www.infres.enst.fr/~danzart/mysql/ 57
Intérêt d une base de données Base de Données (Système de Gestion de Bases de Données): - ensemble de données géré par un programme informatique. - les données qui ont la même structure (nom; prénom, âge, adresse, profession) sont rangées dans un même tableau. - toutes les données d une même colonne sont du même type (texte, nombre entier, ). - un tel tableau est appelé une table En général, un SGBD est capable de gérer simultanément plusieurs bases de données. Dans une table, on trouve les enregistrements (lignes) qui constituent les informations stockées. Le nombre et la nature des colonnes (champs) constitue la structuration des informations. Nom Prénom Sexe Adresse Ville Code postal Danzart Annie F 23 rue des oiseaux Champs 94123 Trimouille Stéphane M 43 rue des Ormes Grenoble 38001 Choltesse Fabien M 33 place des Italiens Nancy 54000.................. 58
Intérêt d une base de données Une base de données est en principe stockée sur un réseau (internet) qui permet d y accéder de plusieurs différents avec bien souvent des interfaces différentes (client, gestionnaire, administrateur, système dédié, web, ). Base de données: données brutes Administrateur Système dédié Serveur: SGBD Visiteur 2 Navigateur web Gestionnaire Système dédié Visiteur 1 Navigateur web 59
Bases de données relationnelles Base de données relationnelle (SGBDR): - Structuration des données sous forme de tables - Définition précise (type, valeur par défaut) du modèle de données à l aide d un schéma conceptuel. - Le système est capable de gérer plusieurs bases de données, chaque base étant constituée de plusieurs tables. - Les tables seront reliées à l aide de relations. - Index unique qui permet au système d accélérer les opérations de recherche et de tri. - Utilisation de clés pour réaliser les relations entre tables afin de ne pas dupliquer inutilement les informations. - Ces clés sont à valeur unique pour assurer qu il n y aura pas de doublon dans les enregistrements. - Langage normalisé d interrogation SQL (Structured Query Langage). Exemple de schéma conceptuel 60
Bases de données relationnelles: exemple Tables +------------------------+ Tables in magasin_test +------------------------+ clients commandes produits +------------------------+ Structure de la table clients: +----------+---------+------+-----+---------+----------------+ Field Type Null Key Default Extra +----------+---------+------+-----+---------+----------------+ C_ID int(11) PRI 0 auto_increment C_nom text YES NULL C_prenom text YES NULL C_numero int(11) YES NULL C_email text YES NULL +----------+---------+------+-----+---------+----------------+ Structure de la table commandes : +-----------------+---------+------+-----+---------+----------------+ Field Type Null Key Default Extra +-----------------+---------+------+-----+---------+----------------+ COMMANDE_ID int(11) PRI 0 auto_increment C_ID int(11) YES NULL P_ID int(11) YES NULL COMMANDE_nombre int(11) YES NULL COMMANDE_date text YES NULL +-----------------+---------+------+-----+---------+----------------+ 61
Mysql : un SGBD relationnel l Logiciel libre de droits (license GPL) actuellement version 5, MariaDB, toujours en évolution http://www.mysql.com/ l l l l l Système de Gestion de Bases de Données Relationnelles: nombreuses fonctionnalités SGBDR Base de données mysql en tant que telle (bases gérées, utilisateurs autorisés) Langage de manipulation de bases de données (SQL) Comment ça marche? Architecture client-serveur Serveur mysqld, commande/programme mysql l Fonctions d'accès intégrées dans de nombreux langages 62
Une base de données importante: mysql user : table des utilisateurs référencés db : table des bases existantes host : table des droits d'accès par hôte host/user/password La table user: gère les autorisations d accès système droits utilisateur / administrateur dans mysql La table db: permet de gérer les droits d accès aux différentes bases (lecture, modification,..) host/db/user/select/insert/update/delete/alter/drop/create droits d'accès des utilisateurs pour chaque base La table host: précise quelles sont les machines qui permettent d accéder au système host/db/select/insert/update/delete/alter/drop/create droits d accès des hôtes pour chaque base dans mysql 63
Le langage mysql Langage de manipulation de bases de données ð Conforme au standard SQL (Structured Query Langage) show databases; create database carte_test; ; drop database autre_test; use carte_test; ; montrer la liste des bases présentes créer la base carte_test supprimer la base autre_test utiliser la base carte_test Création de la table cartes après avoir choisi la base carte_test create table cartes( C_ID int default '0' NOT NULL auto_increment, C_nom_dest text, C_nom_exp text, C_mail_dest text, C_mail_exp text, I_photo text, primary key (C_ID) ); Opérations sur les tables d une base (quelles tables?, structure d une table, modification, suppression) show tables ; show columns from cartes ; alter table cartes change C_dest C_destinataire text ; drop table cartes ; 64
Le langage mysql Langage de manipulation de bases de données insert into cartes (C_nom_dest, C_nom_exp, I_photo) values ("Toto","danzart","marguerites.jpg"); update cartes set C_nom_dest= "Moissinac" where C_ID=LAST_INSERT_ID(); select * from cartes order by C_ID desc; select * from cartes where C_nom_exp like %danzart'; delete from cartes where C_nom_dest like '%toto'; update cartes set C_nom_exp="Danzart" where C_nom_exp = %danzart'; 65
Architecture client - serveur 1) Client mysql : requêtes sql brutes pas toujours accessible 2) Client phpmyadmin : (http://www.infres.enst.fr/phpmyadmintp/) outil d'administration de mysql plus convivial écrit en php, accessible sur le web pas de contrôle de cohérence des données Simple exécution de commandes SQL 3) Clients personnalisés : adaptés à un besoin particulier chargés en plus d'assurer la cohérence grâce à php 66
Architecture client - serveur Client mysql de base fourni avec l'environnement > mysql -h mysql.tp.enst.fr -u user -p -h : hôte ( adresse IP ) -u : utilisateur ( accès spécifique ) -p : mot de passe ( défini au moment de la création de l utilisateur sera transmis après validation de la commande mysql ) Après validation de la commande, une session est ouverte qui permet de frapper directement des commandes mysql Autres outils faisant partie de la distribution : mysqldump, mysqladmin, mysqlimport 67
Architecture client - serveur Client phpmyadmin: interface web fournie avec l'environnement http://www.infres.enst.fr/phpmyadmintp/ Quelques exercices de manipulation de la base de données carte - Création d une table avec une clé primaire, un champ de texte et un champ numérique - Insertion d enregistrements - Faire une requête conditionnelle - Faire des requêtes automatiques (boutons) et voir la requête sql exécutée 68
Comment ça marche? http://www.infres.enst.fr/~danzart/exemple2.php Poste client firefox Serveur Apache www.infres.enst.fr 1 8 4 7 httpd mod_php5 Serveur de fichiers perso.telecom-paristech.fr 2 3 5 6 Serveur Mysql mysql.infres.enst.fr mysqld bases ~danzart/public_html/exemple2.php 69
Clients personnalisés en php Fonctions php d accès à Mysql $connexion = mysql_pconnect("mysql.infres.enst.fr:3307", "user", "motdepasse"); Le login et le mot de passe sont exprimés "en clair" dans le script : -> les stocker dans un fichier difficile d'accès (à inclure dans les pages) "connexion_inc.php" -> prévoir plusieurs modes d'accès: PUBLIC, utilisateur, administrateur mysql_close($connexion); mysql_create_db("cartes_test",$connexion); $mysql_result=mysql_list_dbs($connexion); mysql_drop_db("cartes_test",$connexion); 70
Interface personnalisée: insertion des codes de connexion On place les définitions des codes de connexion dans un fichier à part connexion_inc.php <?php $login="mm "; $pass="media "; $db="carte "; $hote="mysql.infres.enst.fr:3307"; $connexion=mysql_pconnect($hote,$login,$pass); mysql_select_db($db,$connexion);?> On inclut ce fichier dans le script qui en a besoin execution.php <?php include("connexion_inc.php");?> 71
Clients personnalisés en php Fonctions php d accès à Mysql <?php $connexion = mysql_pconnect("mysql.infres.enst.fr:3307", "user", "motdepasse"); mysql_select_db("carte27",$connexion); $query="create table..."; mysql_query($query,$connexion); $query = "select * from cartes;"; $resultat = mysql_query($query,$connexion); $nb = mysql_num_rows($resultat,$connexion);?> 72
Clients personnalisés en php Exploitation des résultats d une requête de sélection <?php // ouverture de la connexion : mysql_connect() ou mysql_pconnect() $connexion = @mysql_connect($hote,$utilisateur,$password) or die("pb de connexion"); mysql_select_db("carte3"); // choix de la base de données // prendre tous les champs de la table cartes de la base carte3 $query = "select * from cartes ;" ; echo $query; // pour afficher le texte de la requête (mise au point) $mysql_result = @mysql_query($query) ; if ($mysql_result == FALSE) {echo "Pas de solution"; exit; } else // prendre tous les enregistrements trouvés et les afficher?> 73
Clients personnalisés en php Exploitation des résultats d une requête de sélection <?php // ouverture de la connexion : mysql_connect() ou mysql_pconnect() // choix de la base de données // prendre tous les champs de la table cartes de la base carte3.. // prendre chaque rangée while ($ligne = mysql_fetch_array($mysql_result)) // ligne est un tableau associatif dont les indices sont les // champs retenus pour la requête et les valeurs celles trouvées // dans la base de données pour ces champs { // mettre en forme les résultats en html, echo $ligne["c_nom_dest"];?> } 74
Clients personnalisés en php Fonctions php d accès à Mysql int mysql_query($requete [,$connexion]), int mysql_insert_id(): pour voir le numéro du dernier enregistrement inséré int mysql_num_rows(): pour voir s'il y a des résultats string mysql_error(), int mysql_errno(): pour contrôler les erreurs si une requête n'a pas donné de résultat 75
Confirmation du formulaire: insertion dans Mysql Le mécanisme de validation définitive de la carte commence par execution.php 1) Enregistrer les caractéristiques de la carte dans une base de données. Pour cela, il faut construire dynamiquement la requête sql d insertion d un nouvel enregistrement dans la base de données cartes. 76
Confirmation du formulaire: insertion dans Mysql Structure de la table des cartes execution.php CREATE TABLE cartes ( C_ID int(11) NOT NULL AUTO_INCREMENT, C_nom_dest text, C_nom_exp text, C_mail_dest text, C_mail_exp text, C_texte text, C_menu tinytext NOT NULL, I_photo tinytext NOT NULL, C_date date NOT NULL, PRIMARY KEY (C_ID) ); 77
Confirmation du formulaire: insertion dans Mysql Insérer un enregistrement dans la table cartes execution.php INSERT INTO cartes (C_nom_dest, C_nom_exp, C_mail_dest, C_mail_exp, C_texte, C_menu, I_photo) VALUES ('Annie', 'Philippe', 'danzart@telecomparistech.fr', 'philippe@free.fr', 'Bonjour', 'Bravo', 'marguerites.jpg'); Le champ C_ID n est pas mentionné, il s incrémentera automatiquement. 78
Confirmation du formulaire: insertion dans Mysql Création dynamique de la commande d insertion INSERT INTO cartes (C_nom_dest, C_nom_exp, C_mail_dest, C_mail_exp, C_texte, C_menu, I_photo) VALUES ('$nomdest', '$nomexp', '$maildest', '$mailexp', '$texte', '$menu', '$image'); Il faut placer cette commande dans une chaîne php pour qu elle soit ensuite envoyée à la fonction mysql_query(). Il faudra échapper (\) les apostrophes. $query="insert INTO cartes (C_nom_dest, C_nom_exp, C_mail_dest, C_mail_exp, C_texte, C_menu, I_photo) VALUES ('$nomdest', '$nomexp', '$maildes', '$mailexp', '$texte', '$menu', '$image');"; Il reste enfin à exécuter cette commande d insertion: $resultat=mysql_query($query,$connexion); 79
Confirmation du formulaire: insertion dans Mysql Création dynamique de la commande d insertion En principe, si la commande d insertion a été correctement constituée, celle-ci s effectuera normalement. Si ce n est pas le cas, on peut ajouter une instruction d affichage de celle-ci: echo $query; On peut alors effectuer un contrôle visuel de cette commande. Si l erreur n est pas probante, on pourra, à l aide d un copier-coller dans phpmyadmin, effectuer celle-ci dans cet environnement et voir quel est son diagnostic. Lorsqu on sait que le mécanisme fonctionne bien, on récupère le numéro d enregistrement ainsi créé. $n=mysql_insert_id(); Il nous servira pour l envoi de mail et l affichage de la carte repérée à l aide de ce numéro. 80
Rappel: Schéma de principe du système formulaire.php validation.php execution.php (inclut connexion_inc.php) <form > </form> validation.php Modification <form > </form> execution.php insert into mail recapitulatif.php carte.php select * from cartes ; select * from cartes where C_ID=3 ; Mail : http://www.infres.enst.fr/~login/carte.php?nb=3 81
Confirmation du formulaire: envoi de mail Le mécanisme de validation définitive de la carte continue par execution.php 2) Envoyer un email au destinataire. On utilise la fonction php d envoi de mail: mail($adresse_dest,$sujet,$texte, "From: $adresse_exp\nreplyto: $adresse_exp"); Il faut donc définir les variables ainsi utilisées. Pour les adresses, il suffit reprendre ce qui a été transmis. Pour les autres, il va falloir les constituer. Par exemple: $sujet="envoi d une carte postale"; $message="bonjour $nom_dest,... "; 82
Fonction php d envoi de mail Définition du message qui sera transmis en html $message="bonjour $nom_dest, une carte postale vous est envoyée. Vous pouvez la consulter à l adresse: http://perso.telecom-paristech.fr/~login/carte.php?n= $nb. <br /> signé $nom_exp"; Le message peut être bien plus complexe et contenir des images, balises html interprétées. Cette fois-ci, le script php n est pas l exécution d un formulaire. Il peut néanmoins utiliser l envoi d un paramètre grâce à la méthode GET qui est ici explicite avec l utilisation du? suivi du nom du paramètre transmis et de la valeur qui lui est attribuée. Il faudra ensuite modifier légèrement votre script carte.php pour prendre en compte cette nouvelle donnée. 83
Fonction php d envoi de mail Envoi d un email transmis en html $sujet = "Sujet de l'email"; $message = "Bonjour,<br /> <strong>ceci est un message html envoyé grâce à php.</strong><br />"; $destinataire = "destinataire@domaine.com"; $headers = "From: \"expediteur moi\"<moi@domaine.com>\n"; $headers.= "Reply-To: moi@domaine.com\n"; $headers.= "Content-Type: text/html; charset=\"iso-8859-1\""; if (mail($destinataire,$sujet,$message,$headers)) { echo "L'email a bien été envoyé."; } else { echo "Une erreur c'est produite lors de l'envoi de l'email."; } 84
Confirmation du formulaire: affichage de la carte Le mécanisme de validation définitive de la carte se termine par execution.php 3) La prise en compte du stockage sur base de données des caractéristiques de la carte. Le mail d information au destinataire contiendra entre-autres un lien vers: http://perso.telecom-paristech.fr/~login/ carte.php?n=3 si l enregistrement concerné est au numéro 3. Pour l exécution du script, il faut donc aller chercher cet enregistrement à l aide d une commande SQL et récupérer ces caractéristiques. 85
Confirmation du formulaire: affichage de la carte L affichage de la carte doit pouvoir se faire dans deux contextes différents: 1) Affichage au moment de la création de la carte. C est ce que vous avez déjà écrit. 2) Affichage par l utilisateur final. carte.php La présentation doit être la même. Seule va changer la façon dont on récupère ses caractéristiques. Il nous faut donc déterminer dans quel cas nous nous trouvons. 1) Soit c est au moment de la création, la variable $n ne doit alors pas pouvoir être accessible. On continue alors à fonctionner comme avant. 2) Soit c est par l utilisateur final, il faudra alors exécuter la commande sql: $query="select * from cartes where C_ID=$n"; 86
Confirmation du formulaire: affichage de la carte <?php $n=$_get["n"]; if ($n == 0) // cas du simple contrôle { // pas de changement dans l initialisation des paramètres $nom_dest=$_get["nom_dest"]; // etc pour tous les champs } else // cas de l utilisateur final { include("connexion_inc.php"); $query="select * from cartes where C_ID=$n"; $resultat=mysql_query($query,$connexion); $ligne=mysql_fetch_array($resultat); $nom_dest=$ligne["c_nom_dest"]; $nom_exp=$ligne["c_nom_exp"]; $mail_dest=$ligne["c_mail_dest"]; // etc pour tous les champs } carte.php // Le reste qui est l affichage de la carte proprement dit ne change pas.?> 87
Confirmation du formulaire: affichage de la carte Un plus: Dès l instant qu on a les informations de constitution de la carte, on peut proposer au destinataire de la carte de répondre tout de suite à l expéditeur en lui donnant l adresse du formulaire de création pré-rempli avec les noms et les mails échangés (le destinataire devient l expéditeur et réciproquement). carte.php Cela se fera au moment de l affichage de la carte avec un bouton de formulaire dynamique à champs cachés qui envoie le script formulaire.php partiellement pré-rempli (les messages et la photo seront laissés au choix) 88
Confirmation du formulaire: afficher l ensemble Il peut être intéressant d avoir accès à l ensemble des cartes de vœux qui ont été constituées pour les visualiser et par exemple éviter d envoyer plusieurs cartes à la même personne Dans ce cas, après confirmation de création de la carte, on peut introduire un lien vers un script qui fera le travail. Ce récapitulatif peut aussi être disponible dans le formulaire du départ, ou dans la vitrine. recapitulatif.php carte.php?n=9 carte.php?n=10 carte.php?n=12 89
Confirmation du formulaire: afficher l ensemble <?php include("connexion_inc.php"); $query="select C_ID,C_nom_dest from cartes;"; // dans toutes les cartes $resultat=mysql_query($query,connexion); recapitulatif.php echo "<table>"; // debut du tableau echo "<tr><th>numéro</th><th>destinataire</th></tr>"; while (($ligne=mysql_fetch_array($resultat))) { // pour chaque carte trouvée $n=$ligne["c_id"]; $nom_dest=$ligne["c_nom_dest"]; echo "<tr>"; echo "<td>$n</td>"; echo "<td>$nom_dest</td>"; echo "<td><a href= carte.php?n=$n >voir</a></td>"; echo "<td><a href= supprimer.php?n=$n >retirer</a></td>"; echo "</tr>"; }?> echo "</table>"; // fin du tableau On peut ensuite ajouter un lien vers le formulaire de création de cartes de voeux. 90
Suppression d une carte Pour effectuer une suppression, il suffit d effectuer une connexion à la base de données et d exécuter la commande de suppression d une carte dont on connaît le numéro. Remarque: il ne sera désormais plus possible de l afficher Attention Cette suppression s effectue sans aucun contrôle. Pour le bien, il ne faudrait la faire qu après une confirmation de suppression définitive supprimer.php <?php $n=$_get["n"]; include("connexion_inc.php"); $query="delete * from cartes where C_ID=$n"; $resultat=mysql_query($query,connexion);?> 91
Pour aller plus loin Dans le cas d une base de données dont la structure est plus complexe, toutes les opérations de consultation, ajout, suppression se complexifient également. Le formulaire de création puisera les images dans la base de données et non plus dans le répertoire physique. Il transmettra le numéro d enregistrement de l image et non le nom du fichier. schéma conceptuel de la base avec 2 tables Toutes les opérations se feront en utilisant ce numéro (ajout d une carte par exemple). Pour l affichage de la carte, il faudra aller chercher les données dans deux tables différentes (jointure entre tables) select * from images,cartes where images.i_id=cartes.i_id; 92
Examen «Sites web dynamiques avec PHP et Mysql» Évaluation de votre travail : (rendre votre travail en fin de séance obligatoirement et une seconde version le 7 janvier au plus tard) Carte de vœux dynamique php 1) M envoyer une carte de vœux (danzart@telecom-paristech.fr) par envoi automatique. Le mail doit contenir si possible l url à cliquer pour afficher la carte. 2) M envoyer par email les noms des scripts que vous avez écrits avec l endroit où ils se trouvent (dossier se trouvant dans le public_html) Merci de votre attention 93