Module

HTML / CSS / PHP / MySQL

Comprendre l’architecture client / serveur
avec les langages phares du
développement Web

Rudy LECLERCQ
Plan du cours
• Introduction
• Du statique au dynamique
• Premiers pas
• Inclusions
• Les bases
• Transmettre des paramètres de pages en pages
• Les variables super globales
• Les fichiers
• POO
• Pour aller plus loin

2
 PHP
Partie 1 : du statique au dynamique
Sites statiques Vs sites dynamiques
HTML, CSS, …
Sites statiques
(sites vitrine)
+

PHP, MySQL, …
Sites dynamiques
(mises à jour automatiques, back office, …)

4
Communications client/serveur

Site statique

Site dynamique

5
Les langages

• Et le Javascript ?
➢Attention à ne pas confondre langages clients et langages serveurs

6
Le PHP
<?php echo "Vous êtes le visiteur n°" . $nbre_visiteurs; ?>

• Langage libre (créé en 1994)

• Gratuit
• Largement utilisé

• Dérivé du C

7
Les principaux concurrents de PHP
• ASP .NET
• JSP
• Ruby
• Python
• Node.JS
•…

8
La place de PHP dans le web
• PHP langage serveur unique ?

• PSR

9
 PHP
Partie 2 : premiers pas
Installer un environnement de
développement
• En local sur son propre système
• Les « tout-intégrés » (non recommandé)
• EasyPHP https://www.easyphp.org/
• L’essentiel (recommandé)
• PHP https://php.net
• En local sur un système « virtualisé »
• VM
• Docker

11
Installer PHP sur sa machine
• Installer Git pour obtenir un interpréteur de commande
• https://gitforwindows.org/

• Utiliser Git Bash pour avoir la meilleure expérience sur Windows

12
Installer PHP sur sa machine
• Télécharger PHP sur https://php.net/download
• Version Windows
• Préférez la version VC15 x64 Non Thread Safe (non debug)
• Dézipper PHP dans le dossier
• C:\php\php-7.3.0-nts-Win32-VC15-x64\
• « php.exe » doit se situer à la racine du dossier
• Ajout du dossier contenant PHP dans le « Path » de la machine
• Variable d’environnement
• OU alias php73 -> php.exe
• Vérifier le bon fonctionnement en lançant Git Bash, puis la
commande « php --version » : la version doit s’afficher
13
Installer PHP sur sa machine
• Créer le premier fichier de configuration « php.ini »
• À partir du fichier « php.ini-development »

• Instructions à modifier / vérifier

•…

14
Editer du PHP
• Le bloc notes !

• Jetbrains PHPStorm

15
Premiers pas avec PHP
• Les balises PHP
<?php /* Le code PHP se met ici */ ?>
<?php
/* Le code
PHP se met
ici */
// un autre commentaire sur une seule ligne
?>
• Des « balises courtes » existent (short tag) mais sont dépréciées
<? ?>

16
Intégration du PHP dans la page (1/2)

17
Intégration du PHP dans la page (2/2)

• On peut placer des balises PHP n’importe où dans le code :

18
Afficher du texte
• Instruction echo
<?php echo "Hello World !"; ?>
<?php echo 'Hello World !'; ?>

• Ecrire du HTML avec du PHP

<?php echo "Hello <strong>World !</strong>"; ?>

• Echappement
<?php echo "Cette ligne est écrite \"uniquement\" en PHP"; ?>
<?php echo 'C\'est l\'automne !'; ?>

19
Exercice : votre première page en PHP

20
Rappel : le PHP est exécuté sur le serveur

21
 PHP
Partie 3 : inclusions
Rappel : structure d’un site (1/2)
En-tête
• Jusqu’à maintenant nous
devions copier-coller le menu,
l’entête et le pied de page sur
toutes les pages

Menu Corps

Pied de page
23
Rappel : structure d’un site (2/2)

En-tête

Menu

Corps

Pied de page

24
La fonction include (1/6)
• Jusqu’à maintenant nous
devions copier-coller le En-tête
menu, l’entête et le pied header.php

