Ajax cross-domain
avec javascript XHR2
Dans cet article, je vous montre comment faire du cross domain avec javascript xhr2. Par défaut et pour des raisons de sécurité, il n’est pas possible de faire de requêtes ajax entre 2 domaines distincts. XHR2 rend les choses beaucoup plus simples et faciles.
Prérequis
Avant d’aborder le sujet avec xhr2, je vous invite à lire l’article consacré à ajax : Requêtes ajax avec xhr2.
Cross Origin Resource Sharing (CORS)
CORS permet à des applications web d’un domaine A de faire des appels ajax à des scripts hébergés sur un autre domaine B. C’est très simple à réaliser : il suffit que le script (domaine B) appelé l’autorise. Cette autorisation passe par le biais d’un entête ajouté à la réponse du serveur appelé (domaine B).
Autoriser les appels à un script serveur en cross domain
Prenons en exemple 2 domaines distincts www.domaineappelant.com et www.domaineappele.com. Le premier fait un appel ajax sur un script du second. Pour permettre cet appel, le script du domaine appelé (www.domaineappele.com) doit ajouter dans sa réponse l’entête suivant.
Access-Control-Allow-Origin: http://www.domaineappelant.com
Si le script du domaine appelé (www.domaineappele.com) souhaite pouvoir être appelé par n’importe quel domaine
Access-Control-Allow-Origin: *
Il n’y a donc rien à faire côté ajax. La spécification ne se fait que côté serveur.
Autoriser les appels cross domain avec Apache
Il est aussi possible de configurer le serveur web afin qu’il autorise les appels cross domain. Pour cela installez et activez le module headers.
a2enmod headers
Dans les fichiers de configuration, il suffit d’ajouter entre l’une des balises <Directory>, <Location>, <Files> or <VirtualHost> sections, ou depuis le fichier .htaccess.
Header set Access-Control-Allow-Origin "*"
Autoriser les appels cross domain avec php
Pour autoriser un script php à être appelé, spécifiez l’entête en début de script comme suit.
<?php
header("Access-Control-Allow-Origin: *");
....
?>
Quelque soit le langage, le principe reste le même : ajouter l’entête Access-Control-Allow-Origin.