From 8be08b2f3d7d89f450b4eca058961680cacff69d Mon Sep 17 00:00:00 2001 From: SphinxKnight Date: Thu, 11 Nov 2021 08:13:17 +0100 Subject: Fix markdown conversion errors (#3018) --- files/fr/web/guide/ajax/community/index.html | 4 +-- files/fr/web/guide/ajax/getting_started/index.html | 34 +++++++++++----------- files/fr/web/guide/ajax/index.html | 6 ++-- 3 files changed, 20 insertions(+), 24 deletions(-) (limited to 'files/fr/web/guide/ajax') diff --git a/files/fr/web/guide/ajax/community/index.html b/files/fr/web/guide/ajax/community/index.html index da36f8abca..935a72879e 100644 --- a/files/fr/web/guide/ajax/community/index.html +++ b/files/fr/web/guide/ajax/community/index.html @@ -10,6 +10,4 @@ original_slug: Web/Guide/AJAX/Communauté

Si vous connaissez d'autres listes de diffusion, newsgroups, forums ou d'autres communautés ayant trait à AJAX, n'hésitez pas à ajouter un lien ci-dessous.

http://www.ajaxlines.com (anglais) - Très grosse collection de ressources AJAX, de tutoriels, d'outils et de sites web sur le sujet.

http://www.ajaxmatters.com - Portail d'informations sur AJAX et les technologies Web associées (anglais). -


-Liens Interwikis -

{{ languages( { "en": "en/AJAX/Community", "ja": "ja/AJAX/Community" } ) }} +

\ No newline at end of file diff --git a/files/fr/web/guide/ajax/getting_started/index.html b/files/fr/web/guide/ajax/getting_started/index.html index 703af2bb55..9aa61def8d 100644 --- a/files/fr/web/guide/ajax/getting_started/index.html +++ b/files/fr/web/guide/ajax/getting_started/index.html @@ -8,7 +8,7 @@ original_slug: Web/Guide/AJAX/Premiers_pas ---

Cet article vous guide à travers les bases d’AJAX et vous donne deux exemples clefs-en-main pour débuter.

-

Présentation d’AJAX

+

Présentation d’AJAX

AJAX est un raccourci pour Asynchronous JavaScript And XML (JavaScript asynchrone et XML) inventé par Jesse James Garrett. Pour simplifier, il s’agit d’employer l’objet XMLHttpRequest pour communiquer avec des serveurs. Il peut envoyer et recevoir des informations sous différents formats, dont JSON, XML, HTML ou texte. Son principal attrait est sa nature « asynchrone » ce qui signifie qu’il peut communiquer avec le serveur, échanger des données et mettre à jour la page sans avoir à la recharger.

@@ -19,7 +19,7 @@ original_slug: Web/Guide/AJAX/Premiers_pas
  • recevoir et travailler avec des données provenant du serveur.
    • -

    Étape 1 — Lancement d’une requête HTTP

    +

    Étape 1 — Lancement d’une requête HTTP

    Pour faire une requête HTTP vers le serveur à l’aide de JavaScript, il faut disposer d’une instance d’objet fournissant cette fonctionnalité. C’est ici que XMLHttpRequest intervient. Son prédécesseur est originaire de Internet Explorer sous la forme d’un objet ActiveX appelé XMLHTTP. Par la suite, Mozilla, Safari et d’autres navigateurs ont suivi en implémentant un objet XMLHttpRequest qui fournit les mêmes méthodes et propriétés que l’objet ActiveX original de Microsoft. Entre temps, Microsoft a également implémenté XMLHttpRequest.

    @@ -31,8 +31,8 @@ else if (window.ActiveXObject) { // IE 6 et antérieurs httpRequest = new ActiveXObject("Microsoft.XMLHTTP"); } -
    -

    Note : Pour illustrer le principe, le code ci-dessus est une version un peu simplifiée de celui qui est utilisé pour créer une instance XMLHTTP. Pour un exemple plus réaliste, voir l’étape 3 de cet article.

    +
    +

    Note : Pour illustrer le principe, le code ci-dessus est une version un peu simplifiée de celui qui est utilisé pour créer une instance XMLHTTP. Pour un exemple plus réaliste, voir l’étape 3 de cet article.

    Après avoir fait une requête, vous recevrez une réponse du serveur. À ce stade, vous devez indiquer à l’objet httpRequest le nom de la fonction JavaScript qui traitera la réponse. Pour cela, assignez à la propriété onreadystatechange de l’objet le nom de la fonction JavaScript que vous envisagez d’utiliser, comme ceci :

    @@ -68,7 +68,7 @@ httpRequest.send(); 
    httpRequest.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    -

    Étape 2 — Gestion de la réponse du serveur

    +

    Étape 2 — Gestion de la réponse du serveur

    Lors de l’envoi de la requête, vous avez désigné une fonction JavaScript pour traiter la réponse.

    @@ -112,7 +112,7 @@ httpRequest.send();

    Notez que les étapes ci-dessus sont valides uniquement si vous utilisez une requête asynchrone (Le 3e paramètre d’open() n’a pas été spécifié, ou a été défini à true). Si vous utilisez une requête synchrone, vous n’avez pas besoin de spécifier une fonction, mais c’est fortement découragé car cela entraîne une mauvaise expérience utilisateur.

    -

    Étape 3 — Un exemple simple

    +

    Étape 3 — Un exemple simple

    Rassemblons tous ces éléments dans un exemple : une requête HTTP simple. Notre JavaScript demande un document HTML, test.html, qui contient le texte « Je suis un test. », puis nous affichons le contenu de la réponse dans un message alert(). Remarquez que cet exemple n’utilise que du pur JavaScript vanilla (pas de jQuery). D’autre part, les fichiers HTML, XML et PHP doivent être placés dans le même dossier.

    @@ -156,16 +156,16 @@ httpRequest.send();
  • alertContents() vérifie si la réponse reçue est correcte, et affiche ensuite le contenu du fichier test.html dans un message alert().
    • -
    -

    Note : Si vous envoyez une requête à du code qui renvoie du XML plutôt qu’un fichier HTML statique, vous devez spécifier des en-têtes de réponse pour que cela fonctionne avec Internet Explorer. Si vous ne spécifiez pas l’en-tête Content-Type: application/xml, IE émettra une erreur JavaScript « Objet attendu » après la ligne à laquelle vous avez tenté d’accéder à l’élément XML.

    +
    +

    Note : Si vous envoyez une requête à du code qui renvoie du XML plutôt qu’un fichier HTML statique, vous devez spécifier des en-têtes de réponse pour que cela fonctionne avec Internet Explorer. Si vous ne spécifiez pas l’en-tête Content-Type: application/xml, IE émettra une erreur JavaScript « Objet attendu » après la ligne à laquelle vous avez tenté d’accéder à l’élément XML.

    -
    -

    Note 2 : Si vous ne spécifiez pas l’en-tête Cache-Control: no-cache, le navigateur mettra la réponse en cache et n’effectuera plus jamais la requête ultérieurement, ce qui peut rendre le débogage difficile. Vous pouvez également ajouter un paramètre GET toujours différent, comme un timestamp ou un nombre aléatoire (voir contourner le cache).

    +
    +

    Note : Si vous ne spécifiez pas l’en-tête Cache-Control: no-cache, le navigateur mettra la réponse en cache et n’effectuera plus jamais la requête ultérieurement, ce qui peut rendre le débogage difficile. Vous pouvez également ajouter un paramètre GET toujours différent, comme un timestamp ou un nombre aléatoire (voir contourner le cache).

    -
    -

    Note 3 : Si la variable httpRequest est utilisée globalement, des appels concurrents à makeRequest() peuvent s’écraser l’un l’autre, provoquant une situation de compétition (race condition). On peut s’en prémunir en déclarant la variable httpRequest locale à une closure contenant les fonctions AJAX.

    +
    +

    Note : Si la variable httpRequest est utilisée globalement, des appels concurrents à makeRequest() peuvent s’écraser l’un l’autre, provoquant une situation de compétition (race condition). On peut s’en prémunir en déclarant la variable httpRequest locale à une closure contenant les fonctions AJAX.

    Si une erreur de communication se produit (par exemple le serveur qui cesse de répondre), une exception sera levée dans la méthode onreadystatechange lors de l’accès à la propriété status. Pour atténuer ce problème, vous pouvez entourer votre bloc if...then dans un try...catch :

    @@ -185,9 +185,9 @@ httpRequest.send(); } } -

    Étape 4 — Travailler avec des réponses XML

    +

    Étape 4 — Travailler avec des réponses XML

    -

    Dans l’exemple précédent, après avoir reçu la réponse à la requête HTTP, nous avons utilisé la propriété responseText de l’objet, qui contenait le contenu du fichier test.html. Essayons maintenant la propriété responseXML.

    +

    Dans l’exemple précédent, après avoir reçu la réponse à la requête HTTP, nous avons utilisé la propriété responseText de l’objet, qui contenait le contenu du fichier test.html. Essayons maintenant la propriété responseXML.

    Tout d’abord, créons un document XML valide qui sera l’objet de la requête. Le document (test.xml) contient ce qui suit :

    @@ -213,9 +213,9 @@ alert(root_node.firstChild.data);

    Ce code prend l’objet XMLDocument donné par responseXML et utilise les méthodes du DOM pour accéder à des données contenues dans le document XML.

    -

    Catégories

    +

    Catégories

    -

    Interwiki

    +

    Interwiki

    Étape 5 – Manipuler les données

    @@ -226,7 +226,7 @@ alert(root_node.firstChild.data); 
    <label>Vore nom :
   <input type="text" id="ajaxTextbox" />
 </label>