de page sur toutes les

pages
Menu Accueil
menu.php index.php
➢La solution :
la fonction « include » !
Pied de page
footer.php

25
La fonction include (2/6)
• menu.php

• Inclusion dans index.php

• Si menu.php est dans le dossier include

26
La fonction include (3/6)
• Rappel sur les chemins
• Relatif ou absolu ?
• Image.jpg → relatif
• dossier/icone.ico → relatif
• ../../footer.html → relatif
• C:\Site\index.html → absolu
• /var/www/site/index.html → absolu
• / → ???
• Relatif : dépend du contexte
• Absolu : précise le chemin complet

• Attention : différence entre url (pour les liens) et le chemin (« path ») sur le
serveur

27
La fonction include (4/6)

28
La fonction include (5/6)
• Page finale reçue par le visiteur identique

• Avantages
• Lisibilité
• Flexibilité

29
La fonction include (6/6)
• D’autres méthodes d’inclusions
• Passage de paramètres
• Modèle MVC
•…

• Nous les aborderons plus tard dans le programme

31
 PHP
Partie 4 : les bases
Les variables (1/2)
• $nom = 'John';

• string, int, float, bool (true/false), null

• Pas de typage fort !

• Contrairement à Java, string est un type de base

• echo $nom;
➢John

33
Les variables (2/2)
• Concaténer
• echo "Bonjour " . $nom . " !";
• echo 'Bonjour ' . $nom . ' !';

• echo "Bonjour $nom !";

• echo 'Bonjour $nom !'; ➔ne fonctionne pas !

➢Attention aux guillemets que vous utilisez !

• Les opérations
• +, -, *, /, %

34
Les structures de base (1/3)
• if … elseif … else …
• ==, >, <, >=, <=, !=, !, &&, ||, and, or
• Comme en C, tester les égalités avec le ==
• On pourra également trouver des ===

35
Les structures de base (2/3)
• Rappel : on peut mettre des balises PHP dans du code HTML…

36
Les structures de base (3/3)
• Écriture ternaire condensée
$majeur = ($age >= 18) ? true : false;
• switch … case
• Boucles while, do … while
➢Attention aux boucles infinies !
(Selon les configs, PHP s’exécute maximum 30 sec)

• Boucles for
• Boucles foreach

37
Les fonctions (1/2)
• Écrire une fonction

function maFonction($param1, $param2, $param3 = 15) {

// …
return $result;
}

$r1 = maFonction('John', true);

$r2 = maFonction('Janne', 'ok', 28);

38
Les fonctions (2/2)
• Les fonctions de PHP
• Traitement des chaines de caractères
(strlen, str_replace, strtolower, …)
• Date
(date('Y'), date('d-m-Y') …)
➔ cf. http://php.net/manual/en/function.date.php
• Traitement sur les tableaux
•…

• http://www.php.net/ OU recherche sur Google (ex : php strpos)

39
Les tableaux (1/4)
• Mot clé array

40
Les tableaux (2/4)
• Les tableaux associatifs

41
Les tableaux (3/4)
• Boucle for
• Boucle foreach
• Permet de parcourir les tableaux associatifs
• Pas besoin de connaitre les clés du tableau

42
Les tableaux (4/4)
• Afficher rapidement un array avec print_r
• Utile pour le débogage

• Rechercher dans un tableau

• array_key_exists, in_array, array_search

43
 PHP
Partie 5 : transmettre des paramètres
de pages en pages
Format d’une URL
• URL = Uniform Resource Locator

• http://www.google.fr/search?q=ectei

• En théorie, pas de limite de paramètres, mais attention aux nombre maximum de caractères que peuvent gérer les navigateurs
(256 maxi conseillé)

45
Créer un lien avec des paramètres
?message=bonjour&date= 10/01/2019

index.php liste.php

<a href="liste.php?message=bonjour&date=10/01/2019">Dire bonjour !</a>

