javascript 如何检测 iframe 中的错误 404?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/16499117/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to detect an error 404 in an iframe?
提问by Christophe
My Web page uses iframes to collect content from other pages. All pages are in the same domain.
我的网页使用 iframe 从其他页面收集内容。所有页面都在同一个域中。
From the main page, is there a way to confirm that all iframes have loaded, and that there is no 404 error?
在主页面上,有没有办法确认所有 iframe 都已加载,并且没有 404 错误?
采纳答案by Tony Chiboucas
The status only lives in the response header.
状态只存在于响应头中。
The 404 Page is handling an HTTP Status Code, which is only included in the server's response sent to the browser, but not in the actual window
and document
objects of the DOM that javascript may access. This means that while you certainly can collect the status-code and take appropriate actions, you may only do so when your javascript is receiving the response, such as with a jQuery.ajax() requestor an XmlHttRequest to load your "iframe".
404 页面正在处理一个HTTP 状态代码,它只包含在服务器发送给浏览器的响应中,而不包含在javascript 可能访问的 DOM的实际window
和document
对象中。这意味着虽然您当然可以收集状态代码并采取适当的行动,但您只能在您的 javascript 收到响应时这样做,例如使用jQuery.ajax() 请求或XmlHttRequest 加载您的“iframe”。
Hope the 404 page follows 404 standards.
希望 404 页面遵循 404 标准。
If the above isn't an option, the only other possibility may be to check the title, and/or H tags, for " 404 ". While this is most certainly less than ideal (I'd love to see, "404, Movie not Found, the Movie."), it is your only other option.
如果以上不是一个选项,唯一的另一种可能性可能是检查“404”的标题和/或 H 标签。虽然这肯定不太理想(我很想看到“404,找不到电影,电影。”),但这是您唯一的其他选择。
$('#iframe').load(function (e) {
var iframe = $("#iframe")[0];
if ( iframe.innerHTML() ) {
// get and check the Title (and H tags if you want)
var ifTitle = iframe.contentDocument.title;
if ( ifTitle.indexOf("404")>=0 ) {
// we have a winner! probably a 404 page!
}
} else {
// didn't load
}
});
回答by mirmdasif
Suppose this is your html
假设这是你的 html
<html>
<head></head>
<body>
<iframe id="iframe"></iframe>
</body>
</html>
There are two scenario
有两种情况
Your iframe's src is in the same domain from where your page is originated.
Ex : page url www.example.com and iframe's src www.example.com/iframe
You can use jQuery ajax request to check if the the resource is available
$(function() { $.ajax({ type : "HEAD", async : true, url : "www.example.com/iframe" }) .success(function() { $("#iframe").attr("src", "www.example.com/iframe"); }) .error(function(){ // Handle error perhaps a failover url }) });
Your iframe's src is not pointing to the same domain from where your page was originated.
Ex : Page url www.example.com and iframe's src www.otherdomain.com/iframe
Now browsers will not let you make a cross site request from javascript code due to cross origin policy. The way around is to make a jsonp request.
$(function() { $.ajax({ url: "www.otherdomain.com/iframe", dataType: "jsonp", timeout: 5000, success: function () { $("#iframe").attr("src", "www.otherdomain.com/iframe"); }, error: function (parsedjson) { if(parsedjson.status == "200") { $("#iframe").attr("src", "www.otherdomain.com/iframe"); } else { // Handle error } } }); });
您的 iframe 的 src 位于您的页面来源的同一域中。
Ex : page url www.example.com and iframe's src www.example.com/iframe
您可以使用 jQuery ajax 请求来检查资源是否可用
$(function() { $.ajax({ type : "HEAD", async : true, url : "www.example.com/iframe" }) .success(function() { $("#iframe").attr("src", "www.example.com/iframe"); }) .error(function(){ // Handle error perhaps a failover url }) });
您的 iframe 的 src 未指向您的页面源自的同一个域。
Ex : Page url www.example.com and iframe's src www.otherdomain.com/iframe
现在,由于跨源策略,浏览器不会让您从 javascript 代码发出跨站点请求。解决方法是发出一个jsonp request。
$(function() { $.ajax({ url: "www.otherdomain.com/iframe", dataType: "jsonp", timeout: 5000, success: function () { $("#iframe").attr("src", "www.otherdomain.com/iframe"); }, error: function (parsedjson) { if(parsedjson.status == "200") { $("#iframe").attr("src", "www.otherdomain.com/iframe"); } else { // Handle error } } }); });