JavaScript es una tecnología de secuencias de comandos dinámicas frontal que a menudo se usa en el desarrollo web. En JavaScript, existe una limitación de seguridad muy importante llamada "Política del mismo origen". Esta estrategia coloca restricciones importantes en el contenido de la página al que el código JavaScript puede acceder, es decir, JavaScript solo puede acceder al contenido en el mismo dominio que el documento que lo contiene.
JavaScript es una estrategia de seguridad que es particularmente importante al programar múltiples ferram o múltiples ventanas y AJAX. De acuerdo con esta estrategia, el código JavaScript contenido en la página en Baidu.com no puede acceder al contenido de la página bajo el nombre de dominio de Google.com; Incluso no se puede acceder a páginas entre diferentes subdominios mediante el código JavaScript. El impacto en AJAX es que las solicitudes de AJAX implementadas a través de XMLHTTPRequest no pueden enviar solicitudes a diferentes dominios. Por ejemplo, las páginas bajo abc.example.com no pueden enviar solicitudes de Ajax a def.example.com, etc.
Sin embargo, cuando se realiza una programación frontal en profundidad, se requieren inevitablemente las operaciones de dominio cruzado, y la "estrategia del mismo origen" parece demasiado exigente. Este artículo resume algunas de las tecnologías requeridas en todo el dominio sobre este tema.
A continuación discutimos las tecnologías de dominio cruzado en dos situaciones: primero discutir las tecnologías de dominio cruzado en diferentes subdominios y luego discutir tecnologías de dominio cruzado en dominios completamente diferentes.
(I) Tecnología de dominio cruzado de diferentes subdominios.
Lo discutimos por separado en dos preguntas: la primera pregunta es cómo hacer llamadas de JavaScript en diferentes subdominios; La segunda pregunta es cómo enviar solicitudes de AJAX a diferentes subdominios.
Primero resuelvamos el primer problema, suponiendo que hay dos subdominios diferentes en el dominio Ejemplo.com: abc.example.com y def.example.com. Ahora suponga que hay una página en def.example.com que define una función JavaScript:
La copia del código es la siguiente:
función funcindef () {
.....
}
Queremos llamar a la función anterior en una página en abc.example.com. Supongamos que la página a continuación ABC.example.com que estamos discutiendo está integrada en la página a continuación def.example.com en forma de iframe, por lo que podemos intentar hacer las siguientes llamadas en el nombre de iframe:
La copia del código es la siguiente:
Window.top.funcindef ();
Ok, notamos que esta llamada está prohibida por la "política del mismo origen" mencionada anteriormente, y el motor JavaScript organizará directamente una excepción.
Para implementar la llamada anterior, podemos hacerlo modificando el atributo de dominio de las dos páginas. Por ejemplo, podemos agregar el siguiente fragmento de código JavaScript en la parte superior de ambas páginas en abc.example.com y def.example.com:
La copia del código es la siguiente:
<script type = "text/javaScript">
document.domain = "Ejemplo.com";
</script>
De esta manera, las dos páginas se convierten en el mismo dominio, y las llamadas anteriores se pueden ejecutar normalmente.
Una cosa a tener en cuenta aquí es que el documento. La propiedad del dominio de una página solo se puede establecer en un nombre de dominio más de nivel superior (excepto el nombre de dominio de primer nivel), pero no se puede configurar en un nombre de subdominio más profundo que el nombre de dominio actual. Por ejemplo, la página de abc.example.com solo puede establecer su dominio en ejemplo.com, no se puede establecer en sub.abc.example.com y, por supuesto, no se puede configurar en el nombre de dominio de primer nivel com.
El ejemplo anterior discute la situación en la que dos páginas pertenecen a las relaciones anidadas de iframe. Cuando las dos páginas están abiertas y abiertas, el principio es exactamente el mismo.
Resuelvamos el segundo problema: cómo enviar solicitudes de AJAX a diferentes subdominios.
Normalmente, usaremos un código similar al siguiente para crear un objeto XMLHTTPRequest:
La copia del código es la siguiente:
fábricas = [
function () {return new xmlhttprequest (); },
function () {return new ActiveXObject ("msxml2.xmlhttp"); },
function () {return new ActiveXObject ("Microsoft.xmlhttp"); }
];
function newRequest () {
para (var i = 0; i <</span> fábrica.length; i ++) {
intentar{
var fábrica = fábricas [i];
return fábrica ();
} catch (e) {}
}
regresar nulo;
}
El código anterior se refiere a ActiveXObject para compatibilidad con los navegadores de la serie IE6. Cada vez que llamamos a la función NewRequest, obtenemos un objeto AJAX que acabamos de crear y luego usamos este objeto AJAX para enviar una solicitud HTTP. Por ejemplo, el siguiente código envía una solicitud GET a abc.example.com:
La copia del código es la siguiente:
VAR request = NewRequest ();
request.open ("get", "http://abc.example.com");
request.send (nulo);
Suponiendo que el código anterior se incluya en una página bajo el nombre de dominio abc.example.com, la solicitud GET se puede enviar con éxito normalmente sin ningún problema. Sin embargo, si ahora está enviando una solicitud a def.example.com, hay un problema de dominio cruzado y el motor JavaScript lanza una excepción.
La solución es colocar un archivo de dominio cruzado en el dominio def.example.com, suponiendo que se llama CrossDomain.html; Luego mueva la definición de la función de NewRequest anterior a este archivo de dominio cruzado; Finalmente, al igual que la práctica anterior de modificar el valor del documento. Valor del dominio, agregue la parte superior de la página llamando a AJAX debajo del archivo CrossDomain.html y el dominio ABC.example.com:
La copia del código es la siguiente:
<script type = "text/javaScript">
document.domain = "Ejemplo.com";
</script>
Para usar archivos de dominio cruzado, incrusimos un iframe oculto que apunta a archivos de dominio cruzado en la página llamando a AJAX en el dominio ABC.example.com, por ejemplo:
[código]
<iframe name = "xd_iframe" style = "Display: None" src = "http://def.example.com/crossdomain.html"> </iframe>
En este momento, la página bajo el dominio ABC.example.com y CrossDomain.html están en el mismo dominio (ejemplo.com). Podemos llamar a la función NewRequest en CrossDomain.html en la página bajo el dominio abc.example.com:
La copia del código es la siguiente:
Var request = Window.frames ["XD_iframe"]. NewRequest ();
El objeto de solicitud obtenido de esta manera puede enviar una solicitud HTTP a http://def.example.com.
(Ii) Tecnología de dominio cruzado con dominios completamente diferentes.
Si los nombres de dominio de nivel superior son diferentes, por ejemplo, si desea comunicarse en el front-end a través de JavaScript entre el ejemplo1.com y el ejemplo2.com, la tecnología requerida es más complicada.
Antes de explicar las tecnologías de dominio cruzado de diferentes dominios, primero dejemos en claro que la tecnología de la que queremos hablar a continuación también es aplicable a las situaciones anteriores del dominio cruzado, porque el dominio cruzado es solo un caso especial del problema de dominio cruzado. Por supuesto, el uso de la tecnología correcta en las circunstancias correctas puede garantizar una mejor eficiencia y una mayor estabilidad.
En resumen, de acuerdo con las diferentes necesidades de dominio cruzado, las tecnologías de dominio cruzado se pueden clasificar en las siguientes categorías:
1. JSONP Cross-Dominio obtenga solicitud
2. Implementación de dominio cruzado a través de iframe
3. Solicitud HTTP de dominio cruzado flash
4. Ventana. Postmessage
Este artículo terminará aquí primero. Presentaremos las cuatro tecnologías de dominio cruzado mencionados anteriormente en detalle. ¡Lo presentaremos más tarde!