• Pour que ce code soit valide W3C, remplacer le & par &amp;
<a href="liste.php?message=bonjour&amp;date=10/01/2019">Dire bonjour !</a>

➢Envoi 2 paramètres :
• Message : « bonjour »
• Date : 10/01/2019

46
Récupérer les paramètres en PHP (1/2)

• Page liste.php
• Utilisation du tableau $_GET
• Créé automatiquement
• Tableau associatif
• Les correspondent aux paramètres envoyés en URL
$_GET['message']
$_GET['date']

• Il suffit d’appeler la clé souhaitée

<p>Voici mon message (écrit le <?php echo $_GET['date']; ?>) :
<?php echo $_GET['message']; ?></p>

47
Récupérer les paramètres en PHP (2/2)

• ATTENTION : Ne faites jamais confiance aux données reçues !

• N’importe qui peut modifier un paramètre

➢Injection de code malveillant
➢XSS, exécution d’un script distant
➢Si utilisation d’une base de données, récupération par le pirate de l’ensemble
des données
➢Effacement des données de la base
➢…

48
Tester la présence d'un paramètre (1/2)

• Si un paramètre n’existe pas dans l’URL nous risquons d’avoir une Notice :
Notice: Undefined index: date in C:\wamp\www\tests\liste.php on line 9

➢Fonction isset
<?php
if(isset($_GET['date']) and isset($_GET['message'])) {
?>
<p>Voici mon message (écrit le <?php echo $_GET['date']; ?>) :
<?php echo $_GET['message']; ?></p>
<?php
}else {
echo 'Vous devez renseigner un message et une date';
}
?>

➢Caster un entier : (int)

49
Tester la présence d'un paramètre (2/2)

• Doit-on gérer tous les cas ?

➢OUI ! Rappelez vous qu’il ne faut jamais faire confiance aux données reçues !

50
Transmettre des données avec un formulaire

• Rappels sur les balises form :

• Eléments : text, textarea, submit, hidden, radio, checkbox, …

• Envoie les données via le tableau $_POST

51
Sécurité des formulaires (1/3)
• Un pirate ne peut pas modifier les scripts qui sont sur le serveur MAIS
il peut modifier le formulaire pour envoyer des données malveillantes

• Fonctionnement normal :

53
Sécurité des formulaires (2/3)
• Attaque à partir d’un formulaire modifié

54
Sécurité des formulaires (3/3)
• Encore une fois …

Ne faites JAMAIS confiance aux données reçues !

55
XSS
• Cross-Site Scripting
• Exécution d’un code (Javascript) sur votre site
• Vol de cookies, …

➢Solution : htmlspecialchars, strip_tags

56
 PHP
Partie 6 : les variables super globales
Les variables super globales
• Variables générées automatiquement par PHP
• Leur nom est en majuscules et commencent par un underscore
• De type array

• $_GET, $_POST, $_FILE, $_SERVER, $_SESSION, $_COOKIE …

• Exemple : $_SERVER['REMOTE_ADDR'] donne IP du client

• Documentées sur le site de PHP :

http://php.net/manual/fr/language.variables.superglobals.php
(sur Google : « php superglobales »)

58
Les sessions (1/2)
• Permet de conserver des variables durant toute la visite du site
• Différent de GET et POST qui ne transmettent les données que vers la
page suivante
• Fonctionnement
1. Un visiteur arrive sur le site. Génération d’un numéro de session
(PHPSESSID). Exemple : a02bbffc6198e6e0cc2715047bc3766f
2. On peut créer une infinité de variables de session.
Exemple : $_SESSION['nom']
3. Lorsque le visiteur se déconnecte, la session est fermé et les variables
détruites. (action de déconnexion ou timeout)

59
Les sessions (2/2)
• session_start()
• Initialise le système de gestion des sessions

• session_destroy()
• Permet de « détruire » une session, vide toutes les données contenues dans la
variable $_SESSION

session_start();
$_SESSION['nom'] = $nom;

• Attention : ces instructions doivent être écrites avant tout affichage (y

compris les balises d’entête HTML)

