Développement web 2 CM, TD et TP en 30H Dr. Abakar Mahamat Ahmat Maître-assistant CAMES Enseignant-Chercheur Université de N’djaména Faculté des Sciences Exactes et Appliquées- FSEA Année académique 2020-2021 08:30 Cours Developpement web 2 – GL2 ENASTIC - Amdjarass 1 Plan Rappel : Le web, serveurs web, Les protocoles de communication, Programmation web statique Programmation web dynamique Les bases du PHP Transmission des données via url et formulaires Gestion des informations dans une base de données Hebergement d’un site web 08:30 2 Rappel 08:30 3 Le web Internet : Réseaux des réseaux, basé sur le protocole TCP/IP, fonction en mode client/serveur Langage de base utilisé : HTML World Wide Web : architecture basé sur trois concepts: La localisation : URL Le protocole : HTTP Le langage HTML 08:30 4 Le web World Wide Web : www Toile d’arainger D’étendue mondiale 08:30 5 Le web 08:30 6 Le web Les protocoles de communications http : HyperText Transfert Protocol telnet : ftp File tranfert Protocole Smtp : send Mail trenfert Protocol Etc. 08:30 7 Le web L’URL (Uniforme Ressource Locator) Adresse universelle de ressource A deux composants: Le nom d’hôte contenant la page web Le chemin d’accès sur l’hôte Exemple : www.someschool.edu/someDept/pic.gif L’agent utilisateur est le navigateur Internet Exploler, Nescape, … Serveur web : Apache, 08:30 8 Le web Fonctionnement du web Le client (navigateur) dialogue avec le serveur web par le protocole http Le serveur vérifie la demande, les autorisations et transmet les informations Le navigateur interprète le fichier reçu et l’affiche 08:30 9 Le web Vision du coté client Web = ensemble des pages (documents) contenant des liens vers d’autres pages Consultation des pages via un navigateur Le navigateur Analyse l’URL demandée Demande au DNS l’adresse IP du site distant Etablit une connexion TCP vers le numéro de port de l’URL (80 part défaut) Formule la requête au serveur Recherche la page demande Interprète les commandes et affiches les informations 08:30 10 Le web Vision du coté serveur Le serveur est en permanence à l’écoute des requêtes des clients (nombreux) Vérifie la validité du requête Adresse URL correct Client autorisé à accéder au document Et répond : 08:30 Envoi du texte, image, code à exécuter sur le client D’un message d’erreur D’une demande d’authentification Exécuter un programme localement qui génère une réponse HTML (page dynamique) 11 Programmation statique : HTML HTML : HyperText Markup Langage Format d'écriture de document du type SGML (Standard Generalized Markup Language) Définit par W3C (World Wide Web Cconsortium)organisme chargé de la normalisation et de la recherche sur la technologie Web Langage de description de documents documents HTML :Textes ascii ponctués par des séquences <BALISE> et </BALISE> Ensemble des balises pour définir les différents composants d’un document 08:30 12 Programmation statique : HTML Les balises: par "<" et se termine par " >" Non invisibles pour le visiteur servent de marqueurs pour le navigateur 2 types de balises : par paire Ou seule Par paire : Exemple <title>Bienvenue sur mon site !</title> <TABLE><TR><TD>Bonjour</TD></TR></TABLE> Seules : Exemple se termine toujours par un slash "/", placé à la fin de la balise. <img src="soleil.jpg"/> 08:30 13 Programmation statique : HTML Les attributs Permettent de donner des précisions sur une balise Exemple <img src="soleil.jpg"/> l'attribut est "src", et il a pour valeur "soleil.jpg" qui indique l'image à insérer </br> : qui indique retour à la ligne suivante ou insertion d’une ligne 08:30 14 Programmation statique : HTML Structure d’un document HTML <html> <head> <Title> Titre de la page </title> </head> <body> Corps du document </body> </html> 08:30 15 Programmation statique : HTML Explication : <html> : Balise d’ouverture du document <head> : Balise de l’entête <Title> : Tbalise de titre du document <body> : Balise indiquant le corps du document Les commentaires <! ----Commentaire ---- > Styles pour les textes <B> Affiche le gras <I> Affiche l’italique 08:30 16 Programmation statique : HTML Styles pour les textes <B> Affiche le gras <I> Affiche l’italique <h1>,<h2> ... <h6> : Définit des titres ou en-tête, de différentes tailles Exemple : <H1> En-tête </H1> 08:30 <CENTER> Pour centrer le texte <p> nouveau paragraphe </br> force le retour à la ligne suivante Etc. 17 Programmation statique : HTML Styles pour les textes Les listes à puces <UL> <LI> Texte 1 </LI> <LI> texte 2 </LI> </UL> ceci affiche ● Texte 1 ● Texte 2 08:30 18 Programmation statique : HTML Styles pour les textes Les listes numérotées <OL> <LI> Texte 1 </LI> <LI> texte 2 </LI> </OL> ceci affiche 1. Texte 1 2. Texte 2 08:30 19 Programmation statique : HTML Styles pour les textes Les liens hypertext <A HREF="url">un-petit-texte</A> Lien absolu : "http://www.iusta-tchad.org Lien relatif : par rapport au site interne Lien pour envoyer un mail : href="mailto:[email protected] Lien pour une ancre: <h2 id="mon_ancre">Titre</h2> <a href="#mon_ancre">Aller vers l'ancre</a> Les images : <img src= "url_image"> 08:30 20 Programmation statique : HTML Styles pour les textes Les tableaux <TABLE> : Indique le début du tableau (finissant par </TABLE>) <TR> : indique une nouvelle ligne (Table Row) <TD> : Indique une nouvelle colonne (Table Data) la ligne d'en-tête se crée avec un <tr>, mais les cellules à l'intérieur sont cette fois des <th> et non pas des <td> 08:30 21 Programmation statique : HTML Styles pour les textes Exemple <table> <tr> <th>Nom</th> <th>Age</th> <th>Pays</th> </tr> <tr> <td>Carmen</td> <td>33 ans</td> <td>Espagne</td> </tr> <tr> <td>Michelle</td> <td>26 ans</td> <td>Etats-Unis</td> </tr> </table> 08:30 22 Programmation statique : HTML Styles pour les textes Les formulaires Servent aux saisies des données et leur traitement se fait au niveau de serveur Commande form est la balise de base <form> <p>Texte à l'intérieur du formulaire</p> </form> 08:30 23 Programmation statique : HTML Styles pour les textes Les formulaires Pour cela deux attributs sont à indiqués dans la balise <form> Method : deux moyen envoyer les données Method : GET: peu adaptée (255 caractère), info envoyés dans l’adresse (http://…) Methode POST: Action : c’est l’adresse de la page ou programme qui traite les informations 08:30 24 Programmation statique : HTML Styles pour les textes Les formulaires Deux problèmes se posent : Comment envoyer les textes saisis par le visiteur ? Une fois que les données ont été envoyées, comment les traiter Pour cela deux attributs sont à indiqués dans la balise <from> Method : pour indiquer le moyen d’envoi Action : pour dire comment les traiter 08:30 25 Programmation statique : HTML Styles pour les textes Les formulaires method: deux moyens pour envoyer les données GET : méthode peu adaptée (limitée à 255 caractères), info envoyées par http:// : pour indiquer le moyen d’envoi POST : méthode la plus utilisée pour les formulaires action: adresse de la page qui doit traiter les informations envoyées (limite du HTML et CSS) 08:30 26 Programmation statique : HTML Styles pour les textes Les formulaires Exemple : <form method="post" action="traitement.php"> <p>Texte à l'intérieur du formulaire</p> </form> Ici on ne traite pas encore le php 08:30 27 Programmation statique : HTML Les formulaires Les zones de textes : deux types une ligne et multilignes Zone de texte une ligne: Exemple : <form action="cible.php" method="post"> <p> <input type="text" name="prenom" /> <input type="submit" value="Valider" /> </p> </form> 08:30 28 Programmation statique : HTML Les formulaires Zone de texte multilignes Exemple : <form method="post" action="traitement.php"> <p> <label for="amliorer" > commentaire ici</label><br> <textarea name="ameliorer" id ="ameloirer" rows="10" cols="50"> </textarea> </p> </form> 08:30 29 Programmation statique : HTML Les formulaires Les cases à cocher On utilise toujours <input/> avec la valeur de type=chexbox <input type= "checkbox" name = "choix" /> Exemple : <form method="post" action="traitement.php"> <p> Cochez les aliments que vous manger <input type="checkbox" name="frites" id="frites" /> <label for="frites">Frites</label><br /> <input type="checkbox" name="steak" id="steak" /> <label for=« steak">Steak haché</label><br /> <input type="checkbox" name="epinard" id="epinard" /> <label for="epinard">Epinard</label><br /> <p> </form> 08:30 30 Programmation statique : HTML Les formulaires Les zones à options On utilise toujours <input/> avec la valeur de type=radio Les zones d’option fonctionne par groupe (meme nom) Exemple : <form method="post" action="traitement.php"> <p> Veuillez indiquer la tranche d'âge dans laquelle vous vous situez :<br /> <input type="radio" name="age" value="moins15" id="moins15" /> <label for="moins15">Moins de 15 ans</label><br /><p> <input type="radio" name="age" value="medium15-25" id="medium15-25" /> <label for="medium15- 25">15-25 ans</label><br /> <p> </form> 08:30 31 Programmation statique : HTML Les formulaires Les listes déroulantes On utilise la balise <select> et </select> qui indique le debut et la fin de la liste déroulante On ajoute l’attribut name pour donner un nom à la liste A l’intérieur de la balise <select></select> on mettra plusieurs <options></option> (une par choix possible). On rajoute un attribut value pour pouvoir identifier ce que le visiteur à choisi 08:30 32 Programmation statique : HTML Les formulaires Les listes déroulantes : exemple: <form method="post" action="traitement.php"> <p> <label for="pays">Dans quel pays habitez-vous ? </label><br /> <select name="pays" id="pays"> <option value="france">France</option> <option value="espagne">Espagne</option> <option value="italie">Italie</option> <option value="royaume-uni">Royaume-Uni</option> <option value="canada">Canada</option> <option value="etats-unis">Etats-Unis</option> <option value="chine">Chine</option> <option value="japon">Japon</option> </select> </p> </form> 08:30 33 Le CSS Qu’est ce que le CSS Cascading Style Sheets", = "Feuilles de style en cascade« Document au format texte comme le HTML C’est un document qui indique comment la page HTML doit être affiché Le CCS agit en arrière plan Par exemple : en utilisant les styles = affichage lien dans la couleur de son choix Où mettre les codes CSS 08:30 34 Le CSS Où mettre les codes CSS : En général dans un fichier à part avec l’extension .css Un fichier dans lequel on écrit l’apparence de notre site La couleur et taille de police La taille des titres La position des menus La couleur ou l’image de fond Etc. On peut écrire le code CSS dans 3 endroits différents: 1er méthode : dans un fichier a part (recommandée) 2ème méthode :Dans l’entête du fichier html 3ème méthode : dans les balises 08:30 35 Le CSS Liaison page HTML et le CSS : On doit ajouter dans le fichier html la ligne suivante entre les balise <head> </head> : <link rel="stylesheet" media="screen“ type="text/css" title="Essai_IUSTA" href="department_IIG.css" /> Ce qui permettra de "dire" au fichier XHTML quel fichier CSS il doit charger 08:30 36 Le CSS Liaison page HTML et le CSS : La balise <link> comporte plusieurs attributs qu’on peut changer deux Title : le non de la feuille de style css href : l’emplacement où se trouve la feuille Dans un CSS, on trouve 3 éléments: Nom de la balise : balise qu’on change l’apparence Propiété: effet de style : color, … valeur 08:30 37 Le CSS Exemple balise1 { propriete: valeur; propriete: valeur; } balise2 { propriete: valeur; } 08:30 38 Le CSS Exemple p { color: blue; font-size: 18px; } h1, h2 { color: red; } 08:30 39 Le CSS Utilisation des attributs class et id Pour appliquer un style sur une partie de paragraphe Fonctionne de la meme manière Class s’utilise fois sur la page Id une seule fois sur la meme page Dans le css on precede par un point (.) pr class Et par dieze (#) pour id 08:30 40 Le CSS Exemple Dans la page html <h1 class="nom"> </h1> <p class="partie"></p> <img class="propre" /> Et dans le CSS .nom { color: red; font-size: 18px; } 08:30 41 Le CSS Classification des balises : 2 catégories Block et inline (en bloc et en ligne) Block crée automatiquement un retour à la ligne Un bloc peu être imbriqué dans un autre bloc Inline se trouve obligatoirement à l’interieur d’une balise block Inline ne crée pas le retour à la ligne 08:30 42 Le CSS Exemple 08:30 43 Le CSS La taille d’un bloc s’exprime en pixel (px) ou (%) Hauteur : higth Largeur : width Par défaut la taille d’un bloc prend 100% de la largeur disponible Exemple p{ width: 250px; height: 100px; text-align: justify; } 08:30 p{ width: 50%; text-align: justify; /* Texte justifié pr voir largeur du bloc */ } 44 Le CSS La bordure d’un block On utilise 3 valeurs La largeur mettre (2px) : mots clés utilisés thin : bordure fine (navigateur choisi le nombre de pixel Meduim : bordure moyenne Thic : bordure épaisse La couleur : on utilise un nom ou une valeur Black ou (#FF000000) Type de bordure : simple ou pointillés ou trait None, solide (trait simple), double (double trait), … 08:30 45 Le CSS Exemple : p { width: 350px; } h2 { border-bottom: 2px solid black; } .haut_bas { border-top: 1px dashed red; border-bottom: 1px dashed red; } 08:30 46 Plan Rappel : Le web, serveurs web, Les protocoles de communication, Programmation web statique Programmation web dynamique Les bases du PHP Transmission des données via url et formulaires Gestion des informations dans une base de données Hebergement d’un site web 08:30 47 Programmation dynamique Coté Serveur 08:30 48 Programmation dynamique Difference page web statique et dynamique Langage de script: ASP, JSP, PHP, RoR, Javascript, etc. En Statique (HTML) En dynamique (PHP) 08:30 49 Programmation dynamique La création d’un site web dynamique nécessite l’utilisation d’un langage de script Un langage de script utilise une base de données et crée principalement des pages Web HTML dynamique mais aussi des animations Flash, etc. Le document HTML consulté n'est pas nécessairement identique à chaque consultation, sans que le webmestre n'ait eu à intervenir manuellement Plusieurs langages de script existent parmi lesquels : ASP, JSP, PHP, RoR, Javascript 08:30 50 Programmation dynamique Les ordinateurs clients ne peuvent pas interpréter les scripts coté serveur (codes php, ASP, …); ils ne peuvent qu’interpreter le HTML, le CSS et les scripts coté client (JavaScript) C’est donc au serveur de transformer le code PHP en HTML avant d’envoyer au client Un code PHP peut contenir aussi des codes HTML 08:30 51 Plan Rappel : Le web, serveurs web, Les protocoles de communication, Programmation web statique Programmation web dynamique Les bases du PHP Transmission des données via l’url et formulaires Gestion des informations dans une base de données Hebergement d’un site web 08:30 52 Le bases du PHP 08:30 53 Le PHP C’est un langage de script le plus actif sur le web Il permet d'utiliser une base de données pour construire un document HTML Le document construit n’est pas nécessairement identique à chaque consultation Exemple d’un code PHP <?php echo("Vous êtes le visiteur n°" , $nbre_visiteurs); ?> 08:30 54 Le PHP Syntaxe PHP (voir fichier cours base de langage PHP joint a ce cours) 08:30 55 Outils de développement Plusieurs EDI : Dreamweaver, NetBeans, PHPEclipse, PHPEdit, WebExpert, Zend Studio, … Solution tout en un : contient à la fois un serveur Apache, une base de données MySQL, un ensemble complet PHP, (Apache + php + Mysql + administration ) : 08:30 EasyPHP (Windows) XAMP (Windows) MAMP (Mac OS) WAMP (Windows) Zend Core (Linux) 56 Utilisation du PHP PHP peut être utilisé de diverses manières : 1. Pour une interface Web : c'est l'utilisation la plus courante ; 2. En ligne de commandes ("CLI" pour Command Line Interface) ; 3. Pour produire une interface desktop ("GUI" pour Graphical User Interface). 08:30 57 Plan Rappel : Le web, serveurs web, Les protocoles de communication, Programmation web statique Programmation web dynamique Les bases du PHP Transmission des données via url et formulaires Gestion des informations dans une base de données Hebergement d’un site web 08:30 58 Transmission des données via l’URL et les formulaires 08:30 59 Envoyer des parametres via URL L’URL (Uniform Resource Locator) permettait de transmettre des informations d’une page a une autre Les paramètres sont ajoutés à la fin de l'URL après le point d'interrogation ? et sont séparés par & 08:30 60 Recuperer les parametres La page qui reçoit les paramètres va automatiquement créer une variable de type array : $_GET On peut donc récupérer ces informations et les traiter 08:30 61 Exemple transmission des données via URL Exemple : Fichier index.php Fichier bonjour.php 08:30 62 Exemple transmission des données via URL Recommandations : 1. Pour éviter que le visiteur traque l’url, il faut contrôler cette url en testant la présence des paramètres avant l’execution du code La fonction : isset()teste si une variable existe. 08:30 63 Exemple transmission des données via URL Recommandations : 2. L’éxecution des boucles doivent également être controlées 08:30 64 Les formulaires Les formulaires servent aux saisies des données et leur traitement se fait au niveau de serveur Commande form est la balise de base <form method="post" action="cible.php"> <p> On insèrera ici les éléments de notre formulaire. </p> </form> Method : pour indiquer le moyen d’envoi Action : pour dire comment les traiter 08:30 65 Les formulaires Deux attributs sont à indiqués dans la balise <form> Method : 2 moyens pour envoyer les données Method : GET: peu adaptée (255 caractères), info envoyés dans l’adresse (http://…) Methode POST: Action : c’est l’adresse de la page ou programme qui traite les informations envoyées 08:30 66 Les formulaires Exemple : <form method="post" action="traitement.php"> <p>Texte à l'intérieur du formulaire</p> </form> 08:30 67 Les formulaires de zones de textes Les zones de textes : deux types se distinguent une ligne et multilignes Zone de texte une ligne: Exemple : <form action="cible.php" method="post"> <p> <input type="text" name="prenom" /> <input type="submit" value="Valider" /> </p> </form> 08:30 68 Les formulaires de zones de textes Zone de texte multilignes Exemple : <form method="post" action="traitement.php"> <p> <label for="amliorer" > commentaire ici</label><br> <textarea name="ameliorer" id ="ameloirer" rows="10" cols="50"> </textarea> </p> </form> 08:30 69 Les formulaires de zones de textes Les cases à cocher On utilise toujours <input/> avec la valeur de type=chexbox <input type= "checkbox" name = "choix" /> Exemple : <form method="post" action="traitement.php"> <p> Cochez les aliments que vous manger <input type="checkbox" name="frites" id="frites" /> <label for="frites">Frites</label><br /> <input type="checkbox" name="steak" id="steak" /> <label for=« steak">Steak haché</label><br /> <input type="checkbox" name="epinard" id="epinard" /> <label for="epinard">Epinard</label><br /> <p> </form> 08:30 70 Les formulaires de zones de textes Les zones à options On utilise toujours <input/> avec la valeur de type=radio Les zones d’option fonctionne par groupe (meme nom) <form method="post" action="traitement.php"> <p> Veuillez indiquer la tranche d'âge dans laquelle vous vous situez :<br /> <input type="radio" name="age" value="moins15" id="moins15" /> <label for="moins15">Moins de 15 ans</label><br /><p> <input type="radio" name="age" value="medium15-25" id="medium15-25" /> <label for="medium15- 25">15-25 ans</label><br /> <p> </form> 08:30 71 Les formulaires de zones de textes Les listes déroulantes On utilise la balise <select> et </select> qui indique le debut et la fin de la liste déroulante On ajoute l’attribut name pour donner un nom à la liste A l’intérieur de la balise <select></select> on mettra plusieurs <options></option> (une par choix possible). On rajoute un attribut value pour pouvoir identifier ce que le visiteur à choisi 08:30 72 Les formulaires de zones de textes Les listes déroulantes : exemple: <form method="post" action="traitement.php"> <p> <label for="pays">Dans quel pays habitez-vous ? </label><br /> <select name="pays" id="pays"> <option value="france">France</option> <option value="espagne">Espagne</option> <option value="italie">Italie</option> <option value="royaume-uni">Royaume-Uni</option> <option value="canada">Canada</option> <option value="etats-unis">Etats-Unis</option> <option value="chine">Chine</option> <option value="japon">Japon</option> </select> </p> </form> 08:30 73 Exemple formulaire.php : contient un simple formulaire. secret.php : contient les "codes secrets" mais ne les affiche que si on lui donne le mot de passe 08:30 74 code de la page formulaire.php <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr"> <head> <title>Page protégée par mot de passe</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> </head> <body> <p>Veuillez entrer votre mot de passe pour obtenir les codes d'accès</p> <form action="secret.php" method="post"> <p> <input type="password" name="mot_de_passe" /> <input type="submit" value="Valider" /> </p> </form> <p>Cette page est réservée au personnel du service de maintenance et de l’administrateur système. Si vous ne faites pas partie de cette équipe vous n’avez plus accès. N’insistez pas ! 08:30 Merci, inutile d'insister vous ne trouverez jamais le mot de passe ! ;-)</p> </body> </html> 75 code de la page secret.php <!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="fr" lang="fr"> <head> <title>Codes d'accès au serveur central de l’IUSTA</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> </head> <body> <?php if (isset($_POST['mot_de_passe']) AND $_POST['mot_de_passe'] =="azerty") // Si le mot de passe est bon { // On affiche les codes ?> <h1>Voici les codes d'accès :</h1> <p><strong>CRD5-GTFT-CK65-JOPM-V29N-24G1-HH28-LLFV</strong></p> <p> Les codes d'accès sont changés toutes les semaines.<br /> Merci de votre visite. </p> <?php } else // Sinon, on affiche un message d'erreur { echo '<p>Mot de passe incorrect</p>'; 08:30 } 76 ?> </body> </html> Plan Rappel : Le web, serveurs web, Les protocoles de communication, Programmation web statique Programmation web dynamique Les bases du PHP Transmission des données via url et formulaires Gestion des informations dans une base de données Hebergement d’un site web 08:30 77 Gestion des informations dans une base de données 08:30 78 Gestion des informations dans une base de données 1. Les SGBD les plus utilisés 2. Comment Lire des données a partir de la Base De Données 3. Comment écrire des données dans la Base De Données 4. Exprimer des requêtes SQL 08:30 79 Les SGBD les plus utilisés : MySQL : libre et gratuit, c'est probablement le SGBD le plus connu. PostgreSQL : libre et gratuit comme MySQL, avec plus de fonctionnalités mais un peu moins connu. SQLite: libre et gratuit, très léger mais très limité en fonctionnalités. Oracle : utilisé par les très grosses entreprises, sans aucun doute un des SGBD les plus complets mais il n'est pas libre et on le paie le plus souvent très cher. Microsoft SQL Server : le SGBD de Microsoft … 08:30 80 MySQL La jonction entre l’utilisateur et la base de données (MySQL) est faite par PHP 1. Le serveur grâce au PHP fait passer le message 2. PHP effectue les actions demandées et communique avec la base de données MySQL. 3. La base est consultée ; 4. La réponse est renvoyée au serveur par PHP 08:30 81 MySQL Il existe plusieurs façons d'accéder à la base de données et d'y faire des modifications On peut utiliser une ligne de commande (console), exécuter les requêtes en PHP ou faire appel à un programme qui permet d'avoir rapidement une vue d'ensemble : phpMyAdmin (livré avec WAMP), un des outils les plus connus permettant de manipuler une base de données MySQL. 08:30 82 Création d’une table 1. 2. 08:30 Liste des bases : c'est la liste de bases de données. Le nombre entre parenthèses est le nombre de tables qu'il y a dans la base. Pour créer une base de données 83 Création d’une table La création des tables dans la base de données consiste à définir quelques propriétés des champs par exemple : 08:30 id : premier champ : Le numéro d'identification. Titre : deuxième champ contenu :troisième champ etc. 84 Les requêtes Pour exprimer les requêtes on utilise l’outil SQL Il y a la possibilité d’Importer, d’Exporter, des données, faire des Opérations, … 08:30 85 Comment lire les données ? Pour lire une donnée, on procède en deux étapes: 1. La première est d’abord se connecter à la base 2. La deuxième est la récupération des données 08:30 86 Se connecter à la base PHP propose plusieurs moyens de se connecter à une base de données MySQL : L'extension mysql_ : ce sont des fonctions qui permettent d'accéder à une base de données MySQL. Leur nom commence toujours par mysql_. Des fonctions qui ne sont pas recommandées L'extension mysqli_ : ce sont des fonctions améliorées d'accès à MySQL. Elles proposent plus de fonctionnalités et sont plus à jour L'extension PDO : c'est un outil complet qui permet d'accéder à n'importe quel type de base de données. On peut donc l'utiliser pour se connecter aussi bien à MySQL que PostgreSQL ou Oracle 08:30 87 Se connecter à la base PHP propose les fonctions : Mysql_ Mysqli_ PDO 08:30 88 Se connecter à la base Normalement, PDO est activé par défaut Pour le vérifier, un clic gauche sur l'icône de WAMP dans la barre des tâches, puis allez dans le menu PHP / Extensions PHP et vérifiez que php_pdo_mysql est bien coché 08:30 89 Se connecter à la base Il faut ensuite ouvrir le fichier de configuration de PHP (qui s'appelle généralement php.ini) et rechercher la ligne qui contient php_pdo_mysql. Enlevez le point-virgule devant s'il y en a un pour activer l'extension : 08:30 90 Se connecter à la base Une fois que PDO est activé, pour se connecter à MySQL, il faut avoir renseigné 4 informations : Le nom de l'hôte : c'est l'adresse de l'ordinateur où MySQL est installé (l’adresse IP). Si même ordinateur que PHP (localhost). Il est possible que votre hébergeur web vous indique une autre valeur à renseigner (par exemple sql.hebergeur.com) La base : c'est le nom de la base de données à laquelle on désire se connecter. Le login : permet l’identification. Le plus souvent (chez un hébergeur gratuit) c'est le même login qu’on utilise pour FTP Le mot de passe : il y a des chances pour que le mot de passe soit le même que celui que vous utilisez pour accéder au FTP, à renseignez-vous auprès de l’hébergeur Remarque Par défaut le login est root et le mot de passe est vide 08:30 91 Se connecter à la base Par exemple la syntaxe pour se connecter à la base de données peut se présenter comme suit : <?php $bdd = new PDO('mysql:host=localhost;dbname=test', 'root', ‘ '); ?> On a créé un objet (bdd) représentant la connexion à la base de données. En indiquant dans l'ordre dans les paramètres : 08:30 Le La Le Le nom d'hôte (localhost) base de données (test) login (root) mot de passe (pas de mot de passe, la chaîne est vide) 92 Se connecter à la base D’une manière générale, on spécifie un login et un mot de passe <?php $bdd = new PDO('mysql:host=sql.hebergeur.com;dbname=mabase', 'ali.ahmat', 'tr3c3t'); ?> 08:30 93 Se connecter à la base Pour éviter que le php affiche le mot de passe en cas d’erreur dans le code, il est préférable de traiter les erreurs <?php try { $pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION; $bdd = new PDO('mysql:host=localhost;dbname=test', 'root', ‘ ', $pdo_options); } catch (Exception $e) { die('Erreur : ' . $e->getMessage()); }?> En cas d'erreur, PDO renvoie ce qu'on appelle une exception qui permet de "capturer" l'erreur. 08:30 94 Récupération des données Pour récupérer les données, une fois la connexion est établie, on exprime une requête SQL <?php $reponse = $bdd ->query('Tapez votre requête SQL ici'); ?> Pour récupérer des informations de la base de données, nous avons besoin de l’objet (bdd) qui représente la connexion à la base 08:30 95 Récupération des données Exemple : Soit la table (jeux_video) suivante appartenant à une base de données. <?php $reponse = $bdd ->query('SELECT * FROM jeux_video'); ?> $reponse contient maintenant la réponse de MySQL 08:30 96 Récupération des données Pour récupérer une entrée, on prend la réponse de MySQL et on y exécute fetch(), ce qui nous renvoie la première ligne <?php $donnees = $reponse->fetch(); ?> $donnees est un array qui contient champ par champ les valeurs de la première entrée. Par exemple, si on s’intéresse au champ console, on utilisera l'array $donnees['console']. Il faudra faire une boucle pour parcourir chaque entrée une à une. A chaque fois qu’on appelle $reponse->fetch(), on passe à l'entrée suivante. La boucle est donc répétée autant de fois qu'il n'y a d'entrées dans la table 08:30 97 <?php Try { // On se connecte à MySQL $pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION; $bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options); // On récupère tout le contenu de la table jeux_video $reponse = $bdd ->query('SELECT * FROM jeux_video'); // On affiche chaque entrée une à une while ($donnees = $reponse->fetch()) { ?> <p> <strong>Jeu</strong> : <?php echo $donnees['nom']; ?><br /> Le possesseur de ce jeu est : <?php echo $donnees['possesseur']; ?>, et il le vend à <?php echo $donnees['prix']; ?> euros !<br /> Ce jeu fonctionne sur <?php echo $donnees['console']; ?> et on peut y jouer à <?php echo $donnees['nbre_joueurs_max']; ?> au maximum<br /> <?php echo $donnees['possesseur']; ?> a laissé ses commentaires sur <?php echo $donnees['nom']; ?> : <em><?php echo $donnees['commentaires']; ?></em> </p> <?php } $reponse->closeCursor(); // Termine le traitement de la requête } catch(Exception $e) { } ?> die('Erreur : '.$e->getMessage()); // En cas d'erreur précédemment, on affiche un message et on arrête tout 08:30 98 Récupération des données Pour afficher seulement le contenu de quelques champs (nom) : la requête SQL est la suivante : <?php Try { $pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION; $bdd = new PDO('mysql:host=localhost;dbname=test', 'root', '', $pdo_options); $reponse = $bdd ->query('SELECT nom FROM jeux_video'); while ($donnees = $reponse->fetch()) { echo $donnees['nom'] . '<br />'; } $reponse->closeCursor(); } catch(Exception $e) { die('Erreur : '.$e->getMessage()); }?> 08:30 99 Les critères de sélection : Les critères de sélection utilisés peuvent etre : WHERE ORDER BY LIMIT La requête INSERT INTO permet d'ajouter une entrée La requête UPDATE permet de modifier une entrée. DELETE : supprimer des données Exemple voir fichier cours 08:30 100 Construire des requêtes en fonction de variables Les requêtes peuvent être construites en fonction de variables en utilisant _GET[‘variable'] Exemple : $_GET['possesseur'] On utilise des marqueurs "? La requête est exécutée en appelant execute et en lui transmettant la liste des paramètres sous forme array 08:30 101 Construire des requêtes en fonction de variables S'il y a plusieurs marqueurs, il faut indiquer les paramètres dans le bon ordre : Le premier point d'interrogation de la requête sera remplacé par le contenu de la variable $_GET['possesseur'] Le second point d'interrogation sera remplacé par le contenu de $_GET['prix_max'] 08:30 102 Exemple : Lister les jeux appartenant à une personne et dont le prix ne dépasse pas une certaine somme : 08:30 103 Écrire les données dans la BDD Comment on peut ajouter et modifier des données dans la base : Quelques requêtes SQL fondamentales : INSERT UPDATE DELETE 08:30 104 Insérer une donnée dans la base de données Pour ajouter une entrée, on utilise l’instruction INSERT INTO : Remarque : Le premier champ (ID) est laissé vide car la propriété est déclarée "auto_increment" Le champ ID est automatique, il est donc inutile de le lister 08:30 105 Insérer une donnée dans la base de données Le code PHP correspondant à l’ajout 08:30 106 Insertion de données variables grâce à une requête préparée on utilise des marqueurs nominatifs pour créer l'array sur plusieurs lignes 08:30 107 Modification des données dans la BDD On utilise l‘instruction UPDATE pour modifier les données dans la base de données Exemple 1: on modifie le prix=10 pour ID=51 Exemple 2: on modifie le prix=10 pour nom=Battlefield 1942 08:30 108 Modification des données dans la BDD Le code PHP correspondant en PHP on fait appel à exec() pour effectuer des modifications : 08:30 109 Modification avec une requête préparée Le code PHP correspondant 08:30 110 DELETE : supprimer des données L’Instruction DELETE est utilisée pour supprimer une entrée de la table Exemple WHERE : indispensable pour indiquer quelle(s) entrée(s) doivent être supprimée(s). Si on oublie WHERE, toutes les entrées seront supprimées, Cela équivaut à vider la table 08:30 111 Hébergement d’un site web 08:30 112 MySQL Se connecter à MYSQL avec PDO Le nom de l’hote La base Le login Et le mot de passe 08:30 113 Merci de votre Attention 08:30 114
