PHP résout Problème croisé de subdomain: utilisez un document.domain et iframe pour obtenir la communication de données

introduire

Le domaine croisé est un problème courant dans le développement frontal. En raison des limitations de politique homologue du navigateur, les demandes de domaine croisé sont généralement bloquées, ce qui pose certains défis aux développeurs. Cependant, dans certains scénarios spécifiques, nous devons implémenter la communication de données entre différents sous-domaines. Cet article présentera comment utiliser Document.Domain et Iframe Technologies pour résoudre le problème de la communication croisée.

Le rôle du document.domain

Avant de plonger dans la solution spécifique, comprenons d'abord le rôle de document.domain. Document.Domain est une propriété String qui spécifie le nom de domaine du document actuel. Si l'URL de la page est "http://www.example.com", nous pouvons modifier le nom de domaine de la page en "Example.com" en définissant document.domain = "example.com", permettant ainsi la communication entre les sous-domains.

Solution

Définir Document.Domain

Tout d'abord, nous créons une page parent sous le nom de domaine principal, qui agit comme une station de transit pour la communication de données. Afin de maintenir la cohérence du sous-domaine, nous devons définir Document.Domain. Les étapes spécifiques sont les suivantes:

 // page parent (http://www.example.com)
document.domain = "example.com";

Ensuite, nous créons un iframe sous le nom de domaine principal et chargeons la page sous le nom du sous-domaine.

 // page parent (http://www.example.com)
<iframe src="http://sub.example.com/child.html"></iframe>

Document de réglage de la page du sous-domaine.domain

Dans la page du sous-domaine, Document.Domain est également nécessaire pour définir comme nom de domaine principal pour assurer une communication normale entre les domaines parent et enfant. Les opérations spécifiques sont les suivantes:

 // page de nom de sous-domaine (http://sub.example.com/child.html)
document.domain = "example.com";

Mettre en œuvre la communication inter-domaine

Dans la page du sous-domaine, en accédant à l'objet Window.Parent, vous pouvez obtenir les variables et les méthodes globales de la page parent. Nous pouvons en profiter pour envoyer activement les demandes à la page parent de la page du sous-domaine pour communiquer à travers le sous-domaine. Le code est le suivant:

 // page de nom de sous-domaine (http://sub.example.com/child.html)
var parentWindow = window.parent;
parentWindow.PostMessage ("Hello, Parent Page!", "http://www.example.com");

Dans la page parent, nous pouvons recevoir des messages envoyés par la page Child en écoutant l'événement de message. L'exemple de code est le suivant:

 // page parent (http://www.example.com)
window.addeventListener ("message", fonction (événement) {
    console.log ("Message reçu de la sous-page:" + event.data);
}, FAUX);

Choses à noter

• Cette solution ne convient que pour les cas où les domaines parent et enfant sont les mêmes, et si les domaines parent et enfant ne sont pas les mêmes, la communication transversale ne sera pas mise en œuvre.
• Lorsque vous utilisez cette solution, vous devez accorder une attention particulière à la sécurité des données pour éviter les problèmes de sécurité tels que les attaques de scripts inter-sites (XSS).

Résumer

En combinant Document.Domain et Iframe, nous pouvons implémenter la communication de données entre les sous-domaines. Cette méthode convient aux mêmes scénarios que le domaine parent et le domaine de l'enfant, et peut aider les développeurs à résoudre les problèmes causés par les sous-marins. Au cours du processus de mise en œuvre, les développeurs doivent accorder une attention particulière à la sécurité et éviter les vulnérabilités de sécurité potentielles. De cette façon, nous pouvons gérer plus efficacement les problèmes du domaine croisé.