Ajax et services web
Notes de cours
- Ajax et services web
- Principes de la same-origin policy
- Utilisation de JSONP
- Utilisation de CORS
Travail personnel
Objectifs
Exercice 1 — Hiérarchie des lieux #
L'objectif de cet exercice est de manipuler les services web Geonames de hiérarchie des lieux. L'accès en HTTPS à Geonames est payant, et comme votre espace personnel n'est accessible qu'en HTTPS, la version de base ne peut pas fonctionner. Vous utiliserez donc un proxy local, dont voici la documentation.
Attention :
- Regarder et essayer « à la main » les différents services présentés sur la page.
- Faire une page HTML qui affiche en Ajax la liste des régions de France (
geonameId3017382). - Faire en sorte que cliquer sur un item remplace la liste courante par la liste des « fils » de cet item (par exemple, cliquer sur une région fait apparaître la liste des départements, etc.)
- Ajouter un bouton ou un lien pour permettre à l'internaute de remonter dans la hiérarchie à partir du lieu courant.
- Optionnel : ajouter un bouton ou un lien qui permet de lister les voisins géographiques du lieu courant.
- Optionnel : ajouter un champ texte, pour pouvoir commencer l'exploration à partir du résultat d'une recherche.
Exercice 2 — Un service web qui utilise un service web #
Implémentation du service
Le service web Geonames ne comporte pas de service permettant de récupérer directement le lieu « parent » d'un lieu donné : il faut récupérer toute
la hiérarchie. Cet exercice a pour objectif d'implémenter (côté serveur) un tel service parent, en s'assurant que le service est utilisable en Ajax depuis n'importe quelle origine.
Le client pourra passer un geonameId en GET, et récupérer l'unique parent du lieu correspondant, avec le choix du format (XML ou JSON).
Vous pouvez utiliser le proxy local de Geonames, dont voici la documentation.
Un client de test
Maintenant que votre service fonctionne, on va le tester avec un client très simple.- Créez un simple fichier HTML contenant un champ de texte (pour saisir l'identifiant geonames) et un bouton, avec un script qui effectue une requête vers votre service et affiche des informations sur le lieu parent du lieu d'identifiant donné. Important : quand vous implémentez ce client de test, imaginez que vous êtes en train de développer un site complètement différent, qui sera potentiellement déployé sur un autre domaine. En particulier, lors de vos appels au service, il est fondamental que vous utilisiez l'URL absolue de votre service : même si lors du développement vous placez le client de test sur le même domaine que le service, il faut garder en tête que le client de test doit pouvoir fonctionner n'importe où, sans que l'URL du service ne change.
- Dans un deuxième temps, vérifiez que votre client de test fonctionne même s'il n'est pas sur le même domaine que le service. Pour cela, vous pouvez ouvrir votre fichier HTML de test « en local » avec votre navigateur (pseudo-protocole
file://), et/ou demander à votre voisin·e de mettre votre fichier HTML de test sur son serveur (mais pas votre service, qui doit rester sur votre serveur à vous !). Le client doit fonctionner dans tous les cas (et ce, sans changer l'URL du service).