1ère Générale NSI

 

Term. Générale NSI

 

Terminale STI2D SIN

Bts Ccst

Technico-commercial 3.0

[[{"text":"

HTML (HyperText Markup Language) ,
PHP Hypertext Preprocessor
et Interation Client-Serveur : Présentation



","title":"","posi":11},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

1. Qu'est ce que PHP ?


Le PHP, acronyme récursif pour PHP Hypertext Preprocessor est un langage de scripts spécialement conçu pour le développement d'applications web.
Il peut être intégré facilement au HTML.

Le langage PHP a été créé en 1994 par Rasmus Lerdorf, un programmeur groenlandais et canadien pour son site web personnel.

Un exemple de code PHP

On petit exemple en PHP qui

  • Calcule la somme de deux varariables, $var1=5 et  $var2=7 ;
  • Affiche la somme avec la fonction avec la fonction echo ;
  • Calcule et affiche la somme de deux entiers choisis aléatoirement entre 1 et 100, avec la fonction rand(1 , 100).


<!doctype html>
<html>
<head>
<title>
Exemple de variables
</title>
<meta charset=\"utf-8\"/>
</head>
<body>
<h1> Un premier programme en PHP : pour les tests</h1>
<?php
// Commentaires en php
// Utilisation de variables, avec le dollard $
$var1=5;
$var2=7;
$somme=$var1+$var2;
// echo permet d'afficher sur la page
// On peut méler du texte et des variables
echo \"<p>La somme de $var1 et $var2 est $somme.</p>\";
$nombre1=rand(1,100); // rand(a,b) génère un entier aléatoire entre a et b (inclus)
echo \"<p>Le 1er nombre choisi au hasard est $nombre1.</p>\";
$nombre2=rand(1,100);
echo \"<p>Le 2e nombre choisi au hasard est $nombre2.</p>\";
$somme=$nombre1+$nombre2;
// On affiche la somme
echo \"<p>La somme de $nombre1 et $nombre2 est $somme.</p>\";
?>
</body>
</html>
  • Visualiser le résultat
    Un lien vers le fichier hébergé sur un serveur distant : PHP-Exemple1.php.
     

Premières remarques sur le PHP

  • L'affichage en PHP utilise la fonction echo \" texte et $variables \".
    On peut afficher du texte et des variables $var simultanément très simplement.
  • Les lignes se terminent par un point virgule  ;.
  • Les variables se définissent avec le dollard  $var1  et peuvent s'intégrer facilement au texte.

Petit exercice important

  1. Affichez le code source (Click droit) de la page PHP-Exemple1.php.
  2. Vous remarquez que le code source propose juste l'affichage, sans les lignes de code PHP.
  3. Actualisez la page, on voit que le contenu change car la fonction rand(1 , 100) est appelée.
  4. C'est magique, le client, c'est à dire notre ordinateur ne s'aperçoit pas qu'il y a un calcul d'effectué.

 

Un fonctionnement distant

  • Le PHP fonctionne en fait sur serveur distant.
    On ne peut pas avoir un fonctionnement immédiat sur notre disque comme avec le HTML, le CSS ou le JavaScript.
      
  • Ce qui distingue PHP des langages de script comme le Javascript, est que le code est exécuté sur le serveur, générant ainsi le HTML, qui sera ensuite envoyé au client. Le client ne reçoit que le résultat du script, sans aucun moyen d'avoir accès au code qui a produit ce résultat. Vous pouvez configurer votre serveur web afin qu'il analyse tous vos fichiers HTML comme des fichiers PHP. Ainsi, il n'y a aucun moyen de distinguer les pages qui sont produites dynamiquement des pages statiques.
     
  • le serveur doit donc être capable de repérer les parties de codes PHP, cela se fera grâce à des balises.
    Le code PHP est donc inclus entre une balise de début  <?php  et une balise de fin  ?>  qui permettent au serveur web de passer en mode PHP, ce que ne fait pas votre navigateur sur votre disque dur.

 \"client

Le fonctionnement du PHP

Vous pouvez maintenant tranquillement lire cette page qui expose le fonctionnement du PHP.

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

2. Préparez votre environnement de travail


Il va donc nous falloir préparer un environement de travail afin de pouvoir lire les fichiers PHP.

Plusieurs solutions sont possibles, si vous avez déjà un site en ligne, tout sera plus facile, sinon, vous allez devoir installer plusieurs émulateurs de serveurs distants.

Cas 1 : j'ai un site en ligne

  • Si vous avez un site en ligne, tout est très simple, il vous suffit d'envoyer vos fichiers sur votre espace et de les ouvrir via votre navigateur. Chaque site à un interpréteur PHP.
  • Pour télécharger facilement vos fichiers, vous pouvez : 
    • Soit vous connecter chez votre hébergeur ;
    • Soit utiliser un client FTP. Je vous conseil d'installer FileZilla, gratuit et très simple d'utilisation. 
      Il vous faudra cependant récuprérer chez votre hébergeur vos identifiants de connexion. C'est un peu long la première fois mais ensuite c'est très rapide.

\"filezilla

Cas 2 : je veux installer un serveur en local

Deux principaux serveurs sont utilisés : 

Vous pouvez consulter le tutoriel d'Openclassrooms.

Quelques remarques post Installation

  •  Il ne suffit pas d'ouvrir un fichier avec son navigateur pour que cela fonctionne, on doit généralement lancer l'émulateur puis tapper dans son navigateur :

http://localhost/MonFichier.php

  • WampServeur
    • Création automatique d’un répertoire « www » lors de l’installation (typiquement c:\\wamp\\www).
    • Créez un sous répertoire pour votre projet et déposez-y vos fichiers PHP
    • Cliquez sur le lien « Localhost » du menu de WampServer ou ouvrez votre navigateur à l’adresse :

http://localhost/MonFichier.php

    • Bases de données.
      Au lancement de PhpMyAdmin, il vous sera demandé un nom utilisateur et un mot de passe.
      Après installation de Wampserver 3,
      • le nom utilisateur par défaut est \"root\" (Sans les guillemets)
      • et il n'y a pas de mot de passe, ce qui veut dire que vous devez laisser la case Mot de passe du formulaire d'accès vide.
         
  • Xampp
    • Placer les projets dans le dossier htdocs qui est dans C:\\xampp\\htdocs
    • Pour ouvrir un fichier nommé MonFichier.php qui est dans le répertoire htdocs, tapper dans votre navigateur :

http://localhost/MonFichier.php

    • Bases de données.
      Pour accéder à la base de données
      => Admin Mysql

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

3. Un test puis les exercices et travaux dirigés


Nous sommes prêts pour un petit test.

  • Recopier le code source de l'exemple 1, enregistrez-le sur votre disque dur avec l'extension .php et ouvrez-le dans votre navigateur .... suspens !

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

4. Programmer en PHP

Quelques remarques sur les fonctions, les structures conditionnels en PHP

    • Les fonctions en PHP fonctionnent comme en Javascript. Le mot clé function permet de définir une fonction.
    • Les paramètres sont écrits entre parenthèses précédés du symbole $ comme toute les variables.
    • Le mot clé return permet de renvoyer une valeur.
    • Il existe de nombreuses fonctions intégrées en PHP vous pouvez consulter ces sites de références au fur et à mesure des besoins.
    • De même les structures conditionnelles if et if else fonctionnent comment en Javascript.
       
    • Par exemple cette fonction renvoie le maximum des deux nombres

<?php
function maximum($a,$b)
{
if ($a>$b)
return $a;
else
return $b;
}
?>

  • De même les structures itératives, les boucles for et while fonctionnent comment en Javascript.

Un exemple

L'exemple ci-dessous se sert d'une boucle for pour afficher un tableau à l'écran avec une boucles for et une boucle while . C'est magique.


<!doctype html>
<html>
<head>
<title>
PHP - Exemple 2
</title>
<meta charset=\"utf-8\"/>
</head>
<body>
<h1> PHP - Exemple 2 </h1>
<table border=\"1\">
<tr>
<?php
for($i=1;$i<=10;$i=$i+1) // ou ($i=1;$i<=10;$i++)
{
echo \"<td>$i</td>\";
}
?>
</tr>
</table>
<p> </p>
<table border=\"2\">
<tr>
<?php
$i = 1;
while ($i <= 10)
{
echo \"<td>$i</td>\";
$i=$i+1;
}
?>
</tr>
</table>
</body>
</html>

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

Exercice 1
La fonction rand(a,b) renvoie un entier aléatoire compris entre a et b.
1. Ecrire un script qui choisit aléatoirement un nombre entre 1 et 15.
2. Et qui affiche le table de multiplication de ce nombre dans un tableau.
Toute amélioration est la bienvenue.

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"},{"solution":"

<h1> Exercice 1 </h1>
<table border=\"1\">

<?php
$table = rand(1,15);

for($i=1;$i<=10;$i=$i+1) // ou ($i=1;$i<=10;$i++)
{
$calcul = $i*$table;
echo \"<tr><td>$i x $table =</td><td>$calcul</td></tr>\\n\";
}
?>

</table>


"}],[{"text":"

Exercice 2
La fonction rand(a,b) renvoie un entier aléatoire compris entre a et b.
Ecrire un script en php qui :
1. choisit 100 nombres aléatoires entre 0 et 100 ;
2. les affiche  ;
3. et affiche leur moyenne.
Toute amélioration est la bienvenue.

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"},{"solution":"

<h1> Exercice 2 </h1>


<?php
$somme = 0;

for($i=1;$i<=100;$i=$i+1) // ou ($i=1;$i<=10;$i++)
{
$r = rand(1,100);
$somme = $somme + $r;
echo \"$r \";
}
$moy = $somme / 100;
echo \"<br>La moyenne est de $moy\";

?>


"}],[{"text":"

5. Interagir avec une page en PHP : les méthodes GET et POST

Un script PHP s'exécute sur le serveur lorsque l'utilisateur accède à un fichier par un lien. Ce script effectue un certain nombre d'instructions pour produire la page web demandée et s'arrête lorsque celle-ci est produite.
Comment faisons-nous pour passer une information d'une page à l'autre ? De l'utilisateur à la page .PHP ?

Par exemple, si je saisi mon compte utilisateur sur un site et qu'en cliquant je suis conduis vers la page de mon compte, comment cette page se souvient-elle du nom que j'ai écrit dans la page précédente ?

Il existe plusieurs solutions pour transmettre des informations d'une page aux autres :

  • Cookies ;
  • base de données ;
  • fichiers textes ;
  • la méthode  GET ;
  • la méthode POST.

Nous allons étudier les méthodes GET et POST.

 

5.a. La méthode GET
Interagir avec une page en PHP avec la méthode GET

 

Les variables ne transitent pas toujours via un formulaire mais bien souvent par l'URL via la méthode GET.

L'URL (Uniform Resource Locator) sert à représenter une adresse sur le web comme celle du site www.math93.com.

Par exemple, après avoir fait une recherche sur Google, par exemple avec math93, la barre d'adresse contient une URL longue qui ressemble à ceci :

\"recherche

Dans cet exemple, les informations après le point d'interrogation sont des données que l'on fait transiter d'une page à une autre.


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

5.a.1. Former une URL pour envoyer des paramètres

Imaginons que votre site s'appelle math93.com et que vous avez une page PHP intitulée bonjour.php. Pour accéder à cette page, vous devez aller à l'URL suivante :

http://www.math93.com/bonjour.php

Pour envoyer des informations à la page bonjour.php, on va ajouter des informations à la fin de l'URL, comme ceci :

\"php

  • On écrit les variables et les valeurs des variables après un point d'intérogation ? .
  • On sépare les variables par le symbole & .
  • La seule limite est la longueur de l'URL. En général il n'est pas conseillé de dépasser les 256 caractères.

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

5.a.2. Récupérer les valeurs des variables

Nous avons fait un lien vers le fichier php bonjour.php et à deux variables nom et prenom.

exemple3.php?nom=Galois&prenom=Evariste

Pour récupérer les valeurs des variables, on y accède via la variable $_GET.

  • $_GET['nom'] .     à la valeur Galois ;  
  • $_GET['prenom'] .  à la valeur Evariste ;

 

Par exemple on a ici avec le petit code en écrivant dant la console :

Essayer de changer les noms et prénoms dans l'adresse URL.


<!doctype html>
<html>
<head>
<title>
PHP - Exemple 3
</title>
<meta charset=\"utf-8\"/>
</head>
<body>
<h1> PHP - Exemple 3 </h1>
<form action=\"exemple3.php\" method=\"get\">
<label \"nom\">Votre Nom :</label>
<input type=\"text\" name=\"nom\"> <br>
et <br>
<label >Votre Prénom :</label>
<input type=\"text\" name=\"prenom\"><br>
<input type=\"submit\" value=\"Envoyer\">
</form>
<?php
// les variables existent-t-elles ?
if(isset($_GET['nom']) and isset($_GET['prenom']))
{// oui les variables existent
$lenom=$_GET['nom'];
$leprenom=$_GET['prenom'];
//echo \"<p>Bonjour $_GET['prenom'] et $_GET['nom'] !</p>\" ;
echo \"<p>Bonjour $leprenom $lenom</p>\" ;
}
else
{
echo \"<p>Bonjour Madame ou Monsieur.</p>\" ;
}
?>
</body>
</html>


  • Remarque :  isset(var)   - Détermine si la variable var est déclarée et est différente de NULL.

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

Exercice 3
1. Ecrire une page qui prend deux nombres dans l'URL et affiche leur somme.
2. Modifier la page pour donner trois paramètres dans l'URL, deux nombres et une opération. Le résultat de l'opération sera affiché dans la page.
Toute amélioration est la bienvenue.

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"},{"solution":"

     exercice3.php?a=3&b=2&op=fois

<!doctype html>
<html>
<head>
<title>
PHP - Exemple 3
</title>
<meta charset=\"utf-8\"/>
</head>
<body>
<h1> Exercice 3 </h1>
<form action=\"exercice3.php\" method=\"get\">
<label \"nom\">a=</label>
<input type=\"text\" name=\"a\"> <br>
<label >b=</label>
<input type=\"text\" name=\"b\"><br>
<label >op </label>
<input type=\"text\" name=\"op\"><br>
<input type=\"submit\" value=\"Envoyer\">
</form>
<?php
// les variables existent-t-elles ?
if(isset($_GET['a']) and isset($_GET['b']) and isset($_GET['op']))
{// oui les variables existent
$a=$_GET['a'];
$b=$_GET['b'];
$op=$_GET['op'];//operation
//echo \"<p>Bonjour $_GET['prenom'] et $_GET['nom'] !</p>\" ;
if ($op==\"plus\")
{$calcul = $a + $b;
$operation = \"$a + $b =\";
}
else if ($op==\"moins\")
{$calcul = $a - $b;
$operation = \"$a - $b =\";
}
else if ($op==\"fois\")
{$calcul = $a * $b;
$operation = \"$a * $b =\";
}
else
{$calcul = $a / $b;
$operation = \"$a / $b =\";
}
echo \"<p>Le calcul est $operation $calcul</p>\" ;
}
else
{
echo \"<p>Pas de calcul en cours.</p>\" ;
}
?>
</body>
</html>

"}],[{"text":"

Exercice 4
1. Ecrire deux pages, la première choisissant un nombre au hasard entre -10 et 10
2. et contenant un lien vers la seconde qui affichera la racine carrée du nombre choisi, si cela est possible.
Toute amélioration est la bienvenue.

 


","title":""},{"edit":"

Mettre le résultat ici (code et figure).

"},{"solution":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

5.b. La méthode POST
Interagir avec une page en PHP avec la méthode POST

Il existe une autre méthode pour passer des données d'une page à l'autre sans mentionner les valeurs dans l'URL.

Il s'agit de la méthode utilisée dans les formulaires

Un exemple

Reprenons l'exemple 3 avec le nom et le prénom.

  1. On va donc écrire deux pages, la première une page HTML que l'on va nommer ex4-HTML.html, et la deuxième une page PHP l'on va nommer ex4-PHP.php
  2. Afin de pouvoir accéder aux contenus envoyés par la méthode POST, il faut donner à chaque élément dont on veut récuperer les valeurs l'attribut name   .
  3. Pour récupérer les valeurs des variables, on y accède via la variable $_POST.
  • $_POST['nom'] .     à la valeur du nom entré ;   
  • $_POST['prenom'] .  à la valeur du prénom entré ;

 

<!doctype html>\n<html>\n<head>\n  <title>\n   PHP - Exemple 4 - Méthode POST Fichier HTML\n  </title>\n  <meta charset=\"utf-8\"/>\n </head>\n <body>\n <h1> PHP - Exemple 4 - Méthode POST Fichier HTML</h1>\n  <form action=\"ex4-PHP.php\" method=\"post\">\n  <label for=\"nom\">Votre Nom :</label>  \n  <input type=\"text\" name=\"nom\"> \n  <div> et </div> \n  <label for=\"prenom\">Votre Prénom :</label>\n  <input type=\"text\" name=\"prenom\">\n  <input type=\"submit\" value=\"Valider\">\n  </form>\n</body>\n</html>\n

 

<!doctype html>\n<html>\n<head>\n  <title>\n   PHP - Exemple 4 - Méthode POST Fichier PHP\n  </title>\n  <meta charset=\"utf-8\"/>\n </head>\n <body>\n <h1> PHP - Exemple 4 - Méthode POST Fichier PHP </h1>\n <?php \n // les variables existent-t-elles ?\n if(isset($_POST['nom']) and isset($_POST['prenom']))\n {// oui les variables existent \n    $lenom=$_POST['nom'];\n    $leprenom=$_POST['prenom'];\n    //echo \"<p>Bonjour $_POST['prenom']   et $_POST['nom'] !</p>\" ;\n    echo \"<p>Bonjour $leprenom    $lenom</p>\" ;\n }\n else\n {\n\techo \"<p>Bonjour Madame ou Monsieur.</p>\" ;\n }\n ?> \n</body>\n

 

 


"},{"edit":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

Exercice 5
Reprendre les exercices 3 et 4 mais en utilisant la méthode POST et un formulaire.
Toute amélioration est la bienvenue.

 


"},{"edit":"

Mettre le résultat ici (code et figure).

"},{"solution":"

Mettre le résultat ici (code et figure).

"}],[{"text":"

Exercice 6 : un QCM
1. Ecrire deux pages, la première contenant un QCM avec au moins trois questions.
2. Les réponses seront proposées et l'utilisateur devra faire son choix par des cases à cocher.
3. La seconde page affichera le score obtenu.
Aide : Pour récupérer l'information \"case cochée, c'est assez simple : la variable n'existe dans le post que si la case a été cochée.
Toute amélioration est la bienvenue.


"},{"edit":"

Mettre le résultat ici (code et figure).

"},{"solution":"

Mettre le résultat ici (code et figure).

"}]]

En poursuivant votre navigation sur mon site, vous acceptez l’utilisation des Cookies et autres traceurs  pour réaliser des statistiques de visites et enregistrer sur votre machine vos activités pédagogiques. En savoir plus.