jQuery & YQL : Effectuer des requêtes AJAX en cross-domain

 

Kézako

jQuery n’étant qu’un Framework JavaScript, il doit respecter les règles d’implémentations des requêtes de type AJAX, notamment celle du « Same Origin Policy » qui est imposé par les paramètres de sécurités des navigateurs. Pour être plus clair, cette restriction impose que les requêtes AJAX ne peuvent être effectuées que vers le domaine du site courant.

Dans un post précédent, « Récupérer le contenu d’une page externe : Cross Domain » j’expliquais comment « feinter » cette restriction au niveau du langage PHP et avec l’utilisation de la librairie PHP cURL. Je vais maintenant vous expliquer comment réaliser ce Cross Domain via le langage JavaScript et jQuery pour faciliter l’utilisation des méthodes AJAX !

Pré-requis

• la librairie jQuery (http://jquery.com)
• la lecture (ou non) des ressources sur le language YQL : « Yahoo ! Query Language » (http://developer.yahoo.com/yql/)

YQL ou Yahoo ! Query language

Mais qu’est ce que c’est que cette bête là ! Et bien déjà sa se prononce « Ouaye-Qiou-Elle »â€¦

Bon trêve de plaisanterie, cet outils mis à disposition par Yahoo est langage similaire (voir identique =D) au SQL. Il permet d’exécuter des requêtes, de filtrer, d’ordonner et de combiner des données situées sur l’Internet !

Pour notre part, on utilisera la table « html » qui permet de récupérer le contenu d’un page Internet distante. La requête ressemble à :

SELECT * FROM html WHERE url = "url_site"

Il est même possible d’utiliser la syntaxe XPath pour recevoir uniquement les résultats intéressants (cf YQL xpath), pour les démonstrations, j’ai utilisé jQuery pour parser mes résultats.

Le site de ressources Yahoo est assez bien détaillé, c’est pourquoi je ne vais pas parler plus largement du YQL ici. Une console permet de tester à la FireBug les résultats obtenus par une requête (la console YQL).

Ajax et jQuery

Je ne rentrerai pas dans le détail de l’utilisation des méthodes permettant de mettre en place les techniques AJAX en jQuery. Ce sujet est très largement traité sur la toile !

Les plus

• Il existe un plugin jQuery (cross-domain-ajax) qui permet par défaut de venir inhiber les restrictions du « Same Origin Policy ».
• Loading external content with Ajax using jQuery and YQL
• Autre démo

Bon Cross-Domain à vous!

Et surtout bon dév’ [:D]

Geekos.fr vous recommande les articles suivants

• Récupérer un contenu externe en AJAX : Cross Domain
• jQuery : Système de tag d’images avec des formes personnalisables
• Plugin dataTables, une nouvelle vision des tableaux
• jQuery et CSS : Donner du style à ses liens
• jQuery: Utiliser une autre version sans écraser celle existante