Ajax 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 (cross domain). Complexe à mettre en place avec xhr (voir Cross Domain avec Ajax), cela devient beaucoup plus simple et facile avec xhr2. Dans cet article, je vous montre comment faire du cross domain avec xhr2.


 

Prérequis

Avant d’aborder le cross domain 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 faisant 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.

Il suffit d’installer et d’activer le module headers :

a2enmod headers

Puis de spécifier l’entête Access-Control-Allow-Origin entre les balises , , ou :

Header set Access-Control-Allow-Origin "*"

 

Autoriser les appels cross domain avec php

Pour autoriser un script php à être appelé, il suffit de spécifier 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

 

Si vous constatez des coquilles, ou avez des remarques à faire ou des améliorations à proposer ou encore souhaitez manifester votre satisfaction de ce tuto, un commentaire est toujours bienvenu.

 

Posté dans html5, phpTaggé ajax, Ajax cross domain, ajax facile, cross domain, javascript, xhr2  |  2 commentaires

2 réponses à "Ajax cross domain avec javascript XHR2"

Répondre

*