Introduction à AJAX

Ajax est un ensemble de technologies, soutenu par un web browser, y compris les éléments suivants :
 

• HTML et CSS pour la présentation.
• Javascript (ECMAScript) pour le traitement local, et DOM (modèle d'objet de document) pour accéder à des données à l'intérieur de la page ou pour accéder à l'élément du dossier de XML lu sur le serveur (avec la méthode de getElementByTagName par exemple)…
• La classe de XMLHttpRequest lit ou envoie des données sur le serveur asynchronously.

Ajax emploie un modèle de programmation avec des affichages et des événements. Ces événements sont des actions d'utilisateur, ils appellent des fonctions associées à l'élément de la page Web.
Interactif est réalisé avec des formes et des boutons. DOM laisse lier des éléments de la page avec des actions et extraire également des données à partir des dossiers de XML fournis par le serveur.
Pour obtenir des données sur le serveur, XMLHttpRequest fournit deux méthodes est comme suit :
- s'ouvrir : créer un raccordement.
- envoyer : envoyer une demande au serveur.
Des données meublées par le serveur seront trouvées dans les attributs de l'objet de XMLHttpRequest :
- responseXml pour un dossier de Xml ou
- responseText pour un texte simple.

Prendre la note qu'un nouvel objet de XMLHttpRequest doit être créé pour le chaque de nouveaux dossiers à charger.

Nous devons attendre les données pour être disponibles pour le traiter, et dans ce but, l'état d'availabile des données est donné par l'attribut de readyState de XMLHttpRequest.

Les états de readyState suivent :
0 : non initialisé.
1 : le raccordement etablished.
2 : demande reçue.
3 : réponse dans le processus.
4 : fini.

Dhtml a le même but qu'Ajax, un ensemble de normes :
- HTML,
- CSS,
- Javascript.

Le but d'Ajax est celui de donner l'illusion que les sites Web sont sensibles. Il réalise ceci par le traitement des demandes qui comporte l'envoi et la réception de petits paquets des données sans régénérer le web browser. Ajax est fondé dessus :

• XHTML - Un sous-ensemble rigide vers le haut dont de HTML est employé pour marquer ou pour dénommer l'information.
• DOM - Le modèle d'objet de document qui peut être accédé par le navigateur de client.
• XMLHttpRequest - l'objet qui est employé pour échanger l'information asynchronously.
• XML - Le format qui est employé pour transférer les données à partir du serveur au client.

L'utilisation de technique d'Ajax une combinaison de :

• XHTML (ou HTML) et CSS, pour marquer vers le haut et dénommer l'information.
• Le DOM a accédé avec une langue scripting de client-côté, particulièrement exécution d'ECMAScript telle que le Javascript et JScript, dynamiquement aux affichages et agit l'un sur l'autre avec l'information présentée.
• Le XMLHttpRequest est un objet qui est employé pour échanger des données asynchronously avec le web server. Dans un certain cadre d'Ajax et dans certaines situations, un IFrameobject est employé au lieu de l'objet de XMLHttpRequest pour échanger des données avec le web server, et dans d'autres réalisations, a dynamiquement ajouté l'étiquette de <script> peut être employé.
• XML est parfois employé comme format pour des données de transfert entre le client et le serveur, bien que n'importe quel format fonctionne, y compris le HTML préformaté, le texte plat, EBML ces dossiers peut être créé dynamiquement par une certaine forme du serveur-côté scripting.

En produisant du HTML localement dans le navigateur, et en l'apportant seulement en bas des appels de Javascript et des données réelles des pages Web d'Ajax peut sembler charger rapidement puisque la charge utile descendant est beaucoup plus petite dans la taille. Un exemple de cette technique est de grands résultats réglés où les pages multiples des données existent. Avec Ajax, le HTML de la page, par exemple, une commande de table et une étiquette relative de TD et de TR peut être produit localement dans le navigateur et ne pas être réduit avec la première page des données. Si le clic d'utilisateur d'autres pages, seulement les données est apporté, et peuplé dans le HTML se produisait dans le navigateur.

L'application d'Ajax est principalement exécutée sur la machine de l'utilisateur, en manoeuvrant la page courante dans leur navigateur en utilisant des méthodes de modèle d'objet de document. Ajax peut être employé pour une multitude de charge comme mettre à jour ou supprimer des disques ; formes de extension de Web ; questions simples de renvoi de recherche ; ou éditant la catégorie arbre-toute en dehors la condition de chercher une pleine page de HTML chaque fois que un changement est fait. Généralement seulement de petites demandes doivent être envoyées au serveur, et des réponses relativement courtes sont renvoyées. Ceci permet le développement d'une application plus interactive comportant des interfaces utilisateur plus sensibles dues à l'utilisation des techniques de DHTML

Les applications de Web qui utilisent Ajax peuvent casser le comportement prévu du navigateur en arrière se boutonnent. La différence entre le renvoi à un état précédent du courant, page dynamiquement modifiée contre aller de nouveau à une page statique précédente pourrait être la subtile, mais les utilisateurs comptent généralement que cliquer le bouton arrière dans des applications de Web déplacera leur navigateur à la dernière page qu'il a chargée, et en applications d'Ajax ceci ne pourrait pas être le cas.

Une autre question est que la mise à jour dynamique de pages Web le rendent difficile pour qu'un utilisateur bookmark un état particulier de l'application. Les solutions à ce problème existent, beaucoup dont utilisation la marque de fragment d'URL (la partie d'un URL après que le « # ») de maintenir, et de permettre à des utilisateurs de retourner à, l'application dans un état donné. C'est possible parce que beaucoup de navigateurs permettent au Javascript de mettre à jour la marque de fragment de l'URL dynamiquement, de sorte que les applications d'Ajax puissent le maintenir pendant que l'utilisateur change l'état de l'application. Cette solution améliore également l'appui d'en arrière-bouton. C'est, cependant, pas une solution complète.

T il intervalle entre la demande d'utilisateur et la réponse de serveur ou la latence de réseau doit être considéré soigneusement pendant le développement d'Ajax. Sans rétroaction claire à l'utilisateur, preloading futé des données et manipulation appropriée de l'objet de XMLHttpRequest, l'utilisateur pourrait éprouver retardent dans l'interface de l'application de Web, quelque chose que les utilisateurs ne pourraient pas prévoir ou comprendre. En plus, quand une page entière est rendue il y a de brefs moments du rajustement pour l'oeil quand le contenu change. Le manque de ce rajustement avec de plus petites parties des marques changeantes d'écran la latence plus évidente. L'utilisation de la rétroaction visuelle (telle que des throbbers) d'alerter l'utilisateur de l'activité de fond et/ou preloading du contenu et des données sont souvent les solutions suggérées à ces questions de latence. En général l'impact potentiel de la latence « n'a pas été résolu » par les trousses à outils ouvertes l'unes des d'Ajax de source et l'aujourd'hui disponible de cadre, tel que l'effet du temps fini de désaccord de latence.

Avant que vous continuiez vous devriez avoir un certain arrangement de base de la langue suivante :

• HTML/XHTML
• CSS
• XML
• Javascript

Si vous voulez étudier ce premier soumis, trouver les cours d'instruction sur notre page d'accueil.