Javascript 获取跨域iframe的DOM内容
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6170925/
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
Get DOM content of cross-domain iframe
提问by D-Nice
I have an iframe for a cross-domain site. I want to read the DOM of the iframe, which I believed was possible because using the inspector, I can even modify the DOM of an iframe. Every way I attempt to read it, however, I run into the same origin policy. All I want, is the content loaded in my local DOM, from the iframe. I thought it would be as simple as $(document.body).find('iframe').html(), but that's returning the empty string.
我有一个跨域站点的 iframe。我想读取 iframe 的 DOM，我认为这是可能的，因为使用检查器，我什至可以修改 iframe 的 DOM。然而，我尝试阅读它的每一种方式都遇到了同源策略。我想要的只是从 iframe 加载到本地 DOM 中的内容。我认为它会像 一样简单$(document.body).find('iframe').html()，但这会返回空字符串。
I really hope there's a way to do this since the work I've been doing for the last several days has been predicated on this being do-able.
我真的希望有一种方法可以做到这一点，因为我过去几天一直在做的工作是基于这是可行的。
Thanks
谢谢
回答by Máthé Endre-Botond
You can't. XSS protection. Cross site contents can not be read by javascript. No major browser will allow you that. I'm sorry, but this is a design flaw, you should drop the idea.
你不能。XSS 保护。javascript 无法读取跨站点内容。没有主流浏览器会允许你这样做。对不起，但这是一个设计缺陷，你应该放弃这个想法。
EDIT
编辑
Note that if you have editing access to the website loaded into the iframe, you can use postMessage(also see the browser compatibility)
请注意，如果您对加载到 iframe 中的网站具有编辑权限，则可以使用postMessage（另请参阅浏览器兼容性）
回答by Clément Gournay
There is a simple way.
有一个简单的方法。
You create an iframe which have for source something like "http://your-domain.com/index.php?url=http://the-site-you-want-to-get.com/unicorn
Then, you just get this url with
$_GETand display the contents withfile_get_contents($_GET['url']);
您创建了一个 iframe，它的源代码类似于“ http://your-domain.com/index.php?url=http://the-site-you-want-to-get.com/unicorn
然后，您只需获取此 url
$_GET并显示内容file_get_contents($_GET['url']);
You will obtain an iframe which has a domain same than yours, then you will be able to use the $("iframe").contents().find("body")to manipulate the content.
您将获得一个域与您的域相同的 iframe，然后您将能够使用$("iframe").contents().find("body")来操作内容。
回答by devmatt
If you have access to the iframed page you could use something like easyXDMto make function calls in the iframe and return the data.
如果您有权访问iframe页面，则可以使用诸如easyXDM 之类的东西在 iframe 中进行函数调用并返回数据。
If you don't have access to the iframed page you will have to use a server side solution. With PHP you could do something quick and dirty like:
如果您无权访问 iframe 页面，则必须使用服务器端解决方案。使用 PHP，你可以做一些快速而肮脏的事情，比如：
<?php echo file_get_contents('http://url_of_the_iframe/content.php'); ?>
回答by Maksim Luzik
If you have an access to that domain/iframe that is loaded, then you can use window.postMessage to communicate between iframe and the main window.
如果您有权访问加载的域/iframe，那么您可以使用 window.postMessage 在 iframe 和主窗口之间进行通信。
Read the DOM with JavaScript in iframe and send it via postMessage to the top window.
在 iframe 中使用 JavaScript 读取 DOM 并通过 postMessage 将其发送到顶部窗口。
More info here: https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
更多信息：https: //developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
回答by Thuy Nguyen
There's a workaround to achieve it.
有一个解决方法来实现它。
First, bind your iframe to a target page with relative url. The browsers will treat the site in iframe the same domain with your website.
In your web server, using a rewrite module to redirect request from the relative url to absolute url. If you use IIS, I recommend you check on IIRF module.
首先，将您的 iframe 绑定到具有相对 url 的目标页面。浏览器会将 iframe 中的站点视为与您的网站相同的域。
在您的 Web 服务器中，使用重写模块将请求从相对 url 重定向到绝对 url。如果您使用 IIS，我建议您检查IIRF 模块。
