Javascript 在iframe中显示之前使用javascript检测url是否存在
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10926880/
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
using javascript to detect whether the url exists before display in iframe
提问by Mario
I'm using javascript to pass a dynamic url to iframe src. but sometimes the url does not exist, how could i detect the non-exist url beforehand, so that i can hide the iframe that with 404 error.
我正在使用 javascript 将动态 url 传递给 iframe src。但有时 url 不存在，我怎么能事先检测到不存在的 url，以便我可以隐藏带有 404 错误的 iframe。
回答by GPrimola
Due to my low reputation I couldn't comment on Derek 朕會功夫's answer. I've tried that code as it is and it didn't work well. There are three issues on Derek 朕會功夫's code.
由于我的名声很低，我无法评论德里克我会功夫的回答。我已经尝试过该代码，但效果不佳。Derek 朕会功夫的密码共有三个问题。
The first is that the time to async send the request and change its property 'status' is slower than to execute the next expression - if(request.status === "404"). So the request.status will eventually, due to internet band, remain on status 0 (zero), and it won't achieve the code right below if. To fix that is easy: change 'true' to 'false' on method open of the ajax request. This will cause a brief (or not so) block on your code (due to synchronous call), but will change the status of the request before reaching the test on if.
The second is that the status is an integer. Using '===' javascript comparison operator you're trying to compare if the left side object is identical to one on the right side. To make this work there are two ways:
- Remove the quotes that surrounds 404, making it an integer;
- Use the javascript's operator '==' so you will be testing if the two objects are similar.
The third is that the object XMLHttpRequest only works on newer browsers (Firefox, Chrome and IE7+). If you want that snippet to work on all browsers you have to do in the way W3Schools suggests: w3schools ajax
第一个是异步发送请求并更改其属性“状态”的时间比执行下一个表达式 - if(request.status === "404") 慢。因此 request.status 最终将由于互联网带宽而保持状态 0（零），并且它不会实现下面的代码。要解决这个问题很简单：在 ajax 请求的方法 open 上将“true”更改为“false”。这将在您的代码上造成一个简短的（或不是这样的）阻塞（由于同步调用），但会在到达 if 测试之前更改请求的状态。
第二个是状态是一个整数。使用 '===' javascript 比较运算符，您尝试比较左侧对象是否与右侧对象相同。要完成这项工作，有两种方法：
- 去掉404周围的引号，使其成为整数；
- 使用 javascript 的运算符 '==' 这样您将测试两个对象是否相似。
第三是对象 XMLHttpRequest 仅适用于较新的浏览器（Firefox、Chrome 和 IE7+）。如果您希望该代码段适用于所有浏览器，您必须按照 W3Schools 建议的方式进行操作：w3schools ajax
The code that really worked for me was:
真正对我有用的代码是：
var request;
if(window.XMLHttpRequest)
request = new XMLHttpRequest();
else
request = new ActiveXObject("Microsoft.XMLHTTP");
request.open('GET', 'http://www.mozilla.org', false);
request.send(); // there will be a 'pause' here until the response to come.
// the object request will be actually modified
if (request.status === 404) {
alert("The page you are trying to reach is not available.");
}
回答by u283863
Use a XHR and see if it responds you a 404 or not.
var request = new XMLHttpRequest();
request.open('GET', 'http://www.mozilla.org', true);
request.onreadystatechange = function(){
if (request.readyState === 4){
if (request.status === 404) {
alert("Oh no, it does not exist!");
}
}
};
request.send();
But notice that it will only work on the same origin. For another host, you will have to use a server-side languageto do that, which you will have to figure it out by yourself.
但请注意，它仅适用于同一来源。对于另一台主机，您将不得不使用服务器端语言来做到这一点，您必须自己弄清楚。
回答by fragmint
I found this worked in my scenario.
我发现这在我的场景中有效。
The jqXHR.success(), jqXHR.error(), and jqXHR.complete() callback methods introduced in jQuery 1.5 are deprecated as of jQuery 1.8. To prepare your code for their eventual removal, use jqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.
jQuery 1.5 中引入的 jqXHR.success()、jqXHR.error() 和 jqXHR.complete() 回调方法自 jQuery 1.8 起已弃用。要为最终删除代码做好准备，请改用 jqXHR.done()、jqXHR.fail() 和 jqXHR.always()。
$.get("urlToCheck.com").done(function () {
alert("success");
}).fail(function () {
alert("failed.");
});
回答by Joseph
You could test the url via AJAX and read the status code - that is if the URL is in the same domain.
您可以通过 AJAX 测试 url 并读取状态代码 - 即 URL 是否在同一域中。
If it's a remote domain, you could have a server scripton your own domain check out a remote URL.
如果是远程域，您可以在自己的域上使用服务器脚本检查远程 URL。
回答by Matt Dodge
You can try and do a simple GET on the page, if you get a 200 back it means the page exists. Try this (using jQuery), the function is the success callback function on a successful page load. Note this will only work on sites within your domain to prevent XSS. Other domains will have to be handled server side
您可以尝试在页面上执行简单的 GET，如果返回 200，则表示该页面存在。试试这个（使用jQuery），该函数是成功页面加载的成功回调函数。请注意，这仅适用于您域内的站点以防止 XSS。其他域将必须在服务器端处理
$.get(
yourURL,
function(data, textStatus, jqXHR) {
//load the iframe here...
}
);
