prog_internet/prog_internet_06.xhtml

   1 <?xml version="1.0" encoding="utf-8" ?>
   2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   3           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
   4           >
   5 <html xmlns="http://www.w3.org/1999/xhtml" >
   6   <head>
   7     <title>PHP : Introduction</title>
   8
   9     <meta http-equiv="Content-Type"
  10           content="text/html; charset=utf-8" />
  11     <meta name="copyright"
  12           content="Copyright &#169; 2013 Kim Nguyễn" />
  13
  14     <!-- Load jQuery -->
  15     <script src="../jquery-1.9.1.min.js" type="text/javascript" ></script>
  16     <!-- Load the library -->
  17     <script src="../simpleWebSlides.js" type="text/javascript" ></script>
  18
  19     <link rel="stylesheet" href="../simpleWebSlides.css" type="text/css"  media="all" />
  20     <!-- Load a custom Theme, the class-element marks this style-sheet
  21          a "theme" that can be swtiched dynamicaly -->
  22     <link class="sws-theme" rel="stylesheet"  title="U-Psud style"  href="../themes/uPsud.css" type="text/css" />
  23
  24     <!-- Customize some templates and initialize -->
  25
  26     <script type="text/javascript">
  27       SWS.Config['sws-slide-change'] = SWS.Effects.slideChangeFadeOutIn;
  28       SWS.Config['sws-object-deactivate'] =  SWS.Effects.objectDeactivateFadeOut;
  29       SWS.Config['sws-object-activate'] = SWS.Effects.objectActivateFadeIn;
  30
  31       //Ensures that we load SWS at the very end, after MathJax has
  32       //been initialized
  33
  34       $(window).load(SWS.Presentation.init);
  35     </script>
  36   </head>
  37   <body>
  38     <a href="prog_internet_05.xhtml" class="sws-previous"/>
  39
  40     <div class="sws-slide sws-cover sws-option-nofooter">
  41       <h1>Programmation Internet</h1>
  42       <h1>Cours 6</h1>
  43       <a href="mailto:kn@lri.fr">kn@lri.fr</a><br/>
  44       <a href="http://www.lri.fr/~kn/">http://www.lri.fr/~kn</a>
  45     </div>
  46
  47     <h1>Introduction et généralités</h1>
  48
  49     <div class="sws-slide">
  50       <h1>Avant PHP</h1>
  51       <p>Constat: besoin de pages Web <em>dynamiques</em> (contenu
  52        généré au chargement de la page)<br/>
  53         Première solution: scripts (ou programmes) <em>CGI</em><br/>
  54         <code>             http://www.example.com/foo.cgi?sort=alpha</code>
  55       </p>
  56       <ol>
  57         <li>Programme écrit dans n'importe quel langage et exécuté par
  58         le serveur Web</li>
  59         <li>Le serveur passe les infos au programme par
  60         des <em>variables d'environnement</em> et <em>l'entrée
  61         standard</em></li>
  62         <li>Le programme génère une page Web par affichage sur la
  63         sortie standard</li>
  64       </ol>
  65       <p class="sws-pause">Inconvénients</p>
  66       <ol>
  67         <li>Communication difficile entre le serveur Web et le
  68         programme</li>
  69         <li>Les langages généralistes <em>ne sont pas faits pour le
  70         Web</em> (pas de support d'HTML nativement par exemple)</li>
  71       </ol>
  72     </div>
  73
  74     <div class="sws-slide">
  75       <h1>PHP (Avantages)</h1>
  76       <ul>
  77         <li> <em>Langage utilisé côté serveur</em> : le navigateur ne
  78         « voit » jamais de PHP, uniquement du HTML (comportement
  79         indépendant du navigateur)</li>
  80         <li> <em>Langage interprété</em> : on ne génère pas de
  81           binaire, déploiment facile (on copie les fichiers sur le
  82           serveur)</li>
  83         <li> <em>Intégration avec HTML</em> : PHP supporte
  84         des <em><i>templates</i></em> (modèles/patrons) HTML contenant
  85         du PHP</li>
  86       </ul>
  87       <p>Exemple: fichier <tt>heure.php</tt> : </p><code><![CDATA[      <html>
  88         <head><title>Heure</title></head>
  89         <body>
  90           <h1>L'heure</h1>
  91           <p>Il est ]]><span style="color:orange;">&lt;?php echo date('H:i:s'); ?&gt;</span> <![CDATA[</p>
  92         </body>
  93       </html>]]></code>
  94     </div>
  95     <div class="sws-slide">
  96       <h1>PHP</h1>
  97       <ul>
  98         <li>On compte 140,000,000 de noms de domaines enregistrés</li>
  99         <li>On estime à environ 20,000,000 le nombre de sites faits en
 100         PHP</li>
 101         <li>Quelques gros sites:
 102           <ul><li>Facebook</li>
 103             <li>Portail Yahoo!</li>
 104             <li>Flickr</li>
 105             <li>Digg</li>
 106             <li>Wikipedia</li>
 107           </ul>
 108         </li>
 109       </ul>
 110     </div>
 111     <div class="sws-slide">
 112       <h1>Principe</h1>
 113       <ul>
 114         <li class="sws-onframe-1-5">Le serveur Web crée un fichier temporaire. Il copie le
 115         contenu de <tt>heure.php</tt> jusqu'à trouver la balise <tt style="color:orange">&lt;?php</tt>
 116         </li>
 117         <li  class="sws-onframe-2-5">Le code se trouvant
 118         entre  <tt style="color:orange">&lt;?php</tt>
 119         et  <tt style="color:orange">?&gt;</tt> est exécuté.</li>
 120         <li  class="sws-onframe-3-5">Tout ce que le code écrit
 121         (instruction <tt style="color:orange">echo</tt>) est aussi
 122         copié dans le fichier temporaire</li>
 123         <li  class="sws-onframe-4-5">Le serveur web reprend la copie du fichier
 124         après <tt style="color:orange">?&gt;</tt>
 125         </li>
 126         <li  class="sws-onframe-5">Le serveur renvoie le contenu du fichier temporaire comme
 127         page au client</li>
 128       </ul>
 129       <div class="sws-onframe-0-5" style="background:white;margin:0% 5%;border:solid 1pt gray">
 130 <code><span class="sws-onframe-1-5"><![CDATA[      <html>
 131         <head><title>Heure</title></head>
 132         <body>
 133           <h1>L'heure</h1>
 134           <p>Il est ]]></span><span class="sws-onframe-3-5"
 135           style="color:orange;">15:53:00</span><span class="sws-onframe-4-5"> <![CDATA[</p>
 136         </body>
 137       </html>]]></span></code>
 138       </div>
 139     </div>
 140
 141     <div class="sws-slide">
 142       <h1>PHP (inconvénients)</h1>
 143       <ol><li>Génère du HTML via <tt><em>echo</em></tt> (débuggage
 144       difficile)</li>
 145         <li>Interprété : problème de performances si beaucoup de
 146         clients</li>
 147         <li><em><b>NON TYPÉ</b></em> : <em style="color:red">C'est
 148         HORRIBLE</em></li>
 149       </ol>
 150       <p>Devinette : qu'affiche l'instruction suivante ? (on ne
 151       connaît pas encore PHP mais on peut utiliser son intuition)</p>
 152       <code>   echo 013 + "013 c'est en fait 11 en base 8"; </code>
 153       <ul style="background:white">
 154         <li>013</li>
 155         <li>13</li>
 156         <li>013 c'est en fait 11 en base 8</li>
 157         <li>013013 c'est en fait 11 en base 8</li>
 158         <li>13013 c'est en fait 11 en base 8</li>
 159         <li><span style="position:relative;"> <span class="sws-onframe-0"
 160         style="position:absolute;
 161         left:0;">24</span><span class="sws-onframe-1-2"
 162         style="position:absolute;
 163         left:0;"><em>24&nbsp;&#10004;&#10004;&#10004;</em></span></span></li>
 164         <li>une erreur</li>
 165         <li>autre chose</li>
 166       </ul>
 167     </div>
 168     <h1>Types de base et expressions simples</h1>
 169     <div class="sws-slide">
 170       <h1>Entiers (<tt>integer</tt>)</h1>
 171       <p>Les entiers ont une taille fixe (généralement 32bits) : </p>
 172       <table class="desc">
 173         <tr><td>Notation décimale</td><td>10, 3444, -25, 42,
 174         …</td></tr>
 175         <tr><td>Notation binaire</td><td>0b10, -0b10001010,
 176         …</td></tr>
 177         <tr><td>Notation octale</td><td>0755, -01234567, …</td></tr>
 178         <tr><td>Notation hexadécimale</td><td>0x12b, -0xb00b5,
 179         0xd34db33f, …</td></tr>
 180       </table>
 181       <p>Opérateurs arithmétiques : </p>
 182       <table class="desc">
 183         <tr><td>-</td><td> « Moins » unaire </td></tr>
 184         <tr><td>+, -, *, % </td><td>addition, soustraction, produit, modulo</td></tr>
 185         <tr><td><span style="color:red">/</span></td><td>Division. Si
 186         <tt>x</tt> et <tt>y</tt> sont des entiers et que <tt>y</tt>
 187         divise <tt>x</tt> alors <tt>x/y</tt> renvoie
 188         un <em style="color:red">entier</em> sinon <tt>x/y</tt> renvoie
 189         un <em style="color:red">flottant</em>!
 190         </td></tr>
 191         </table>
 192     </div>
 193     <div class="sws-slide">
 194       <h1>Booléens (<tt>boolean</tt>)</h1>
 195       <table class="desc">
 196         <tr><td>TRUE/FALSE</td><td>vrai/faux (en majuscules)</td></tr>
 197       </table>
 198       <p>Opérateurs logiques :</p>
 199       <table class="desc">
 200         <tr><td>!</td><td> négation (unaire) </td></tr>
 201         <tr><td>&amp;&amp;, || </td><td>« et » logique, « ou » logique</td></tr>
 202       </table>
 203     </div>
 204     <div class="sws-slide">
 205       <h1>Flottants (<tt>float</tt>)</h1>
 206       <table class="desc">
 207         <tr><td>Notation scientifique</td><td>1.3, 0.99, 00.34e102, -2313.2313E-23,
 208         …</td></tr>
 209       </table>
 210       <p>Opérateurs arithmétiques : </p>
 211       <table class="desc">
 212         <tr><td>-</td><td> « Moins » unaire </td></tr>
 213         <tr><td>+, -, *, /, % </td><td>opérations standard</td></tr>
 214         <tr><td>abs, sin, cos, sqrt, pow, …</td><td>fonctions
 215           mathématiques pré-définies     </td></tr>
 216     </table>
 217     </div>
 218     <div class="sws-slide">
 219       <h1>Variables, affectations</h1>
 220       <ul>
 221         <li>Un nom de variable commence toujours
 222         par <tt><em>$</em></tt></li>
 223         <li>Pas besoin de donner le type, l'affectation détermine le
 224         type</li>
 225       </ul>
 226       <p>Exemples :</p>
 227       <code>     $foo = 123;
 228      $bar = 1323e99;
 229      $_toto = $bar;
 230 </code>
 231     </div>
 232     <div class="sws-slide">
 233       <h1>Chaînes de caractères (<tt>string</tt>)</h1>
 234       <table class="desc">
 235         <tr><td>Simples quotes</td><td> <tt>'foo'</tt>, <tt>'c\'est
 236               moi'</tt>, <tt>'Un antislash : \\'</tt>, …<br/>
 237             <em style="color:orange">Pas d'autre séquence d'échappement</em>
 238         </td></tr>
 239         <tr><td style="width:8em;">Doubles quotes</td><td><tt>"foo"</tt>, <tt>"c'est
 240         moi"</tt>, <tt>"Un retour chariot: \n"</tt>, <tt>"La variable
 241         \$toto contient: $toto"</tt><br/>
 242             <em style="color:orange">Les séquences d'échapement sont:
 243             \n, \t, \\, \&quot;, \$. Les variables (sous-chaînes
 244             commençant par un $) sont remplacées par leur valeur.
 245             </em>
 246           </td></tr>
 247       </table>
 248       <p>Opérations sur les chaînes : </p>
 249       <table class="desc">
 250         <tr><td>$foo[10]</td><td> accès au 11<sup>ème</sup> caractère </td></tr>
 251         <tr><td>$foo[10] = 'A';</td><td> mise à jour</td></tr>
 252         <tr><td> . </td><td>concaténation</td></tr>
 253         <tr><td>strlen</td><td>longueur</td></tr>
 254     </table>
 255     </div>
 256     <div class="sws-slide">
 257       <h1>Tableaux (<tt>array</tt>)</h1>
 258       <p>Les tableaux sont des tableaux <em>associatifs</em> : </p>
 259       <table class="desc" >
 260         <tr><td>array()</td><td>crée un tableau vide</td></tr>
 261         <tr><td style="width:14.5em;">array(<tt>k<sub>1</sub> => v<sub>1</sub>, …,
 262         k<sub>n</sub> => v<sub>n</sub> </tt>)</td>
 263           <td>créé un nouveau tableau pour lequel
 264           l'entrée <tt>k<sub>i</sub></tt> est associée à la
 265           valeur <tt>v<sub>i</sub></tt>
 266             </td>
 267           </tr>
 268         <tr><td>array(<tt>v<sub>1</sub>, …,  v<sub>n</sub> </tt>)</td>
 269           <td>créé un nouveau tableau pour lequel
 270             l'entier <tt>i-1</tt>
 271           valeur <tt>v<sub>i</sub></tt>
 272             </td>
 273           </tr>
 274       </table>
 275       <p>Quelques fonctions : </p>
 276       <table class="desc" style="background:white;">
 277         <tr><td style="width:7em;">count</td><td> taille du tableau (nombre d'éléments)</td></tr>
 278         <tr><td>sort, rsort</td><td> trie un tableau (<tt>rsort</tt> trie par
 279         ordre décroissant) par valeurs. Les clés sont supprimées et
 280         de nouvelles clées de 0 à longueur - 1 sont crées</td></tr>
 281         <tr><td>ksort, krsort</td><td>trie un tableau par
 282         clés</td></tr>
 283         <tr><td>print_r</td><td>affiche un tableau (ne pas utiliser <tt>echo</tt>)</td></tr>
 284     </table>
 285     </div>
 286     <div class="sws-slide">
 287       <h1>Tableaux (exemples)</h1>
 288             <code>        $tab1 = <em>array()</em>; //tableau vide
 289         $tab2 = <em>array("zero", "un", "deux", "trois");</em>
 290         $tab3 = <em>array("pi" => 3.14159, "e" => 2.71828; "phi" => 1.61803)</em>;
 291         echo <em>$tab2[0]</em>; //affiche zero
 292         echo <em>$tab3["phi"]</em>; //affiche 1.61803
 293         <em>$tab1["dix"] = 10</em>; //affectation
 294         <em>sort($tab2)</em>;
 295         echo <em>$tab2[0]</em>;//affiche deux
 296         <em>sort($tab3)</em>;
 297         echo $tab3[0]; //affiche 1.61803
 298         echo $tab3[1]; //affiche 2.71828
 299         echo $tab3[2]; //affiche 3.14159
 300         echo <em>count($tab2)</em>; //affiche 4 </code>
 301     </div>
 302     <div class="sws-slide">
 303       <h1>NULL</h1>
 304       <p><em>NULL</em> est une <em>constante</em> spéciale, de
 305       type <em>NULL</em>. C'est la valeur d'une variable non déclarée
 306       ou d'un accès invalide dans un tableau.</p>
 307       <code>        $a = $b;  // $b n'est pas déclarée, $a reçoit NULL
 308         $c = $tab["toto"]; // $tab existe mais n'a pas de valeur
 309                            // associée à la clé "toto", $c reçoit NULL
 310       </code>
 311     </div>
 312     <div class="sws-slide">
 313       <h1>Conversions de types</h1>
 314       <p><span style="color:red;">☠☢☣☹</span> :
 315 les conversions se
 316       font <em style="color:red;">implicitement</em>, en fonction du
 317       contexte.
 318       </p>
 319       <table class="desc">
 320         <tr> <td style="width:5em;">Booléen</td> <td>0, 0.0, "", "0", <tt>NULL</tt>, et le tableau
 321         vide sont convertis en <tt>FALSE</tt>, le reste
 322         en <tt>TRUE</tt> (en particulier "00" vaut <tt>TRUE</tt>
 323         ☹)</td> </tr>
 324         <tr><td>Entier</td><td> <tt>FALSE</tt> ⇝ 0, <tt>TRUE</tt> ⇝ 1,
 325         les flottants sont arrondis par partie entière (1.23242 ⇝
 326         1). Les chaînes <em style="color:red">dont un préfixe</em>
 327         est un entier sont converties en cet entier, sinon en 0 ("123
 328         bonjour" ⇝ 123) </td>
 329         </tr>
 330         <tr><td>Chaîne</td> <td> La chaîne contient la représentation
 331         de la valeur (<tt> 1 . "ABC" </tt>
 332         ⇝ <tt>"1ABC"</tt>). <tt>FALSE</tt> et <tt>NULL</tt> sont
 333         convertis en <tt>""</tt>, <tt>TRUE</tt> converti en <tt>"1"</tt></td></tr>
 334       </table>
 335       <p> La réponse à la devinette : 013 + "013 c'est 11 en octal" : </p>
 336       <ul style="background:white;">
 337         <li> 013  ⇝ notation octale pour l'entier décimal 11 </li>
 338         <li> "013 c'est 11 en octal" chaîne de caractères utilisées
 339         dans une addition (contexte entier), le préfixe "013" est
 340         transformé en <span style="color:red">décimal</span> 13</li>
 341         <li> 11 + 13  ⇝ 24 (ça au moins ça a du sens)</li>
 342       </ul>
 343
 344     </div>
 345     <div class="sws-slide">
 346       <h1>Comparaisons</h1>
 347       <p>Opérateurs de comparaisons</p>
 348       <table class="simple">
 349         <tr><td style="width:2em;"><em>Opérateur</em></td> <td style="width:13em;"><em>Description</em></td></tr>
 350         <tr><td><tt> $a == $b </tt></td> <td >Égal, après conversion
 351         de type     </td></tr>
 352         <tr><td><tt> $a != $b </tt></td> <td>Différent, après conversion
 353         de type
 354         </td></tr>
 355         <tr><td><tt> $a === $b </tt></td> <td>Égal et de même type
 356         </td></tr>
 357         <tr><td><tt> $a !== $b </tt></td> <td>Différent ou de type différent
 358         </td></tr>
 359         <tr><td><tt> $a &lt; $b </tt></td> <td>Strictement plus petit,
 360         après conversion de type
 361         </td></tr>
 362         <tr><td><tt> $a &gt; $b </tt></td> <td>Strictement plus grand,
 363         après conversion de type
 364         </td></tr>
 365         <tr><td><tt> $a &lt;= $b </tt></td> <td>Plus petit,
 366         après conversion de type
 367         </td></tr>
 368         <tr><td><tt> $a &gt;= $b </tt></td> <td>Plus grand,
 369         après conversion de type
 370         </td></tr>
 371         </table>
 372       <p>On comparera <em style="color:red;">TOUJOURS</em> des valeurs
 373       de <em style="color:red;">MÊME TYPE</em></p>
 374     </div>
 375     <div class="sws-slide">
 376       <h1>Affichage</h1>
 377       <p>On utilise l'instruction <tt><em>echo</em></tt> pour écrire
 378         du texte dans la page HTML résultante : </p>
 379       <table class="simple" border="1" style="margin-left:10vh; border-collapse:collapse;border-spacing: 2pt 2pt" >
 380         <tr style="boder-width:0pt 0pt 3pt 0pt;
 381                    border-color: gray;
 382                    border-style: solid " >
 383           <td  style="width: 10em;"><em>Code PHP</em></td>
 384           <td  style="width: 7em;" ><em>Code HTML</em></td>
 385           <td><em>Affichage dans le navigateur</em></td>
 386         </tr>
 387         <tr>
 388           <td><tt>echo "Hello";<br/>
 389               echo "World";</tt></td>
 390           <td> HelloWorld</td>
 391           <td>HelloWorld</td></tr>
 392         <tr>
 393         <td><tt>echo "Hello\n";<br/>
 394             echo "World";</tt></td>
 395         <td> Hello<br/>World</td>
 396         <td>Hello World</td></tr>
 397         <tr><td><tt>echo "Hello&lt;br/&gt;";<br/>
 398             echo "World";</tt></td>
 399         <td> Hello<tt>&lt;br/&gt;</tt>World</td>
 400         <td>Hello<br/>World</td></tr>
 401       </table>
 402     </div>
 403     <h1>Structures de contrôle</h1>
 404     <div class="sws-slide">
 405       <h1>Conditionnelle: <tt>if else</tt></h1>
 406       <code>
 407         <em>if (</em> c <em>) {</em>
 408                // cas then
 409         <em> } else { </em>
 410               // cas else
 411         <em>};</em>
 412       </code>
 413       <p>Les <em>parenthèses</em> autour de la condition <tt>c</tt> sont
 414           obligatoires. La branche <tt><em>else { … }</em></tt> est
 415           optionnelle. Les accolades sont optionnelles pour les blocs
 416           d'une seule instruction</p>
 417       </div>
 418       <div class="sws-slide">
 419         <h1>Boucles</h1>
 420         <div class="sws-pause">
 421           <code>     <em>while (</em> c <em>)  {</em>
 422         //corps de la boucle while
 423      <em>};</em></code>
 424         </div>
 425        <div class="sws-pause">
 426           <code>
 427      <em>do  {</em>
 428         //corps de la boucle do
 429      <em>} while (</em> c <em>);</em></code>
 430         </div>
 431
 432        <div class="sws-pause">
 433           <code>
 434      <em>for(init ; test ; incr)  {</em>
 435         //corps de la boucle for
 436      <em>};</em></code>
 437         </div>
 438        <div class="sws-pause">
 439           <code>
 440      <em>foreach($tab as $key => $val)  {</em>
 441         //corps de la boucle foreach
 442         //$tab est un tableau, $key une clé et $val la valeur associée
 443      <em>};</em></code>
 444         </div>
 445        <p style="background:white;">Remarque: <tt>ksort</tt> et <tt>krsort</tt> influencent
 446        l'ordre de parcours par une boucle <tt>foreach</tt></p>
 447       </div>
 448       <div class="sws-slide">
 449         <h1><tt>break</tt> et <tt>continue</tt></h1>
 450         <table class="desc">
 451           <tr><td><tt>break</tt></td>
 452             <td>sort de la boucle
 453           immédiatement</td> </tr>
 454           <tr> <td><tt>continue</tt></td> <td>reprend à l'itération
 455           suivante</td>
 456           </tr>
 457         </table>
 458         <code>
 459           for($i = 0; $i &lt; 10; $i = $i + 1){
 460               if ($i == 2 || $i == 4) continue;
 461               if ($i == 7) break;
 462               echo $i . ' ';
 463           }
 464           </code>
 465         <p>Affiche 0 1 3 5 6</p>
 466       </div>
 467       <h1>Passage de paramètres depuis une page</h1>
 468       <div class="sws-slide">
 469         <h1>Formulaire HTML (version simple)</h1>
 470         <p>L'élément <tt><em>&lt;form&gt;</em></tt> permet de créer des formulaires HTML. Un
 471 formulaire est constitué d'un ensemble de widgets (zones de saisies
 472 de textes, boutons, listes déroulantes, cases à cocher, ... ) et d'un
 473 bouton submit. Lorsque l'utilisateur appuie sur le bouton, les
 474 données du formulaires sont envoyées au serveur. Exemple, fichier
 475 <tt>age.html</tt> :</p>
 476 <code><![CDATA[
 477     <html>
 478       <body>
 479         <form method="get" action="calcul.php">
 480           Entrez votre année de naissance: <input type="text" name="val_age"/>
 481           <input type="submit" />
 482         </form>
 483       </body>
 484     </html>
 485     ]]></code>
 486 </div>
 487 <div class="sws-slide">
 488   <h1>Paramètres</h1>
 489   <p>
 490     Les paramètres envoyés au serveur web par la méthode <tt>get</tt>, sont
 491     accessibles en PHP dans la variable globale <tt><em>$_GET</em></tt>. C'est un tableau
 492     qui associe au nom d'un input sa valeur.
 493     Exemple : <tt>calcul.php</tt></p>
 494 <code><![CDATA[
 495       <html>
 496         <body>
 497           <?php
 498            echo "Vous êtes né il y a ";
 499            echo "<b>";
 500            echo date("Y") - ]]><em>$_GET["val_age"]</em><![CDATA[;
 501            echo "</b> ans";
 502            echo "<br/>";
 503            ?>
 504           </body>
 505      </html>
 506       ]]></code>
 507 </div>
 508   </body>
 509
 510 </html>