Maison > interface Web > js tutoriel > le corps du texte

Résumé inter-domaines JavaScript : transmission de données inter-domaines implémentée par les compétences window.name_javascript

WBOY
Libérer: 2016-05-16 15:34:28
original
1215 Les gens l'ont consulté

Je l'ai essayé moi-même et ça marche vraiment bien. La méthode de mise en œuvre spécifique est enregistrée comme suit

Il y a trois pages :

a.com/app.html : Page de candidature.
a.com/proxy.html : le fichier proxy, généralement un fichier HTML sans aucun contenu, doit se trouver dans le même domaine que la page de l'application.
b.com/data.html : la page sur laquelle la page de candidature doit obtenir des données peut être appelée une page de données.

Les étapes de base à mettre en œuvre sont les suivantes :

Créez une iframe dans la page de l'application (a.com/app.html) et pointez son src vers la page de données (b.com/data.html).
La page de données ajoutera les données au window.name de cette iframe. Le code data.html est le suivant :

.
  <script type="text/javascript">
    window.name = 'I was there!';  // 这里是要传输的数据,大小一般为2M,IE和firefox下可以大至32M左右
                     // 数据格式可以自定义,如json、字符串
  </script>
Copier après la connexion

Écoutez l'événement onload de l'iframe dans la page de l'application (a.com/app.html Dans cet événement, définissez le src de cette iframe pour qu'il pointe vers le fichier proxy du domaine local (le fichier proxy et). la page de candidature sont sous le même domaine, vous pouvez donc communiquer entre eux). Une partie du code dans app.html est la suivante :

<script type="text/javascript">
    var state = 0, 
    iframe = document.createElement('iframe'),
    loadfn = function() {
      if (state === 1) {
        var data = iframe.contentWindow.name;  // 读取数据
        alert(data);  //弹出'I was there!'
      } else if (state === 0) {
        state = 1;
        iframe.contentWindow.location = "http://a.com/proxy.html";  // 设置的代理文件
      } 
    };
    iframe.src = 'http://b.com/data.html';
    if (iframe.attachEvent) {
      iframe.attachEvent('onload', loadfn);
    } else {
      iframe.onload = loadfn;
    }
    document.body.appendChild(iframe);
  </script>
Copier après la connexion

Détruisez l'iframe après avoir obtenu les données et libérez la mémoire ; cela garantit également la sécurité (non accessible par les autres frame js du domaine).

<script type="text/javascript">
    iframe.contentWindow.document.write('');
    iframe.contentWindow.close();
    document.body.removeChild(iframe);
  </script>
Copier après la connexion

Pour résumer : l'attribut src de l'iframe est transféré du domaine externe vers le domaine local, et les données inter-domaines sont transférées du domaine externe vers le domaine local par le window.name de l'iframe. Cela contourne intelligemment les restrictions d'accès inter-domaines du navigateur, mais en même temps, il s'agit d'une opération sûre.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal