javascript 检测iframe是否跨域的万无一失的方法
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12381334/
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
Foolproof way to detect if iframe is cross domain
提问by user730569
I'm trying to determine if any iframe is cross-domain or not. According to the accepted answer in this question: Detect when iframe is cross-domain, then bust out of itit says to put the code accessing the contentDocumentof the iframe in a try / catchblock. I tried this for a cross-domain iframe in Chrome:
我正在尝试确定是否有任何 iframe 是跨域的。根据这个问题中接受的答案：检测 iframe 何时是跨域的，然后退出它说要将访问contentDocumentiframe的代码放在一个try / catch块中。我在 Chrome 中为跨域 iframe 尝试了这个：
try {
document.getElementsByTagName('iframe')[0].contentDocument;
} catch(err){
console.log("called");
}
and it still throws the cross-domain error and does not catch the error.
并且它仍然抛出跨域错误并且没有捕获错误。
I also tried to check if the protocol + host + port of the parent page url is in the srcof the iframe:
我还尝试检查父页面 url 的协议 + 主机 + 端口是否在srciframe 中：
function thirdPartyIframe(iframe){
var url = document.location.protocol + "//" + document.location.hostname + (document.location.port === "" ? "" : ":" + document.location.port);
var regexp = new RegExp(url.replace(/\//g, "\/").replace(/\./g, "\."));
if (iframe.src === '' || regexp.test(iframe.src)){
return false;
} else {
return true;
}
}
but this does not seem to work for the first iframe on the homepage of Facebook with srcequal to (it's long):
但这似乎不适用于 Facebook 主页上的第一个 iframe，src它等于（很长）：
"http://www.facebook.com/ai.php?aed=AQLlH2cfdnsnLrDUVyqrQPlWpayw9N09Z_iNuhulevbeEfVa4mcVRcT8cjAZOjQb8y1QXab5Ae3aSEJx49U_Qv35rtSp1VC9cY0_CrpOjMDk40hS_Xm57A996YtRVCcWSuRZ_jZERQ_iA_E4621NAbKHT9dsB7uElkRtTvl5K-zPI0jeH-BEnlZIOXbeEdbRC6qCwoToaltolpe-Ot2KWgkfb_vBZYpzUc3jQoEHzLG6tauO9l_hkXpYpHxnt-KYFKIFZ1PgmrHgb0UcGjeKHl7yBR1AbW2n5XgdgaAhFvBjs5GZlKy566nvl8eLRA60orwkwtWYeN8-gKoAmOLm7-6minsWn8lk1h2Qn3p07HCTSnYHfv1aJ6mF5jmuzP0YYe7Ym9ZbmK-tvax4uPAQJ2OdULilKbEh8M-2V9pVY3AC228OPlrRullZuuOg8DI2A8WeMF-fbbOdOFFVCe5Gj1CaZu3LYXiqdG7mUgY6AEpk9ZzGT4fC2K8DInQo1AypCvzG64C_bEWfODeXe0aGbkWwsUUmO7E5HFg0tvZkK5IAR_xxxQ2rlf5jbcEDo_2gdIDdHe1HT75-SJLUsSA0M8EU01oNNPuWwEC2BW6inepc9QPuqeg42tcEbKLU-rIUnXDBLvgutft8azWPPQ6_LafGjCAmC9uTalagoWLLDMpQOThvPg7YeVd7qg_c9Mzn2GAfuswcxDSxyRIZo9MaOhA6mhfXeE1tmjyBBsMxnx08tO21Jsfgch59fmMxpeJzdsNMPK3FAojfglvCQ2Zrt_6ataexUB4xlM7_PhKrfBPtxb5fe2TE9-nlWruNEpoCrzI05yv4Go3CYEWHob06K_9iICfNVTFkSYGTiJnMXCy_fdgfyzUIn5QJIPRo4-Wnyg444zKAO_nyFW59LqbIanHVfFY6ybiA6KeC3meREWzTPSsrU5d_NbYHlJWb8uPNDR04jaH5e2qiYj3Y8qgLQA5m"
My function classifies it as not a third party iframe, but Chrome still throws the cross-domain error when I access its contentDocument.
我的函数将它归类为不是第三方 iframe，但是当我访问它的contentDocument.
I'm looking for a foolproof, cross-browser way to do this.
我正在寻找一种万无一失的跨浏览器方式来做到这一点。
采纳答案by jfriend00
You need to do a little more than what's in your try/catch to handle different browsers and to handle different ways that browsers deal with cross domain access:
您需要做的不仅仅是 try/catch 中的内容来处理不同的浏览器以及浏览器处理跨域访问的不同方式：
function canAccessIFrame(iframe) {
var html = null;
try {
// deal with older browsers
var doc = iframe.contentDocument || iframe.contentWindow.document;
html = doc.body.innerHTML;
} catch(err){
// do nothing
}
return(html !== null);
}
In your example, this would be:
在您的示例中，这将是：
var accessAllowed = canAccessIFrame(document.getElementsByTagName('iframe')[0]);
Working demo: http://jsfiddle.net/jfriend00/XsPL6/
工作演示：http: //jsfiddle.net/jfriend00/XsPL6/
Tested in Chrome 21, Safari 5.1, Firefox 14, IE7, IE8, IE9.
在 Chrome 21、Safari 5.1、Firefox 14、IE7、IE8、IE9 中测试。
回答by crisc82
A more shorter and more readable function for modern browsers
适用于现代浏览器的更短、更易读的函数
function canAccessIframe(iframe) {
try {
return Boolean(iframe.contentDocument);
}
catch(e){
return false;
}
}
Tested with Chrome 79 and Firefox 52 ESR.
使用 Chrome 79 和 Firefox 52 ESR 进行测试。
Explanation: you can check any iframe property that is not accessible cross-origin and convert to boolean. example: contentDocument / contentWindow.document / location.href / etc.
说明：您可以检查任何无法跨域访问的 iframe 属性并转换为布尔值。例如：contentDocument / contentWindow.document / location.href / 等。
Boolean docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean
布尔文档：https: //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Boolean