60
Les cookies
• Fichier texte enregistré sur l’ordinateur du visiteur
• Enregistrer un cookie
setcookie(<nom>, <valeur>, <expiration>, <disponibilité>);

➔Attention, setcookie doit s’exécuter avant tout affichage

$timestamp_expire = time() + 365*24*3600; // Le cookie expirera dans un an

setcookie('membre_pseudo', $pseudo, $timestamp_expire, "/");
setcookie('membre_mot_de_passe', sha1($mot_de_passe), $timestamp_expire, "/");

• Afficher un cookie
<?php echo $_COOKIE['pseudo']; ?>

• Modifier un cookie
setcookie('membre_pseudo', $nouveau_pseudo, $timestamp_expire, "/");

• Attention : le cookie vient de l’utilisateur !

61
62
 PHP
Partie 7 : les fichiers
Envoyer un fichier (1/3)

Le fichier est stocké dans un dossier temporaire

66
Envoyer un fichier (2/3)
• Le tableau $_FILE
$_FILES['monfichier']['name'] Nom du fichier envoyé par le visiteur.

$_FILES['monfichier']['type'] Type du fichier envoyé. Exemple : image/gif.

Taille (en octet) du fichier envoyé.

Attention, la taille de l'envoi est limitée par PHP. Par
$_FILES['monfichier']['size']
défaut, il est impossible d'uploader des fichiers de
plus de 8 Mo.

$_FILES['monfichier']['tmp_name' Emplacement temporaire du fichier (attribué par

] PHP).

Code d'erreur permettant de savoir si l'envoi s'est

bien effectué ou s'il y a eu un problème, et si oui
$_FILES['monfichier']['error']
lequel.
La variable vaut 0 s'il n'y a pas eu d'erreur.
67
Envoyer un fichier (3/3)
• Traitement de la réception du fichier

68
70
Lire et écrire dans un fichier
• Convient si on doit stocker un petit volume d’informations
Exemple : compteur de visites
• Bien régler les droits sur notre fichier
• Sinon : Warning: fopen(compteur.txt): failed to open stream: Permission denied
• chmod 777 compteur.txt

• Ouvrir et fermer un fichier

• fopen : r (lecture), r+ (lecture/écriture), a(lecture, créé le fichier si n’existe pas), a+

(lecture/écriture)

71
Lire un fichier
• 2 possibilités
• Caractère par caractère : fgetc
• Ligne par ligne : fgets

• Notion de curseur

72
Ecrire dans un fichier
• Ecrire 1 ligne : fputs

• fputs écrit à l’emplacement du curseur

• Si on veut revenir au début du fichier (ne fonctionne pas en mode a et

a+) :
fseek($monfichier, 0);
• Attention : écrire par-dessus une ligne va l’écraser

73
Lire et écrire dans un fichier

74
 PHP
Partie 8 : POO
Les classes et les objets
• Une classe
• Représente un concept (exemple : une voiture)
• Contient des attributs et des méthodes qui lui sont propres
• Un objet
• Est une instanciation d’une classe (exemple : la voiture de John)
• Initialise les variables de sa classes avec des valeurs
• On peut dire qu’une classe est un « type » d’objet
Objet 1
• « $maVoiture est de type Voiture »
Classe

Objet 2

76
Exemple de classe (1/2)
<?php
class Voiture {
protected $nomProprietaire;
protected $couleur;

public function getNomProprietaire() {

return $this->nomProprietaire;
}

public function getCouleur() {

return $this->couleur;
}

public function setNomProprietaire($nom) {

$this->nomProprietaire = $nom;
}

public function setCouleur($couleur) {

$this->couleur = $couleur;
}
}
77
Exemple de classe (2/2)
<?php
class Voiture {
// ...
public function calculerPrix() {
$prix = 5000;

switch ($this->getCouleur()) {
case 'rouge':
$prix = $prix * 1.5;
break ;
case 'bleu':
$prix = $prix * 0.75;
break;
default:
break;
}

return $prix;
}
}

