Maison > Article > interface Web > Trois façons d'obtenir un accès inter-domaines dans les compétences js_javascript

Trois façons d'obtenir un accès inter-domaines dans les compétences js_javascript

WBOYoriginal: 2016-05-16 15:26:511653parcourir

L'accès inter-domaines Javascript est un problème que les développeurs Web rencontrent souvent. Qu'est-ce que l'inter-domaine ? Un script chargé sur un domaine obtient ou exploite les attributs d'un document sur un autre domaine. Trois méthodes d'implémentation de JavaScript inter-domaines sont répertoriées ci-dessous. :
1. Implémentation inter-domaines basée sur iframe
La mise en œuvre inter-domaines basée sur iframe nécessite que les deux domaines aient les caractéristiques de aa.xx.com, bb.xx.com, c'est-à-dire que les deux pages doivent appartenir à un domaine de base (par exemple, les deux xxx. com, ou xxx .com.cn), utilisez le même protocole (par exemple, les deux sont http) et le même port (par exemple, les deux sont 80). De cette manière, ajoutez document.domain aux deux pages en même temps. peut réaliser la fonction de la page parent appelant la page enfant. Le code est le suivant :
Page 1 :

<html> 
<head> 
 <script> 
  document.domain = "xx.com"; 
  function aa(){ 
   alert("p"); 
  } 
 </script> 
</head> 
<body> 
  <iframe src="http://localhost:8080/CmsUI/2.html" id="i"> 
   
  </iframe> 
  <script> 
 document.getElementById('i').onload = function(){ 
   var d = document.getElementById('i').contentWindow; 
   d.a(); 
    
 }; 
  </script> 
 </body> 
</html>

Page 2 :

<html> 
 <head> 
 <script> 
  document.domain = "xx.com"; 
  function a(){ 
  alert("c"); 
   } 
 </script> 
 </head> 
 <body> 
 </body> 
</html>

À ce stade, la page parent peut appeler la fonction a de la page enfant pour obtenir un accès inter-domaine js
2. Implémentation inter-domaines basée sur des balises de script
La balise de script elle-même peut accéder aux ressources d'autres domaines et n'est pas limitée par la politique de même origine du navigateur. Vous pouvez créer dynamiquement une balise de script sur la page. Le code est le suivant :

var script = document.createElement('script'); 
script.src = "http://aa.xx.com/js/*.js"; 
document.body.appendChild(script);

De cette façon, les fichiers js d'autres domaines peuvent être chargés en créant dynamiquement des balises de script, puis la fonction du fichier js chargé peut être appelée via cette page. L'inconvénient est que les documents d'autres domaines ne peuvent pas être chargés. , seuls les fichiers js. jsonp sont implémentés de cette manière. jsonp transmet un paramètre de rappel à d'autres domaines, et regroupe la valeur du paramètre de rappel et la chaîne json dans une fonction javascript via l'arrière-plan d'autres domaines et la renvoie car la demande est effectuée via. la balise de script, le navigateur La chaîne renvoyée sera analysée et exécutée selon JavaScript, réalisant la transmission de données entre les domaines.
Le support de jsonp dans jquery repose également sur cette solution.
3.Méthode de proxy backend
Cette méthode peut résoudre tous les problèmes inter-domaines, c'est-à-dire que le backend est utilisé comme proxy et que chaque requête pour d'autres domaines est transférée au backend de ce domaine. Le backend de ce domaine accède à d'autres domaines en simulant des requêtes http, et. renvoie ensuite les résultats renvoyés. Pour la réception, l'avantage est que, qu'il s'agisse d'un document ou d'un fichier js en cours d'accès, il peut être inter-domaines.

Les trois méthodes ci-dessus pour obtenir un accès inter-domaines en js vous sont présentées en premier si vous étudiez et étudiez attentivement, vous gagnerez certainement quelque chose

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：jQuery implémente un exemple complet de l'effet de barre de progression affiché en haut de la page_jqueryArticle suivant：jQuery implémente un exemple complet de l'effet de barre de progression affiché en haut de la page_jquery

Articles Liés

Voir plus