使用 iframe 和 jQuery 从其他站点检索元素

Question

我正在尝试创建一个网站，该网站从另一个网站检索数据，然后将其粘贴到我网站上的表格中。我试图通过 iframe 和 jQuery 来做到这一点。目前，我不关心粘贴数据。我只是想让 jQuery 检索包含我需要的数据的 div。

这是我的 iframe 代码：

<iframe id="data1" src="http://example.example" hidden="true"></iframe>

id 为 frStatus2 的 div 位于 html 文档的正文中。

这是我的 javascript/jQuery 代码：

$(document).ready(function(){
var x = $('#data1').contents().find('#frStatus2').html();
console.log(x);
});

我在谷歌上搜索了一段时间后想出了这个。

感谢您的宝贵时间。

Answer 1

如果 iFrame 的来源是另一个网站，则您无法使用 JavaScript 访问 iFrame 的内容，因为这会破坏 same-origin policy。您需要在服务器端执行此操作。如果您尝试访问的站点有 JSONP API，您应该使用它，否则您可以实现自己的。

想想如果您被允许访问 iFrame 的内容会有多不安全。假设您使用此 iFrame 方法在后台加载了一堆银行网站、社交网络等，并通过解析 HTML 来测试它们是否已登录。然后，您将能够做各种令人讨厌的事情，从转移资金到更改密码和抓取个人信息。

您可以访问 iFrame 内容的唯一时间是域、协议和端口都匹配。