78
Instancier une classe
<?php
include_once('classes/Voiture.php');
$maVoiture = new Voiture(); // créé un objet vide de type "voiture"
$maVoiture->setNomProprietaire('Nicolas');
$maVoiture->setCouleur('rouge');
echo $maVoiture->calculerPrix();

• $maVoiture est un objet

• On peut créer autant d’objets que l’on veut
$laVoitureDeJohn = new Voiture();
$laVoitureDeJohn->setNomProprietaire('John');
$laVoitureDeJohn->setCouleur('vert');
echo $laVoitureDeJohn->calculerPrix();

79
Les méthodes automatiques
• Constructeurs et destructeurs
• __construct
public function __construct($couleur) {
$this->setCouleur($couleur);
}
// ...
// ...
$maVoiture = new Voiture('bleue');

• __destruct : appelé suite à l’instruction unset();

public function __destruct() {
echo "L'objet va être détruit";
}

• D’autres méthodes existent

• __get, __set, __toString, __call, __sleep, __wakeup …

80
Exercice : créer une classe
• Créez une classe Utilisateur
1. Créez un dossier classes dans votre projet
2. Ajoutez y un fichier Utilisateur.php qui contiendra votre classe
3. Ecrivez la classe (attributs et méthodes nécessaires)
• Attributs : login, mot de passe, …
• Méthodes : getters, setters, compareTo

81
L’héritage
• On créé une classe fille qui va préciser la classe mère

Voiture

Break Coupé

• La classe « Coupé » hérite de la classe « Voiture »

• La classe fille hérite de tous les attributs et de toutes les méthodes de la classe
mère
• Une classe fille a UNE SEULE classe mère

82
Exemple d’héritage (1/2)
<?php
include_once('classes/Voiture.php');
class Coupe extends Voiture {
protected $aileron;

public function getAileron() {

return $this->aileron;
}

public function setAileron($aileron) {

$this->aileron = $aileron;
}
}

83
Exemple d’héritage (2/2)
<?php
class Coupe extends Voiture {
// ...
public function calculerPrix() {
$prix = parent::calculerPrix();
return $prix + 500;
}
}

84
Instancier une classe fille
<?php
$maVoiture = new Coupe(); // créé un objet coupé vide
$maVoiture->setNomProprietaire('Nicolas');
$maVoiture->setCouleur('rouge');
echo $maVoiture->calculerPrix();

85
Mot clés
• parent : accéder aux méthodes / attributs de la classe parente
parent::calculerPrix();

• instanceof : tester la classe d’un objet

if($maVoiture instanceof Voiture)
echo 'maVoiture est une Voiture';

if($maVoiture instanceof Coupe)

echo 'maVoiture est un Coupé';

86
Le polymorphisme (1/2)
<?php
class Voiture {
protected $plaqueImmatriculation;
// ...
public function getImmatriculation() {
return 'Voiture N° ' . $this->getPlaqueImmatriculation();
}
// ...
}

<?php
class Coupe extends Voiture {
// ...
public function getImmatriculation() {
return 'Modèle coupé N° ' . $this->getPlaqueImmatriculation();
}
// ...
}

87
Le polymorphisme (2/2)
<?php
$maVoiture = new Coupe(); // créé un objet coupé vide
$maVoiture->setNomProprietaire('Nicolas');
$maVoiture->setCouleur('rouge');
echo $maVoiture->calculerPrix();

$laVoitureDeJohn = new Voiture();

$laVoitureDeJohn->setNomProprietaire('John');
$laVoitureDeJohn->setCouleur('vert');
echo $laVoitureDeJohn->calculerPrix();

echo $maVoiture->getImmatriculation(); // utilise la méthode dans Coupe

echo $laVoitureDeJohn->getImmatriculation(); // utilise la méthode dans Voiture

$garage = array($maVoiture, $laVoitureDeJohn);

foreach ($garage as $vehicule) {
echo $vehicule->getImmatriculation(); // utilise la méthode la plus précise
}

