Detectar si el contenido del iframe se ha cargado satisfactoriamente

Question

Tengo un widget que contiene un iframe. El usuario puede configurar la url de este iframe, pero si la url no se pudo cargar (no existe o el usuario no tiene acceso a Internet), entonces el iframe debe conmutar por error a una página predeterminada sin conexión.

La pregunta es, ¿cómo puedo detectar si el iframe podría estar cargado o no? Intenté suscribirme al evento 'cargar' y, si este evento no se activa después de un tiempo, conmutaré a failover, pero esto solo funciona en Firefox, ya que IE y Chrome activan el evento 'cargar' cuando la 'Página no encontrada' es desplegado.

Answer 1

Actualmente, los navegadores tienen una serie de limitaciones de seguridad que lo mantienen alejado del contenido de un iframe (si no es de su dominio).

Si realmente necesita esa funcionalidad, debe crear una página de servidor que tenga que funcionar como un proxy, que reciba la url como parámetro, pruebe si es una url válida y redirige o muestra el error página.

Answer 2

Si tiene control sobre el contenido del iframe (por ejemplo, puede agregar código arbitrario a la página), puede intentar implementar una función especial en cada uno de ellos, luego en su página, llama a esa función y captura un error (a través del controlador window.onerror) si la función llamada a través de evalúa falla porque la página no se cargó.

Aquí es código de ejemplo: http://www.tek-tips.com/viewthread.cfm?qid=1114265&page=420

Answer 3

Después de los incendios onload, puede compactar el contenido del iframe para ver si contiene una página muy útil o no. Tendría que hacer que este navegador especifique desafortunadamente porque todos muestran un mensaje diferente de "página no encontrada".

Para obtener más información, echa un vistazo aquí en http://roneiv.wordpress.com/2008/01/18/get-the-content-of-an-iframe-in-javascript-crossbrowser-solution-for-both-ie-and-firefox/

Answer 4

he encontrado el siguiente enlace a través de Google: http://wordpressapi.com/2010/01/28/check-iframes-loaded-completely-browser/

No sabe si se soluciona el problema 'Página no encontrada'.

<script type="javascript"> 
var iframe = document.createElement("iframe"); 
iframe.src = "http://www.your_iframe.com/"; 
if (navigator.userAgent.indexOf("MSIE") > -1 && !window.opera) { 
    iframe.onreadystatechange = function(){ 
    if (iframe.readyState == "complete"){ 
     alert("Iframe is now loaded."); 
    } 
    }; 
} else { 
    iframe.onload = function(){ 
    alert("Iframe is now loaded."); 
    }; 
} 
</script> 

No lo he probado, por lo que no sé si funciona. ¡Buena suerte!

Answer 5

¿Qué tal si verificas si la URL está disponible y solo luego configuras la url real del iframe? p. con jQuery

var url = "google.com" 
var loading_url = "/empty.html" 
document.getElementById("iframe").src = loading_url; 
$.ajax({ 
    url: url, 
    type: 'GET', 
    complete: function(e, xhr, settings){ 
     if(e.status === 200){ 
       document.getElementById("iframe").src = url; 
     } 
    } 
}); 

Editar: Esto no parece funcionar varios dominios, el código de estado es 0 en esos casos.

Answer 6

Si controla el contenido del iframe, el iframe puede enviar un mensaje al padre.

 parent.postMessage('iframeIsDone', '*'); 

La devolución de llamada principal escucha el mensaje.

 var attachFuncEvent = "message"; 
     var attachFunc = window.addEventListener ; 
     if (! window.addEventListener) { 
      attachFunc = window.attachEvent; 
      attachFuncEvent = "onmessage"; 
     } 

     attachFunc(attachFuncEvent, function(event) { 
      if (event.data == 'iframeIsDone') { // iframe is done callback here 
      } 
     });