INF04-06 Langages et structure du Web. Benoît Habert

Transcription

1 INF04-06 Langages et structure du Web Benoît Habert

2 Séance 8 - début Rappels Les limites de l appel à un autre script AJAX Modèle/Vue/Contrôleur : un patron de conception MVC en action : revisiter l exemple du chat B. Habert 2013 Langages du Web 6 2

3 Rappels INF04 03 : disposer des informations complémentaires pour des «souvenirs infra-ordinaires» jms2.php : lien qui appelle un autre script en lui fournissant le numéro du souvenir et retour après validation vers jms2.php Principes d AJAX et détail du fonctionnement Exemple de l horloge (2 versions) Version AJAX de jms B. Habert 2013 Langages du Web 6 3

4 MVC Modèle/Vue/Contrôleur Issu de travaux de Trygve Reenskaug en ( MVC_Originals.pdf ) Patron de conception d applications interactives reposant sur une séparation des fonctions Permet de remplacer un composant B. Habert 2013 Langages du Web 6 4

5 MVC Fonctions Modèle (de données) et opération de gestion de ces données (accès, modification) Vue (présentation des données fournies par le modèle, reçoit les actions de l utilisateur et les envoie au contrôleur) Contrôleur (contrôle d ensemble, gestion des événements, synchronisation de la vue et du modèle) B. Habert 2013 Langages du Web 6 5

6 L application est organisée en 2 plans Création de compte / connexion [racine] Chat à proprement parler [répertoire chat] Chaque plan est structuré selon le patron de conception MVC index.php (implicitement appelé) : contrôleur Le répertoire (modele ou vue) comprend ce qui est nécessaire pour la fonction en question B. Habert 2013 Langages du Web 6 6