88
Les méthodes de classe
• N’est pas propre à une instance, méthode générale à la classe
• Repérée par le mot clé « static »
class Voiture {
// ...

public static function getListeMarques() {

return array('Renault', 'Peugeot', 'Mercedes');
}

// ...
}

$marques = Voiture::getListeMarques();

• Remarque : on ne peut donc pas accéder à des valeurs d’attributs

• Mot clé self

89
Les interfaces
• Une interface permet de décrire un comportement d’un objet, de savoir quels
services va rendre la classe qui l’implémente
• Attention : interface ≠ héritage
interface Vendable {
public function calculerPrix();
}

class Voiture implements Vendable {

// ...
public function calculerPrix() {
// ...
}
}

• Une classe peut implémenter plusieurs interfaces (exemple : Vendable,

Deplacable…)
• Avantage : communication entre développeurs, description des besoins et des
comportements attendus …

90
Les classes abstraites (1/3)
• Une classe abstraite
• Ne peut être instanciée ➔ n’existe que pour être dérivée
• Possède des attributs et des méthodes, comme une classe concrète
• Possède une ou plusieurs méthodes abstraites

• Attention : une classe abstraite est différente d’une interface car elle
permet d’implémenter des attributs et des méthodes
➢ donc de définir un comportement par défaut.

91
Les classes abstraites (2/3)
<?php
abstract class Voiture {
protected $nomProprietaire;
protected $couleur;
// ...

public function getNomProprietaire() {

return $this->nomProprietaire;
}
public function getCouleur() {
return $this->couleur;
}
public function setNomProprietaire($nom) {
$this->nomProprietaire = $nom;
}
public function setCouleur($couleur) {
$this->couleur = $couleur;
}

// ...

// méthode abstraite 92
abstract public function charger($cargaison);
Les classes abstraites (3/3)
<?php
class Coupe extends Voiture {
// ...

// implémentation de la méthode abstraite

public function charger($cargaison) {
// ...
}

// ...
}

Pas de mot clé « abstract » car la méthode est ici bien concrète

93
L’objet DateTime
• Permet de gérer facilement les dates

<?php
$date = new DateTime('2000-01-01');
echo $date->format('d-m-Y');

97
 PHP
Partie 9 : pour aller plus loin
Les Exceptions (1/2)
• Jusqu’à maintenant nous avions des "fatal error", "notice", …
• "Exception"
• Permet de définir nos propres types d’erreurs
• Nous allons pouvoir "attraper" ces erreurs pour les
traiter sans planter le script
<?php
function additionner ($a, $b) {
if (!is_numeric ($a) OR !is_numeric ($b))
// On lance une nouvelle exception grâce à throw et on
instancie directement un objet de la classe Exception
throw new Exception ('Les 2 paramètres doivent être des nombres');

return $a + $b;
}
echo additionner ('azerty', 54), '<br />';

➢ Fatal error: Uncaught exception 'Exception' with message 'Les deux paramètres doivent être des nombres' in 99
C:\wamp\www\Tests\pdo.php:5 Stack trace: #0 C:\wamp\www\Tests\exceptions.php(11): additionner('azerty', 54)
Les Exceptions (2/2)
• Attraper une Exception
try {
echo additionner ('azerty', 54), '<br />';
}
catch (Exception $e) {
// traitement
echo "Une exception a été lancée. Message d'erreur : ". $e->getMessage();
}

• Permet de mieux contrôler le comportement de l’application

• Affichage d’un message explicite
• Envoi d’un mail automatique au webmaster
• Correction automatique de l’erreur
•…

100
Exemple de gestion d’Exception
try {
$date = new DateTime('2000-01-01');
echo $date->format('d-m-Y');

} catch (Exception $e) {

echo $e->getMessage();
}

101
• Mots clés continue, break
• serialize, unserialize
• unset()
• clone et passages par référence (&)
• Front controller
• Class abstraite : exemple classe de paiement
• simpleXML, GD
• Exceptions: catch multiple, héritage, exceptions personnalisées
• PHPDOC
• func_num_args
• @, or die() // ne plus utiliser
• Expressions régulières
• …

103