Petit conseil Requête AJAX interdomaine avec YQL et jQuery

Pour des raisons de sécurité, nous ne pouvons pas créer de requêtes AJAX inter-domaines avec jQuery. Par exemple, je ne peux pas appeler la méthode load () et transmettre "cnn.com". Au fur et à mesure que nous chargerions des scripts et autres, ainsi que le contenu souhaité, cela présenterait un risque de sécurité important. Néanmoins, il peut arriver que ce soit précisément ce dont vous avez besoin. Grâce à YQL, nous pouvons autoriser cette fonctionnalité assez facilement!


Abonnez-vous à notre page YouTube pour voir tous les tutoriels vidéo!

Le scénario

 // Accepte une URL et une fonction de rappel à exécuter. function requestCrossDomain (site, callback) // Si aucune URL n'a été passée, quittez. if (! site) alert ('Aucun site n'a été passé.'); retourne faux;  // Prenez l'URL fournie et ajoutez-la à une requête YQL. Assurez-vous de l'encoder! var yql = 'http://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent ('select * from html où url = "' + site + '' ') +' & format = xml & callback = cbFunc '; // Demande cette chaîne YSQL et exécute une fonction de rappel. // Passe une fonction définie pour empêcher le contournement du cache. $ .getJSON (yql, cbFunc); function cbFunc (data) // Si nous avons quelque chose à travailler avec… if (data.results [0]) // Supprimez toutes les balises de script, pour des raisons de sécurité. // SOYEZ TRÈS PRUDENT. Cela aide, mais nous devrions en faire plus. data = data.results [0] .replace (/] *> [\ s \ S] *?<\/script>/ gi, "); // Si l'utilisateur a passé un rappel // et qu'il // est une fonction, appelez-la et envoyez-la à travers les données var. if (typeof callback === 'fonction') callback (data);  // Sinon, nous avons peut-être demandé à un site qui n'existe pas et qui ne retourne rien. Sinon, lance une nouvelle erreur ('Aucun résultat de getJSON.');

Appeler la fonction

 requestCrossDomain ('http://www.cnn.com', fonction (résultats) $ ('# conteneur'). html (résultats););

Dépouiller les balises de script

Je devais progresser assez rapidement dans la vidéo, alors peut-être que l'expression régulière qui dépouille le , ou . Pour cette raison, nous ajoutons une classe de caractères ([^>] *), ce qui signifie "Trouver zéro ou plus de tout ce qui N'EST PAS un crochet de fermeture. Cela traitera des attributs et des valeurs.

 [\ s \ s] *?

Ensuite, nous voulons supprimer tout le code, ainsi que tout espacement. \ s se réfère à un espace. \ S fait référence à tout ce qui N'EST PAS un espace. Encore une fois, nous ajoutons un * après la classe de caractères pour désigner que nous voulons zéro ou plusieurs occurrences.

 <\/script>

Enfin, recherchez les balises de script de fermeture.


Lectures complémentaires

  • Une API pour le Web: Learning YQL

Cela n'a pour but que de donner un aperçu de la manière dont nous pouvons réaliser cette fonctionnalité. On ne peut en couvrir qu'une partie dans une vidéo de cinq minutes. N'hésitez pas à discuter dans les commentaires, et vous êtes toujours encouragé à utiliser le code source pour l'améliorer.!