cours 4 programmation web, orientée...

39
DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation web, orientée serveur Philippe Gambette

Upload: others

Post on 13-Jun-2020

4 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

DUT MMI – IUT de Marne-la-Vallée01/03/2016

M2202 - Algorithmique

Cours 4Programmation web,

orientée serveur

Philippe Gambette

Philippe
Rectangle
Philippe
Machine à écrire
15/03/2017
Page 2: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

• phpdebutant.net

• www.php.net (documentation du langage PHP)

Sources

Page 3: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

1) les bases de PHP sont faciles même si on a eu du mal en algorithmique au premier semestre

• 2) c’est accessible même aux futurs non intégrateurs/développeurs :il est important pour eux de maîtriser les bases de cette technologie

Préambule

Le speech d’Oussama Ammar (The Family)à propos de la connaissance des technologiesquand on monte sa start-up :https://youtu.be/U46m0SZMcTY?t=57m8s

Page 4: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

• Concept de la programmation web, orientée serveur

• Syntaxe PHP

Plan du cours 4 – Programmation web, orientée serveur

Page 5: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

• Concept de la programmation web, orientée serveur

• Syntaxe PHP

Plan du cours 4 – Programmation web, orientée serveur

Page 6: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

Source des visuels :http://www.flaticon.com/free-icon/notebook-computer_65732http://www.freepik.com/free-psd/simple-browser-with-icons-psd_715210.htm http://www.freepik.com/free-icon/three-servers_767466.htm http://www.freepik.com/free-icon/server_811738.htm

Page 7: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

Page 8: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

Page 9: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

Page 10: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

1 serveurhttp://monique.pantel.free.fr/Avis.php?id=49319

envoi de l’URL

Page 11: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

1 serveurhttp://monique.pantel.free.fr/Avis.php?id=49319

envoi de l’URL

Page 12: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

1 serveurhttp://monique.pantel.free.fr/Avis.php?id=49319

envoi de l’URL

Page 13: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Page 14: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php2

récupération du fichier

PHP

Page 15: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

3

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

envoi de la requête SQL

id=49319

Page 16: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

3

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

envoi de la requête SQL

id=49319

SELECT * FROM films WHERE id=49319

Page 17: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

3

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

id=49319

envoi de la requête SQL

SELECT * FROM films WHERE id=49319

Page 18: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

4

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

note, titre, sortie, avis

réception du résultat de la requête SQL

Page 19: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

4

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

note, titre, sortie, avis

réception du résultat de la requête SQL

Page 20: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

4

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

note, titre, sortie, avis

réception du résultat de la requête SQL

Page 21: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

4

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

note, titre, sortie, avis

réception du résultat de la requête SQL

Page 22: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

4

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

note, titre, sortie, avis

réception du résultat de la requête SQL

Page 23: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

4

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

note, titre, sortie, avis

réception du résultat de la requête SQL

Page 24: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

client

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

http://monique.pantel.free.fr/Avis.php?id=49319

Avis.php

base de données

5

envoi de la page HTML

Page 25: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

base de données

5

envoi de la page HTMLclient

Page 26: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

base de données

5

envoi de la page HTMLclient

Page 27: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

http://monique.pantel.free.fr/Avis.php?id=49319

serveur

base de données

5

envoi de la page HTMLclient

Page 28: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

+/- de la programmation web orientée serveur

Avantages de la programmation web orientée serveur :

• code PHP stocké sur le serveur, non visible pour le client (sécurité)

• interaction avec une base de données hébergée sur le serveur

• génération facile de fichiers de types variés (HTML, PNG, CSV, JSON, etc.)

• lancement possible de n’importe quel programme

• calculs effectués côté serveur

Inconvénients de la programmation web orientée serveur :

• calculs effectués côté serveur : doit résister à la charge

• nécessite de recharger la page... sauf en passant par AJAX

Page 29: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

« client web »→ navigateur(Firefox, Chrome,Explorer, Safari, etc.)

envoi d’une URL

Page 30: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

« client web »→ navigateur(Firefox, Chrome,Explorer, Safari, etc.)

« serveur web »→ machine oulogiciel(Apache, etc.)

envoi d’une URL

envoi d’une page HTML

Page 31: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

« client web »→ navigateur(Firefox, Chrome,Explorer, Safari, etc.)

« serveur web »→ machine oulogiciel(Apache, etc.)

envoi d’une URL

envoi d’une page HTML

page PHP= du code HTML« à trous »+ des instructionsPHP pour remplirles trous

exécute le code PHP

reçoit le code HTML

Page 32: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Concept de la programmation web orientée serveur

« client web »→ navigateur(Firefox, Chrome,Explorer, Safari, etc.)

« serveur web »→ machine oulogiciel(Apache, etc.)

envoi d’une URL

envoi d’une page HTML

page PHP= du code HTML« à trous »+ des instructionsPHP pour remplirles trous

exécute le code PHP

reçoit le code HTML

