estoy creando una aplicación vue js que está alojada en mi subdominio
y quiero cargar un formulario desde mi sitio principal usando iframe.simple quiero cargar un formulario desde mi dominio principal a mi subdominio a través de i frame. Y funciona perfectamente
<iframe ref="formFrame" @load="afterLoad()" :src="url"></iframe>Y ahora tengo una función en mi aplicación vue js como
displaySuccess(data){ console.log("data from server: "+data); }Y esta función debe activarse desde mi formulario. así que agregué un código como el siguiente en el formulario
window.parent.displaySuccess(text);Pero no se activa. ¿Cómo puedo llamar a los métodos principales desde el formulario iframe? Gracias de antemano
Puede usar el método window.postMessage() de forma segura (permite la comunicación de origen cruzado entre objetos de Windows; por ejemplo, entre una página y una ventana emergente que generó, o entre una página y un iframe incrustado como en su ejemplo) .
Este es un ejemplo básico para una comunicación dúplex entre un padre y un Iframe.
Padre -> IFrame
iframe.contentWindow.postMessage('hello world', '*'); // from parent window.onmessage = function(e) { // inside the iframe if (e.data == 'hello world') { alert('It works!'); } };IFrame -> Padre
window.onmessage = function(e) { // inside the parent if (e.data == 'hello world') { alert('It works!'); } }; window.top.postMessage('hello world', '*') //inside the iframeVentana.postMessage : https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage