PHP/MYSQL. Web Dynamique

Transcription

1 PHP/MYSQL Web Dynamique ENSG Juin 2008

2 Qui suis-je? Guillaume Gautreau Responsable projets Systèmes d information à l ENPC guillaume@ghusse.com

3 Ces 6 jours de formation Jour 1 : présentations, attentes, principes, HTML Jour 2 : CSS, PHP, traitement des formulaires Jour 3 : connexion à la base de données, sessions, cookies Jour 4 : Rappel PHP, Extraction de données, affichage Jour 5 : Requêtes, Insertion de données Jour 6 : Sécurité, questions, retours sur la formation.

4 Qui êtes-vous? Présentez vous! Dans quel but vous êtes-vous inscrit à cette formation? Qu attendez-vous de cette formation? Connaissez-vous des mots parmi ceux-ci : HTML, XHTML, CSS, Javascript, Programmation, Orienté objet, PHP, SQL, Serveur, client, navigateur web, base de données, AJAX

5 QU EST-CE QUE LE WEB DYNAMIQUE? Tempête de cerveau!

6 Web : support de l information Informations accessibles par le réseau, en utilisant le protocole HTTP Données au format HTML ou XHTML Texte mis en forme

7 Dynamisme : prise en compte de l utilisateur Réponse aux actions de l utilisateur Enregistrement des données reçues Envoi d informations tirées des données enregistrées Adaptation des données envoyées aux demandes de l utilisateur

8 Objectifs de ce cours Concevoir une application web Utiliser des formulaires pour récupérer des données de l utilisateur Récupérer des données côté serveur Gérer l identification des utilisateurs Comprendre les implications des choix techniques en termes de sécurité

9 Thèmes de ce cours Web Réseau Informations Mise en forme Dynamisme Enregistrement de donnés Requêtes sur des données enregistrées Adaptation du contenu aux demandes de l'utilisateur

10 Thèmes de ce cours Web Réseau Informations Mise en forme PHP Dynamisme Enregistrement de donnés Requêtes sur des données enregistrées Adaptation du contenu aux demandes de l'utilisateur

11 Thèmes de ce cours Web Réseau Informations Mise en forme PHP MySQL Dynamisme Enregistrement de donnés Requêtes sur des données enregistrées Adaptation du contenu aux demandes de l'utilisateur

12 Thèmes de ce cours Web Dynamisme Réseau Enregistrement de Informations Mise en forme donnés Requêtes sur des données enregistrées PHP MySQL (X)HTML Adaptation du contenu aux demandes de l'utilisateur

13 Thèmes de ce cours Web Dynamisme Réseau Enregistrement de Informations Mise en forme donnés Requêtes sur des données enregistrées PHP MySQL (X)HTML CSS Adaptation du contenu aux demandes de l'utilisateur

14 Thèmes de ce cours Web Dynamisme Réseau Enregistrement de Informations Mise en forme donnés Requêtes sur des données enregistrées PHP MySQL (X)HTML CSS Théorie Adaptation du contenu aux demandes de l'utilisateur

15 Thèmes de ce cours Web Dynamisme Réseau Enregistrement de Informations Mise en forme donnés Requêtes sur des données enregistrées PHP MySQL (X)HTML CSS Théorie Adaptation du contenu aux demandes de l'utilisateur

16 APPLICATIONS WEB Vue générale

17 Fonctionnement général Client

18 Fonctionnement général Quoi de neuf à l ENSG? Client

19 Fonctionnement général Requête HTTP Client

20 Fonctionnement général Requête HTTP Client Serveur

21 Fonctionnement général Client Serveur Interprétation de la requête Récupération des données

22 Fonctionnement général Requête SQL Client Serveur Interprétation de la requête Récupération des données

23 Fonctionnement général Requête SQL Client Serveur Interprétation de la requête Récupération des données Base de données

24 Fonctionnement général Client Serveur Interprétation de la requête Récupération des données Base de données Récupération des données

25 Fonctionnement général Client Serveur Interprétation de la requête Récupération des données Base de données Récupération des données

26 Fonctionnement général Client Serveur Interprétation de la requête Récupération des données Interprétation des données Base de données Récupération des données

27 Fonctionnement général Client Serveur Interprétation de la requête Récupération des données Interprétation des données Création d une page HTML Base de données Récupération des données

28 Fonctionnement général Client Serveur Interprétation de la requête Récupération des données Interprétation des données Création d une page HTML Envoi Base de données Récupération des données

