Ajax avec site Web distant

Seconde partie: échanger des données avec un autre site

Dans la première partie de ce tutoriel nous avons vu comment lire des données sur un autre site et les afficher de façon asynchrone dans la page courante grâce à Ajax.

La seconde partie montre dans une démonstration réellement fonctionnelle comment fournir des données à un autre site pour qu'il les traite, avant de récupérer le résultat et l'afficher sur la page courante, en Ajax toujours.

Principe

Le principe de fonctionnement est un développement de celui de la première partie: on utilise toujours la fonction PHP file_get_contents() pour récupérer les données sur l'autre site, mais cette fois il faut un script supplémentaire à placer sur le second site qui traite les données et renvoie un résultat.

  1. Sur le site A, la page ajax-cross-site.html utilise Ajax et le fichier JavaScript ajax-cross-site.js.
    Elle contient un formulaire pour que l'utilisateur entre des données à faire traiter par le site B.
  2. En Ajax on appelle le script PHP ajax-cross-call.php en lui fournissant en paramètre les données entrées dans le formulaire.
  3. Ce script crée un fichier ajax-cross-get.txt qui contient ces données.
  4. Il exécute sur le site B le script ajax-cross-reply.php. Pour cela il utilise une fonction include avec l'URL du script en paramètre.
  5. Ce script sur le site B utilise la fonction file_get_contents() pour lire le fichier de données ajax-cross-get.txt généré sur le site A.
  6. Il exécute le traitement voulu et affiche le résultat (il peut aussi le mettre dans un fichier).
  7. Le script initial sur le site A récupère ce résultat dans un buffer (il pourrait aussi le récupérer dans un fichier sur le site B).
  8. Le script initial crée un nouveau fichier ajax-cross-final.txt qui contient le résultat.
  9. On récupère le contenu de ce fichier avec la fonction GET de l'objet XMLHttpRequest.
  10. On l'affiche dans la page qui contient le formulaire.

Le script JavaScript est très proche de celui qui a été décrit dans la première partie. Pour les scripts PHP, ils comportent plusieurs parts cruciales quand à l'échange de données entre sites, que l'on va analyser.

Utilisation de PHP

Les deux éléments essentiels sont le passage de paramètres à un autre site, et l'exécution d'un script sur un site distant.

Créer un fichier de paramètres

Le code JavaScript récupère le contenu du formulaire:

var script = "ajax-cross-call.php";   
var data = document.ajax.data.value;  
 	
xhr.onreadystatechange=function()
{ 
	if(xhr.readyState == 4)
	{
			retrieve();
	}
}; 
xhr.open("POST", script, true);		
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send("data=" + data);

Le contenu de la variable data sera récupérée par le script PHP.

Fournir des données à un site distant

Le système choisi consiste à utiliser la fonction file_get_contents sur le site distant avec en paramètre une URL déjà définie.

Le script PHP ajax-cross-call.php crée donc sur le site A un fichier contenant les paramètres du formulaire:

$callerdata = "ajax-cross-get.txt"; 
$content = $posted["data"];  
$nfile = fopen($callerdata, "w");
if($nfile != false)
{
	 fwrite($nfile, $content);   
	 fclose($nfile);
}

Ces données fournies dans le formulaire sont récupérées dans la variable $content et sauvées dans le fichier ajax-cross-get.txt.

Sur le site B, on aura dans le script ajax-cross-reply.php ce code:

$caller = "http://www.a.com/ajax-cross-get.txt";
$content = file_get_contents($caller);

$caller est l'URL du site A sur lequel sont récupérées les données.
$content contient les données.

Dans notre exemple, le script récupére aussi des données sur le site B pour effectuer un traitement purement démonstratif. Le résultat de ce traitement est affiché avec la commande echo.
Le traitement consiste à mettre en majuscules le texte fourni par le site A, et lui accoler un texte pris sur le site B avant d'afficher le tout.

Exécuter un script PHP sur un site distant

Cela se fait avec la fonction include. Dans ce cas le script est exécuté par le serveur du site B et il affiche les résultats.
Il n'a pas accès aux variables du script qui l'appelle contrairement à ce qui se passerait sur le même site.

$script = 'http://www.b.com/ajax-cross-reply.php';

include($script);

La fonction include ne permet pas l'ajout de paramètre (cela peut dépendre de la configuration).

Récupérer les résultats d'un script sur le site distant

La fonction PHP ob_start permet de placer dans une mémoire tampon ce qu'affiche le script: 


ob_start();
include($script);
$result = ob_get_contents();
ob_end_clean();

On assigne à la variable $result le contenu de mémoire tampon, fourni par la fonction ob_get_contents().

Afficher les résultats en Ajax

Le contenu de la mémoire tampon est stocké dans un fichier sur le site A dans la suite du script ajax-cross-call.php, après l'appel du script du site B:

  $f = fopen("ajax-cross-final.txt", "w");
  fwrite($f, $result);   
  fclose($f);

Les résultats récupérés dans la mémoire tampon et assignés à $result sont stockés dans le fichier ajax-cross-final.txt dont le contenu est récupéré par GET comme dans l'exemple de la première partie de ce tutoriel.

Problèmes

Ce système est conçu pour offrir une parfaite sécurité contre les injections de code malveillant, toutefois si vous voyez néanmoins une faille de sécurité dans son fonctionnement, vous pouvez en parler sur le forum.

Les fonctions employées sont normalement disponibles avec une configuration PHP 4.3 standard. Il est cependant possible que la configuration du serveur ne permette pas les include distants ou la fonction file_get_contents(). Il vous faudra alors contourner ces limitations.

La démo et les sources

© 2008-2012 Xul.fr