-<span id="ajaxButton" style="cursor: pointer; text-decoration: underline">
+<span id="ajaxButton">
   Lancer une requête
 </span>
    diff --git a/files/fr/web/guide/ajax/index.html b/files/fr/web/guide/ajax/index.html index a7e13ac33a..1cfc6f249b 100644 --- a/files/fr/web/guide/ajax/index.html +++ b/files/fr/web/guide/ajax/index.html @@ -3,8 +3,6 @@ title: AJAX slug: Web/Guide/AJAX translation_of: Web/Guide/AJAX --- -
    Premiers pas
    -Une introduction à AJAX

    AJAX (Asynchronous JavaScript + XML) n'est pas une technologie en soi, mais un terme désignant une « nouvelle » approche utilisant un ensemble de technologies existantes, dont : HTML ou XHTML, les feuilles de styles CSS, JavaScript, le modèle objet de document (DOM), XML, XSLT, et l'objet XMLHttpRequest. Lorsque ces technologies sont combinées dans le modèle AJAX, les applications Web sont capables de réaliser des mises à jour rapides et incrémentielles de l'interface utilisateur sans devoir recharger la page entière du navigateur. Les applications fonctionnent plus rapidement et sont plus réactives aux actions de l'utilisateur.

    @@ -13,7 +11,7 @@ Une introduction à AJAX

    S'il n'y a pas de "bonne réponse", quelques éléments généraux sont à garder à mémoire : 

      -
    • La méthode AJAX peut être résumée comme un compromis : elle évite un rechargement complet de la page mais n'autorise pas davantage que ce qu'apporte une requête HTTP GET ou POST (ou HEAD) classique. Les échanges sont plutôt lourds car, même pour peu d'éléments, le navigateur doit envoyer des entêtes et négocier la transaction. 
      +
    • La méthode AJAX peut être résumée comme un compromis : elle évite un rechargement complet de la page mais n'autorise pas davantage que ce qu'apporte une requête HTTP GET ou POST (ou HEAD) classique. Les échanges sont plutôt lourds car, même pour peu d'éléments, le navigateur doit envoyer des entêtes et négocier la transaction. 
      La méthode est alors intérressante pour tous les sites où le contenu est changé peu fréquemment et reste prévisible : un blog, un forum, etc. où c'est l'utilisateur qui décide de changer le contenu (le serveur ne peut pas être à l'initiative, sauf à faire des requêtes régulièrement mais il serait alors préférable de passer par les WebSockets). 
    • La méthode AJAX a comme qualité de rester dans les standards HTTP, en plus d'être du côté client : c'est donc une méthode qui est totalement transparente dans les échanges standards entre un client et un serveur, donc avec tous les langages de programmes qui supportent une connexion socket classique. C'est important à garder à l'esprit dans des environnements mixtes : un serveur Apache / PHP pour la génération de pages maîtresses et un contenu déployé dans un autre langage.
      Ne pas confondre possible et souhaitable : AJAX peut négocier avec plusieurs domaines différents ou (des ports différents dans un même domaine). Cependant pour des raisons de sécurité les possibilités sont restreintes voire impossibles. La méthode AJAX est donc dépendante de ce qu'autorise ou permet le navigateur du client. 
      • @@ -21,7 +19,7 @@ Une introduction à AJAX
    Cependant AJAX rencontre aussi les difficultés liées à la grande hétérogénité des navigateurs (implantation différente de JS, donc in fine des possibilités AJAX), des règles de sécurité, etc. Comme pour CSS, AJAX peut être vu comme un "plus" dans la navigation (voir le principe de dégradation élégante) mais ne doit pas être vu comme une finalité au risque, sinon, de se couper d'une partie des utilisateurs.  - +
    -- cgit v1.2.3-54-g00ecf