Определить, успешно ли загружено содержимое iframe

У меня есть виджет, содержащий iframe. Пользователь может настроить URL-адрес этого iframe, но если URL-адрес не может быть загружен (он не существует или у пользователя нет доступа к Интернету), iframe должен перейти на автономную страницу по умолчанию.

Вопрос в том, как определить, можно ли загрузить iframe или нет? Я попытался подписаться на событие "load", и, если это событие не будет запущено через некоторое время, я откажусь, но это работает только в Firefox, поскольку IE и Chrome запускают событие "load", когда "Страница не найдена" отображается.

Ответ 1

В настоящее время в браузерах есть ряд ограничений безопасности, которые удерживают вас от содержимого iframe (если это не ваш домен).

Если вам действительно нужна эта функциональность, вам нужно создать страницу сервера, которая должна работать как прокси-сервер, который получает URL-адрес в качестве параметра, проверяет, является ли он действительным URL-адресом, а также перенаправляет или отображает страницу с ошибкой.

Ответ 2

Я нашел следующую ссылку через Google: http://wordpressapi.com/2010/01/28/check-iframes-loaded-completely-browser/

Не знаю, разрешает ли он проблему "Страница не найдена".

<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>

Я сам не пробовал, поэтому не знаю, работает ли это. Удачи!

Ответ 3

Если вы управляете содержимым iframe, iframe может отправить сообщение родительскому.

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

Родительский обратный вызов прослушивает сообщение.

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

Ответ 4

Как проверить, доступен ли URL-адрес, и только затем установить фактический URL-адрес iframe? например с 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;
         }
    }
});

Изменить: Это не похоже на кросс-домен, код состояния в этом случае равен 0.

Ответ 5

Если у вас есть контроль над содержимым iframe (например, вы можете добавить произвольный код на страницу), вы можете попробовать реализовать специальную функцию в каждом из них, а затем на своей странице вы вызываете эту функцию и error (через обработчик window.onerror), если функция, вызванная с помощью eval, терпит неудачу, потому что страница не загружается.

Вот пример кода: http://www.tek-tips.com/viewthread.cfm?qid=1114265&page=420

Ответ 6

После перезагрузки onload вы можете очистить содержимое iframe, чтобы узнать, содержит ли он полезную страницу или нет. Вам придется сделать этот браузер конкретным, к сожалению, потому что все они отображают другое сообщение "страница не найдена".

Для получения дополнительной информации см. здесь http://roneiv.wordpress.com/2008/01/18/get-the-content-of-an-iframe-in-javascript-crossbrowser-solution-for-both-ie-and-firefox/