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); } } 
  • Actualizar un iframe
  • ¿Es válido un iframe src vacío?
  • Elemento fijo dentro de iFrame
  • ¿Cómo evitar que iframe modifique el context de navigation de nivel superior (top.history)?
  • Uncaught SecurityError: bloqueó un marco con origen "nulo" de acceder a un marco con origen "nulo". Los protocolos, dominios y puertos deben coincidir
  • Compruebe si JS tiene acceso al documento de un iframe
  • Firefox WebExtension, superposition de HTML aislada
  • Paypal Embedded Flow no usa returnUrl o cancelUrl
  • ¿Cómo obtengo el valor seleccionado de un cuadro de selección, desde dentro de un Iframe, y lo visualizo en el exterior?
  • Cómo acceder al iframe principal desde JavaScript
  • Javascript: function de llamada en el padre del iframe
  • Los datos de MessageChannel port.postMessage son nulos cuando se llama a postMessage con un object transferible.
  • Pérdidas de memory al incrustar videos de YouTube en Metro App usando iframe
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.