Javascript comunicando el dominio cruzado a la ventana principal de iframe

He escrito una herramienta para tomar notas, capturar imágenes de páginas web. Se carga como un iFrame dentro de la ventana actual utilizando un marcador de javascript:

javascript:(function(){ _my_script=document.createElement('SCRIPT'); _my_script.type='text/javascript'; _my_script.src='http://basereality.test/js/bookmarklet.js?rand='+(Math.random()); document.getElementsByTagName('head')[0].appendChild(_my_script); })(); 

Quiero poder cerrar la herramienta eliminando el iFrame de la ventana principal, cuando el usuario hace clic en un botón de cierre.

¿Cuál es la forma más fácil de hacer esto? ¿Es posible cerrar un iFrame dentro de sí mismo?

He intentado usar la publicación de mensajes entre dominios. Tengo publicaciones entre dominios que funcionan desde la ventana principal al iFrame secundario, pero no funciona desde la ventana principal al iFrame.

El código que tengo hasta ahora (que presumiblemente contiene el problema) es el siguiente.

En la ventana principal a través del Javascript cargado dinámicamente:

 function addiFrame(domain){ var iframe_url = "http://" + domain + "/bookmarklet"; var div = document.createElement("div"); div.id = bookmarkletID; var str = ""; iframe_url += "?description=" + encodeURIComponent(document.title); iframe_url += "&URL=" + encodeURIComponent(document.URL); str += "
"; str += ""; str += "
"; div.innerHTML = str; document.body.insertBefore(div, document.body.firstChild); } function jQueryLoadedCallback(){ jQueryAlias = jQuery.noConflict(); jQueryAlias('#' + bookmarkletID).bind('basereality.removeFrame', removeFrame); } function removeFrame(){ alert("Calling remove frame"); $("#" + bookmarkletID).remove(); }

En el iFrame, el botón para cerrar las llamadas de iFrame:

 function removeFrame(){ var params = {}; params.message = 'basereality.removeFrame'; parent.postMessage(params, "*"); } 

La llamada removeFrame en el iFrame no hace que se llame a removeFrame en la ventana principal.

Entonces, ¿cómo debo eliminar el iFrame?

One Solution collect form web for “Javascript comunicando el dominio cruzado a la ventana principal de iframe”

PostMessage es probablemente lo que estás buscando. Mozilla ha documentado esto y tiene un soporte de navegador cruzado bastante decente:

https://developer.mozilla.org/en-US/docs/DOM/window.postMessage

También escribí una biblioteca sobre este concepto, puede que necesite un poco de depuración, pero está disponible en github: https://github.com/tsharp/OF.Core.js/blob/master/js/of/window.messaging. js

Desde aquí, necesitará un detector de eventos en la ventana principal para manejar todas las solicitudes entrantes … que eliminará el iframe del contexto principal. Aquí hay un ejemplo de registro del evento de mensaje recibido.

 function registerWindowHandler() { if (typeof window.addEventListener !== 'undefined') { window.addEventListener('message', receiveMessage, false); } else { // Support for ie8 window.attachEvent('onmessage', receiveMessage); } } 
  • Cómo enviar un parámetro a Iframe con una request HTTP POST
  • Cambio de src de iframe dentro de iframe
  • ¿Puedo usar varias versiones de jQuery en la misma página?
  • javascript / IE 6/7: verificar si dentro de un iframe
  • Seleccionar un elemento en iFrame jQuery
  • Cambiar el tamaño del contenido del website externo para que se ajuste al ancho del iFrame
  • Iframes cargando con la barra de progreso usando jQuery?
  • Múltiples encabezados 'X-Frame-Options' con valores conflictivos
  • Cómo usar sendKeys en el área de text de ckeditor usando selenium java
  • Facebook: Cómo quitar la barra de desplazamiento vertical de iFrame en la pestaña de la aplicación
  • ¿Cómo puedo cargar <script> en un iframe?
  • Barra de navigation Bootstrap 3 en las páginas que contienen iframes
  • Deshabilitar flash en nuestro website y en iframe
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.