Instructions PHP :• Déclaration de variables• Affectations de variables• Structures de contrôle (tests, boucles)• Appel de fonctions (en particulier les fonctions de gestion de bases de données MySQL)• Entrées : récupération de valeurs provenant d’un formulaire ou de l’URL• Sorties : affichage (dans les trous du code HTML)

Le PHP est un langage «non typé» : pas besoin de déclarer les types des variables

Page 33: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

• Concept de la programmation web, orientée serveur

• Syntaxe PHP

Plan du cours 4 – Programmation web, orientée serveur

Page 34: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Syntaxe PHP – correspondance avec Java

Java PHP

Programme fichier TP1.java avec fichier TP1.php contenant duune classe TP1, ses code HTML (header, body)propriétés, et ses méthodes et des balises <?php et ?>dont la méthode main, contenant des instructionsqui contiennent des PHPinstructions Java

Compilation terminal : pas de compilation : langagejavac TP1.java « interprété » à la volée

Exécution terminal : URL de page PHP dansjava TP1 val1 val2 le navigateur web :

http://mmi.fr/TP1.php?param1=val1&p2=val2

Sortie afficher dans le terminal : afficher dans le code HTML :System.out.println( echo("toto");"toto");

Page 35: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Syntaxe PHP – correspondance avec Java

Java PHP

Programme fichier TP1.java avec fichier TP1.php contenant duune classe TP1, ses code HTML (header, body)propriétés, et ses méthodes et des balises <?php et ?>dont la méthode main, contenant des instructionsqui contiennent des PHPinstructions Java

Compilation terminal : pas de compilation : langagejavac TP1.java « interprété » à la volée

Exécution terminal : URL de page PHP dansjava TP1 val1 val2 le navigateur web :

http://mmi.fr/TP1.php?param1=val1&p2=val2

Sortie afficher dans le terminal : afficher dans le code HTML :System.out.println( echo("toto");"toto");

Page 36: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Syntaxe PHP – correspondance avec Java

Java PHP

Affichage dans la fonction main : dans le body :des paramètres public static void <?php

main(String[] arg){ echo ($_GET["param1"]System.out.println( ." ".$_GET["p2"]);?>arg[0]+" "+arg[1]);} (parenthèses pas nécessaires)

Initialisation int i=0; $i=0;d’une variable String x="toto"; $x="toto"; (ou $x='toto';)

(inclut la déclaration) (pas de déclaration)

Test if(i==0){x="a";} if($i==0){$x="a";}else{x="b";} else{$x="b";}

Boucle while(i>0){ while($i>0){ i++;} $i++;}

for(int i=0;i<10;i++){ for($i=0;$i<10;$i++){…} …}

Page 37: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Syntaxe PHP – correspondance avec Java

Java PHP

Tableaux Les numéros de case sont Les cases peuvent être des entiers de 0 à n-1 désignées par des noms(n=nombre de cases) (chaînes de caractères)La longueur d’un tableau La taille d’un tableau peutne peut pas changer. Changer.Valeurs toutes de même Possible de mettre des valeurstype de type différent

String[] tab = $tab = array("toto",{"toto","titi"}; "titi");

tab[0]="tototo"; $tab[0]="tototo";int a=tab.length; $a=count($tab);

$tab2 = array("o"=>"toto","i"=>"titi");

$tab2["o"]="tototo";$k=tab2.keys();

clé

valeur

Page 38: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Syntaxe PHP – correspondance avec Java

Java PHP

Tableaux Les numéros de case sont Les cases peuvent être des entiers de 0 à n-1 désignées par des noms(n=nombre de cases) (chaînes de caractères)La longueur d’un tableau La taille d’un tableau peutne peut pas changer. Changer.Valeurs toutes de même Possible de mettre des valeurstype de type différent

String[] tab = $tab = array("toto",{"toto","titi"}; "titi");

tab[0]="tototo"; $tab[0]="tototo";int a=tab.length; $a=count($tab);

$tab2 = array("o"=>"toto","i"=>"titi");

$tab2["o"]="tototo";$k=tab2.keys();

clé

valeur

En PHP : le foreach pour parcourir un tableau !

foreach ($tab2 as $key => $value){ echo("La case n°".$key); echo(" a la valeur ".$value);}

Page 39: Cours 4 Programmation web, orientée serveurigm.univ-mlv.fr/~gambette/ENSIUT/M2202Cours4-2017.pdf · DUT MMI – IUT de Marne-la-Vallée 01/03/2016 M2202 - Algorithmique Cours 4 Programmation

Syntaxe PHP – correspondance avec Java

Java PHP

Fonctions public static et le Le mot function précèdetype de sortie précèdent le le nom de la fonction, suivinom de la fonction, suivi de de parenthèses quiparenthèses qui contiennent contiennent les entréesles entrées éventuelles, éventuelles.précédées de leur type.public static int function somme($a,$b)somme(int a,int b){ {

return a+b; return a+b;} }

Appel de Le nom de la fonction est Le nom de la fonction estfonction suivi de parenthèses qui suivi de parenthèses qui

contiennent les entrées contiennent les entréeséventuelles. éventuelles.

Concaténation "a"+"b" "a"."b"