29 Fonctionnement général Client Réponse HTTP Serveur Interprétation de la requête Récupération des données Interprétation des données Création d une page HTML Envoi Base de données Récupération des données

30 Fonctionnement général Client Interprétation du HTML Affichage Serveur Interprétation de la requête Récupération des données Interprétation des données Création d une page HTML Envoi Base de données Récupération des données

31 Client : interface avec l utilisateur Contacte les serveurs HTTP Affiche les résultats Exécute le code javascript Capture les actions de l utilisateur

32 Serveur : traitement Reçoit les demandes des clients Interroge la base de données Construit un document HTML Envoie les données au client

33 Base de données : persistance des données Sauvegarde toutes les données persistantes de l application Extrait des données selon les requêtes SQL reçues

34 TECHNOLOGIES Aperçu des solutions pour chaque élément de l application

35 Navigateurs web Nous utiliserons au moins deux navigateurs : Internet Explorer Firefox Source : Xiti décembre 2007

36 Technologies de serveur web Nous utiliserons apache : libre fiable solution la plus répandue Source : netcraft mai 2008

37 Serveurs d application Langages très différents Certaines technologies peuvent être portées par différents serveurs web Nous utiliserons PHP PHP.NET Java Zope

38 HISTOIRE DU WEB de HTTP 0.9 à AJAX

39 1989 : création du web Tim Berners-Lee invente les adresses web, le protocole HTTP et le HTML Système hypertexte : basé sur des liens entre documents, organisé en toile Premier serveur web et première page web sur le serveur nxoc01.cern.ch en 1990

40 Le web grandit Nombre de sites web répertoriés dans le monde juin 93 fin 93 juin 94 fin 94 juin 95 fin 95

41 1995 : la guerre des navigateurs Netscape Navigator 1.0 (payant) sort en 1994 Microsoft lance Internet Explorer 1.0 puis 2.0 intégrée d office à Windows NT 4 Le moteur de recherche AltaVista est créé Netscape 2.0 puis 3.0, MSIE 3.0 et Opera 2.1 sortent en 1996

42 : la guerre fait rage Les navigateurs proposent des améliorations de leur côté Les sites web sont optimisés pour certains navigateurs et ne fonctionnent pas correctement avec d autres Tentatives de normalisation du HTML pour améliorer la compatibilité Netscape perd la guerre des navigateurs et le projet Mozilla naît

43 : normalisation Normes importantes pour le web : XML, CSS, et DOM en 1998 HTML 4.01 (dernière version du HTML) Création du XHTML Montée en puissance du Web 1.0

44 2004 : Web 2.0 Mozilla Firefox relance la concurrence des navigateurs Le concept de Web 2.0 apparaît : Contenu généré par l utilisateur Applications internet riches (utilisation massive de Javascript et de requêtes HTTP via JS) RSS pour obtenir les mises à jour des sites web

45 PROTOCOLE HTTP Base du web

46 Pour les curieux Observer un échange HTTP avec une extension à Firefox (comme Tamper Data) Contacter directement un serveur en mode texte : telnet monserveur 80 GET /

47 Principes Protocole en mode texte Sur le port 80 (en général) Commandes de base : GET, POST, PUT, HEAD, DELETE Envoi possible de métadonnées dans les en-têtes de connexion

48 Particularités Les échanges HTTP ne sont pas gérés directement par le concepteur d un site (sauf exceptions) HTTP : assimilable à un protocole de transfert de fichiers Peut être utilisé pour réaliser l authentification des utilisateurs, selon deux méthodes Protocole non sécurisé

49 Protocole non connecté Chaque requête est indépendante de la précédente Chaque interaction suit le même principe : une demande / une réponse (aussitôt oubliée par le serveur)

50 Comment fait-on pour concevoir des sites web qui nécessitent une authentification et qui conservent l information d identification de l utilisateur?

51 MODE CONNECTÉ sur un protocole sans connexion

52 Mécanisme de session Client Serveur

53 Mécanisme de session GET Client Serveur

54 Mécanisme de session Demande d authentification Client Serveur

55 Mécanisme de session Bond, James Bond Client Serveur

56 Mécanisme de session JB id: Client Serveur

57 Mécanisme de session JB id: Client Dossiers classifiés Serveur id:

58 Mécanisme de session JB id: Client Dossiers classifiés Serveur id: ) Partage d un identifiant 2) Enregistrement de données sur le serveur

