Détecter si le contenu de l'iframe a chargé avec succès

J'ai un widget qui contient une iframe. L'utilisateur peut configurer l'url de l'iframe, mais si l'url ne peut pas être chargé (il n'existe pas ou que l'utilisateur n'a pas accès à internet), puis l'iframe doit basculer d'un mode hors connexion par défaut de la page.

La question est, comment puis-je détecter si l'iframe peut être chargé ou pas? J'ai essayé de souscrire à la "charge" de l'événement, et, si cet événement n'est pas déclenché après un certain temps, puis je le basculement, mais cela ne fonctionne que sous Firefox, depuis IE et Chrome les feux de la "charge" de l'événement lors de la "Page not Found" s'affiche.

hey skinssay, avez vous trouvez une solution sans l'aide d'un proxy?
non, je n'ai pas. J'ai fait une recherche plus approfondie et je pense qu'il n'est pas possible 🙁
selon stackoverflow.com/questions/3552355/... la propriété onerror est pris en charge par webkit, mais je n'ai pas encore eu la chance de le faire fonctionner. le saviez vous?
yep, moi non plus...
Comme de Chrome d'au moins 35 la onerror n'est pas pris en charge par iframe. code.google.com/p/chromium/issues/detail?id=365457#c4

InformationsquelleAutor Javier Orellana | 2010-12-28

7

Aujourd'hui, les navigateurs ont une série de limitations de la sécurité que vous tenir à l'écart à partir du contenu d'une iframe (si ce n'est pas de votre domaine).

Si vous avez vraiment besoin de cette fonctionnalité, vous devez créer un serveur de page qui ont à travailler comme un proxy, qui reçoivent l'url en paramètre de test si c'est une url valide, et ne la redirection ou l'affichage de la page d'erreur.

InformationsquelleAutor Adilson de Almeida Jr
14

J'ai trouvé le lien suivant via Google: http://wordpressapi.com/2010/01/28/check-iframes-loaded-completely-browser/

Ne sais pas si cela résout le "Page Non Trouvé" problème.
```
<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>
```
Je n'ai pas essayé moi-même, donc je ne sais pas si cela fonctionne. Bonne chance!
- Cela fonctionne à peu près comme l'événement onload, l' (iframe.readyState == "complete") la condition est vraie, même si le chargement de la page est un IE page d'erreur. Donc, il laissez-moi savoir quand la page est chargée, mais pas si il a été chargé avec succès. Merci quand même!
- Merci!!!! J'ai été à récurer pour une solution de travail de 2 heures. Enfin!!! 🙂
- Ne fonctionne pas sur Chrome:stackoverflow.com/questions/13952942/...
- iframes ne sont PAS XMLHttpRequests !, non cela ne fonctionne pas.
- Meilleure réponse! Fonctionne très bien sur chrome.
InformationsquelleAutor RobinBrouwer

Si vous contrôlez le contenu de l'iframe, l'iframe pouvez envoyer un message à la société mère.

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

Le parent de rappel écoute le message.

        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
            }
        });

InformationsquelleAutor Henry

Façon sur la façon de vérifier si l'url est disponible et puis en définissant l'url de l'iframe?
par exemple avec 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;
         }
    }
});

Edit:
Cela ne semble pas fonctionner de la croix de domaine, le code d'état est 0 dans ces cas.

InformationsquelleAutor Jens Timmerman

0

Si vous avez le contrôle sur le contenu de l'iframe (par exemple, vous pouvez ajouter du code arbitraire à la page), vous pouvez essayer de mettre en œuvre une fonction particulière au sein de chacun d'eux, puis dans votre page, vous pouvez appeler cette fonction et attraper une erreur (via window.onerror gestionnaire) si la fonction appelée via eval échoue parce que la page ne se charge pas.

Voici un exemple de code: http://www.tek-tips.com/viewthread.cfm?qid=1114265&page=420
- depuis, il a mis le tag "cross-domain", j'imagine qu'il ne les contrôle pas, des deux côtés.
- Oui, je n'ai pas de contrôle sur le contenu. L'idée est que l'utilisateur peut configurer l'iframe src avec n'importe quelle url il veut.
- eval est le mal. iframe avec eval est satanique. <iframe id="iframe" src="google.com" onLoad="eval(str);"></iframe>
InformationsquelleAutor DVK
0

Après le onload de feux, vous pouvez récupérer le contenu de l'iframe pour voir si elle contient une tâche de la page ou pas. Vous auriez à faire de ce navigateur specifuc malheureusement, parce qu'ils ont tous afficher une autre "page non trouvée" message.

Pour plus d'infos, jetez un coup d'oeil ici à http://roneiv.wordpress.com/2008/01/18/get-the-content-of-an-iframe-in-javascript-crossbrowser-solution-for-both-ie-and-firefox/
- Je pense que cela ne fonctionnera pas avec la croix-domaine de contenu.
- Oui, vous avez raison, il ne vous permettra pas d'accéder à la croix-domaine de contenu.
InformationsquelleAutor Bitsplitter

Vous devez vous connecter pour publier un commentaire.