如何在加载iframe时处理错误？

I have an <iframe> that other sites can include so their users can POST a form back to my site. I'd like to handle gracefully the cases where my site is down or my server can't serve the <iframe> contents (that is, a response timeout or a 4xx or 5xx error). I tried adding an onError to the <iframe> object, but that didn't seem to do anything:

我有一个其他网站可以包含的

showIFrame = function() {
  var iframe = document.createElement('iframe');
  iframe.id = 'myIFrame';
  iframe.src = 'http://myserver.com/someURLThatFailsToLoad';
  iframe.onError = iframe.onerror = myHandler;
  document.body.appendChild(iframe);
};

myHandler = function(error) {
  document.getElementById('myIFrame').style.display = 'none';
  console.error('Error loading iframe contents: ' + error);
  return true;
};

If my server returns a 404 I just get the contents of the not-found page in my <iframe>. In fact, that error handler isn't ever triggered. Is there a way to make this work?

如果我的服务器返回404，我只能在

(I'm currently testing in Chrome, but I'd like it to also work for FF and IE >= 7.)

（我目前正在使用Chrome进行测试，但我希望它也适用于FF和IE> = 7.）

3 个解决方案

#1

To detect whether your server is down or not, you can include an empty script file from your own domain. When the server is down, the onerror event handler will fire:

要检测服务器是否已关闭，您可以在自己的域中包含一个空脚本文件。当服务器关闭时，onerror事件处理程序将触发：

var el = document.createElement('script');
el.onerror = errorFunction;
el.src = "somebogusscript.js?" + new Date().getTime();
document.body.appendChild(el);

Note: don't forget to add a random string to the src attribute to avoid the client using a cached version (which could stop a look at the server at all).

注意：不要忘记在src属性中添加一个随机字符串，以避免客户端使用缓存版本（可能会停止查看服务器）。

#2

Perhaps you could try onErrorUpdate for the event handler? I couldn't see an onError handler for iFrames. If that doesn't work, you could try onLoad and then check the source of the iframe or the title of it for a 404 message.

也许您可以尝试使用ErrorUpdate来处理事件处理程序？我看不到iFrames的onError处理程序。如果这不起作用，您可以尝试onLoad，然后检查iframe的来源或404的消息标题。

Such as: if (frameDoc.title == 'title the server sends for 404') {

例如：if（frameDoc.title =='服务器为404发送的标题'）{

---

Source:

资源：

http://bytes.com/topic/javascript/answers/166288-catch-404-when-using-iframe

http://bytes.com/topic/javascript/answers/166288-catch-404-when-using-iframe

iFrame Methods: http://www.java2s.com/Code/HTMLCSSReference/HTML-Tag-Reference/iframeJavaScriptMethods.htm

iFrame方法：http：//www.java2s.com/Code/HTMLCSSReference/HTML-Tag-Reference/iframeJavaScriptMethods.htm

iFrame Properties: http://www.java2s.com/Code/HTMLCSSReference/HTML-Tag-Reference/iframeJavaScriptProperties.htm

iFrame属性：http：//www.java2s.com/Code/HTMLCSSReference/HTML-Tag-Reference/iframeJavaScriptProperties.htm

#3

One technique is to set a JavaScript timeout when you make the request. If your timeout fires before the iframe onload event, the content didn't load. You could then set iframe.src to about:blank, delete, or reuse the iframe.

一种技术是在发出请求时设置JavaScript超时。如果超时在iframe onload事件之前触发，则内容不会加载。然后，您可以将iframe.src设置为about：空白，删除或重用iframe。