检测iframe加载错误

Question

我正在使用src属性将用户选择的页面加载到iframe中.如果加载失败,我想以对用户有意义的方式报告问题.根据http://www.w3schools.com/jsref/dom_obj_frame.asp,iframe一般不支持onerror .

该页面可能来自用户的域,而不是我的,因此我无法查看iframe的内容.

如果加载成功,我可以设置超时并从我的onload处理程序中取消它,但是需要长时间超时以避免错误报告,同时我的iPhone上的Safari已经显示警告,可能会使用户感到困惑.即使这对Kindle Fire浏览器也不起作用 - 无论加载是否成功,它都会向我的处理程序提供加载事件.

我可以使用任何事件来检测故障吗？有没有办法抑制默认的Safari行为？我能判断加载尝试是否失败的任何方式？(如果我能做到这一点,我可以使用更短的超时和轮询,直到加载尝试得到解决).

我可以要求使用最新的浏览器,但想要一个可以在尽可能多的智能手机和平板电脑中移植的解决方案.

我已经测试了AJAX Get的想法,但遗憾的是它没有用.跨域AJAX获取任意URI会导致异常,无论目标是否存在且是否可以加载到iframe中.

Answer 1

您可以将iframe和/或ajax请求设置为始终调用您控制的页面(即:loader.php),通过get发送loader.php用户请求的页面.从loader.php,使用curl甚至只是file_get_contents来获取外部页面.如果请求无法返回到loader.php,您可以检查错误,并返回您想要显示的iframe.

虽然我的示例引用了php的使用,但curl在各种脚本语言中都受支持.它可能比您可能拥有的其他解决方案更复杂,但是可以让您访问响应标头以及解决页面加载失败的原因.

Answer 2

正如您所暗示的，当您尝试查询 iframe 内的任何内容（如果它位于单独的域中）时，您将面临同源策略类型限制。

您可以先向 iframe 的 URL 发出 AJAX GET 请求，然后再将其传递到src框架的 URL 中。如果您没有从 AJAX 调用返回 HTTP 200 响应，则该站点也将无法在框架内加载。

这会增加整个过程的开销，并且仅在您检查iframe 的文档是否是有效的真实 URL 时才有用。如果您需要知道iframe 文档何时完全加载，这将无济于事。

如果您需要知道 iframe 何时加载，并且它位于外部域上，那么我相信您别无选择，只能要求将一些代码添加到这些外部站点以通知父页面它们已成功加载。

或者，如果这样做有意义，请要求最终用户单击链接以标记内容未正确加载。