59 Utilisation des sessions id: Client Serveur

60 Utilisation des sessions id: JB id: Client Serveur

61 Utilisation des sessions GET JB id: Client Serveur id:

62 Utilisation des sessions Récupération des données selon l identifiant JB id: Client Serveur id:

63 Utilisation des sessions C est James! JB id: Client Serveur id:

64 Utilisation des sessions C est James! JB id: Dossiers classifiés Client Serveur id:

65 Cookie : support de l identifiant L identifiant partagé entre le serveur et le client est porté par un cookie. C est un fichier qui peut contenir des informations choisies par le serveur. Il peut contenir plus d informations qu un simple identifiant

66 Côté serveur Les données associées aux identifiants sont stockées sous forme de fichiers Apache les sauvegarde dans le dossier sessions souvent à la racine du site web

67 Informations souvent transmises dans les cookies Identifiant de session (gérés par PHP) Préférences d affichage Pages visitées sur le site (cookies traceurs)

68 Pour les curieux Vous pouvez voir le contenu des cookies dans les préférences de vie privée de Firefox.

69 ÉCHANGES SÉCURISÉS sur un protocole non sécurisé

70 Services non gérés par HTTP Identification du serveur distant Est-ce bien le site de ma banque? Chiffrement des échanges Est-il possible de connaître mon numéro de carte bleue en sniffant le réseau?

71 HTTP sur SSL SSL (secured socket layer) permet de résoudre ces problèmes Chiffrement à clé publique Protocole HTTPS Seul moyen de garantir la confidentialité des données Seul moyen d identifier un serveur

72 INSTALLATION ET PRÉSENTATION Logiciels que nous allons utiliser

73 Systèmes 4 en 1 Serveur Apache XAMPP EasyPHP... Interpréteur PHP Serveur MySQL Gestion de base PHPMyAdmin

74 Serveur web Apache Répertoire htdocs qui contient les fichiers accessibles Fichiers de configuration httpd.conf et autres.conf

75 PHP Fichier de configuration php.ini

76 Serveur MySQL Administration avec phpmyadmin Création d utilisateurs et de bases de données Création de tables Arrêt et démarrage

77 À VOUS DE JOUER faites des tests, posez des questions

78 PHP Langage de script adapté au web

79 Hypertext Preprocessor but : générer du html côté serveur pour l envoyer au client langage de script = langage pragmatique pas de gestion de la mémoire pas de type de variables pas de déclaration préalable des variables orienté objet depuis la version 5

80 Langage de script interprété PHP = langage interprété analyse des fichiers.php parsing (analyse de syntaxe et chargement en mémoire) exécution analyse à chaque exécution = à chaque requête d un client

81 HTML langage du web

82 Création en 1989 Créé en parallèle de HTTP HTTP : transmission HTML : porte le contenu Dérivé du langage SGML : langage de description de documents Créé pour l échange d articles scientifiques : liens, image, texte

83 Du HTML au XHTML HTML 4.01 : dernière version du HTML XML : dérivé de SGML, plus contraint permet de décrire toutes sortes de données devenu un standard pour l échange de données XHTML 1.0 : normalisation du HTML sous forme de XML

84 CSS : présentation des données Langage HTML : créé pour décrire des données Navigateurs : étendu le langage pour permettre des personnalisations d affichage Normalisations : remise à plat pour évacuer les ajouts liés à la présentation développement de feuilles de styles pour décrire la présentation des pages web

85 HTML : principes HTML : description du sens du texte identification : des titres, des paragraphes, des liens, des images C est tout (en principe)!

86 CSS : principes Porte toutes les informations de présentation des différents éléments d une page web

87 CHOIX IMPORTANTS Modélisation, encodage

88 Deux types de dynamisme Pages web générées à chaque requête Plus simple Plus souple Pages web générées une fois pour toutes à la création Plus rapide Pas utilisable dans tous les cas

89 Deux types de dynamisme Pages web générées à chaque requête Plus simple Plus souple Pages web générées une fois pour toutes à la création Plus rapide Pas utilisable dans tous les cas Nous utiliserons certainement cette possibilité

90 Encodage des caractères Les caractères n existent pas : ce sont des nombres. Il existe des tables de conversion : les encodages. Il faut choisir dès le début l encodage qu on utilisera : ASCII : système anglo-saxon (pas d accents) ISO : adapté aux besoins de l'europe de l ouest. UTF-8 : permet de tout écrire, devenu un standard.