7 Sous-jacents : BD et son interface Créer une BD MySQL Créer les tables nécessaires (exécution des instructions MySQL creation-base.sql) utilisateur : idutilisateur [autoincrémenté], login, mdp message : idmessage [autoincrémenté], iduserexpediteur [pour jointure avec login:idutilisateur, contenu [caractères, 500] B. Habert 2013 Langages du Web 6 7

8 dao : répertoire pour l interface avec la BD config.php : paramétrage d ensemble (hôte, utilisateur, mdp, base) connexion.php (utilisé par le modèle) charge d abord config.php : require( config.php ) ; Fonctions d interface avec la BD Établissement de la connexion Requête sans attendre de résultat Requête où le résultat est un tableau de tableaux Requête où le résultat est un tableau de tableaux associatifs (accès aux colonnes par leur nom) B. Habert 2013 Langages du Web 6 8

9 B. Habert 2013 Langages du Web 6 9

10 Une fois l accès à la BD configuré, seules les fonctions de requêtes sont utilisées Elles se chargent de Utiliser le fichier de configuration pour établir une connexion, Envoyer une requête (argument) Récupérer le résultat (ou la valeur booléenne false si la requête a échoué) Fermer la connexion B. Habert 2013 Langages du Web 6 10

11 Lecture d une API : connexion.php Dépendance entre fichiers (cf. config.php) Commentaires globaux /** * Ensemble de fonctions façade permettant de masquer la connexion à la BD pour le modèle (aux requêtes SQL près) */ B. Habert 2013 Langages du Web 6 11

12 Commentaire et «contrat» sur ce qui rentre et ce qui sort //Traitement des requêtes select : la réponse est renvoyée sous forme de tableau d'objets //Renvoie false si aucun enregistrement retourné function sendresourcequerytoarray($sql) { } B. Habert 2013 Langages du Web 6 12

13 Modèle (application) user.php Création d un nouvel utilisateur function createuser($login, $pass) Authentification d un utilisateur function authenticateuser($login, $pass) utils/protect.php : enlève les éléments de requête «dangereux» function clean_entry($entry) B. Habert 2013 Langages du Web 6 13

14 B. Habert 2013 Langages du Web 6 14

15 Vue Chat en MVC accueil.php : formulaire de connexion Transmission cachée : action = connexion Vérification CheckLoginPassword lien vers le formulaire (creationcompte.php) de création de compte creationcompte.php : formulaire de création de compte Transmission cachée : action = creation Vérification : CheckMdp B. Habert 2013 Langages du Web 6 15

16 vue/js/validation.js : fonctions auxiliaires de vérification CheckLoginPassword : accueil.php formulaire connexion CheckPdp : formulaire creationcompte.php succeserreur.php Affiche dans une division le message de retour des vérifications à la création/ connexion $_REQUEST[ succes ] ou $_REQUEST[ erreur ] B. Habert 2013 Langages du Web 6 16

17 B. Habert 2013 Langages du Web 6 17

18 En PHP $_SESSION est un tableau associatif mémorisant les informations de session $_REQUEST est un tableau associatif qui contient par défaut le contenu des variables $_GET ou $_POST Le moyen d accéder à l environnement transmis par un formulaire, ie un ensemble de couples variable/valeur B. Habert 2013 Langages du Web 6 18

19 3 questionnements sur $_REQUEST Une variable a-t-elle une valeur? Ex :!isset($_request['action']) Quelle est la valeur d une variable? Ex : $_REQUEST['succes'] Une variable donnée a-t-elle ou non telle valeur? Ex : $_REQUEST['action'] == 'connexion' B. Habert 2013 Langages du Web 6 19

20 Contrôleur principal : index.php (racine) Si pas de valeur attachée à action ou action == deconnexion (retour de chat) : accueil.php (choix connexion/creation de compte) Si action == creation (après appel de creationcompte.php) Si pseudo, mdp1, mdp2 sont fournis et que mdp1 == mdp2 «nettoyage» (modele/utils/protect.php) login et mdp1 Essai de créer l utilisateur (modele/user.php) Sinon retour à creationcompte.php B. Habert 2013 Langages du Web 6 20

21 Si action == connexion Si login et mdp fournis «nettoyage» login et mpd (modele/utils/protect.php) Essai d authentification (modele/user.php) Si authentification, redirection vers chat/index.php Sinon accueil.php B. Habert 2013 Langages du Web 6 21

22 Chat de chat en MVC Modèle chat.php : gestion des messages (et donc appel à../dao/connexion.php) Récupération du numéro du dernier message entré (ou 0 si pas de message) Ajout d un message Récupération, sous la forme d un tableau Soit de tous les messages Soit de tous les messages à partir d un numéro donné B. Habert 2013 Langages du Web 6 22

23 Chat de chat en MVC B. Habert 2013 Langages du Web 6 23

24 Chat de chat en MVC Vue : 2 répertoires selon la vue que l on veut mettre en place ajax (à faire) html (détaillé) frames.php : divise l écran en haut l appel à index.php de chat avec action = show En bas, formulaire.html de saisie du message (transmission cachée de action = add) et lien de déconnexion (appel à index.php avec action = deconnexion messages.php : toutes les 5 s, affiche numéro et texte des messages de $_REQUEST[ messages ] B. Habert 2013 Langages du Web 6 24

25 Chat de chat en MVC B. Habert 2013 Langages du Web 6 25

26 Chat de chat en MVC Contrôleur du chat à proprement parler S il n y a pas d utilisateur logé, retour au contrôleur de l application S il n y a pas d action spécifiée, chargement de vue/html/frames.php (interface du chat) Chargement des fonctions de gestion des messages (modele/chat.php) B. Habert 2013 Langages du Web 6 26

27 Chat de chat en MVC Contrôleur du chat à proprement parler (suite) Si l action est add (transmission cachée de action = add par formulaire.html) «nettoyage» du message Ajout du message Si l action est show (transmission par la partie du haut de frames.php) S il y a de nouveaux messages, afficher les messages via vue/html/messages.php B. Habert 2013 Langages du Web 6 27

28 Chat de chat en MVC Contrôleur du chat à proprement parler (suite) Si l action est deconnexion (lien dans formulaire.html) Transmission de la déconnexion au contrôleur principal B. Habert 2013 Langages du Web 6 28

29 B. Habert 2013 Langages du Web 6 29

30 B. Habert 2013 Langages du Web 6 30

31 Il y a pire B. Habert 2013 Langages du Web 6 31