如何获取iframe的当前URL（而不是src）？

Question

我的代码中有以下iframe。

<iframe src="http://www.w3schools.com" id="myframe" name="myframe" height="100%" width="100%"></iframe>

我需要获取在iframe中进行一些导航后显示的页面的新网址。

我尝试了几种方法，但没有一种能够实现我想要的效果。某些方法返回与src相同的URL。其他人导致安全问题。

如何使用AngularJS完成此操作？

（向朋友询问）

Answer 1

当你评论我的上一个答案时，这是我的new one form Marco Bonelli

同源安全政策

您无法使用javascript访问<iframe>，如果您可以这样做，那将是一个巨大的安全漏洞。对于同源安全策略，任何浏览器都会阻止任何尝试访问具有其他来源的帧的脚本。

例如，如果您在http://www.example.com并希望使用src="http://www.anothersite.com"访问，则您将无法执行此操作，因为该框架具有其他来源。

如果未维护以下至少一个变量，则认为原点不同：

<protocol>://<hostname>:<port>/path/to/page.html

如果要访问框架，协议，主机名和端口必须与您的域相同。

解决方法

即使同源策略阻止脚本操纵具有不同来源的站点内容，如果您拥有这两个域/站点，您可以使用window.postMessage及其相对事件window.onmessage来解决此问题。两页，像这样：

在您的主页：

var frame = document.getElementById('your-frame-id');

frame.contentWindow.postMessage(/*any variable or object here*/, '*');

In your <iframe> (contained in the main page):

window.addEventListener('message', function(event) {

    // IMPORTANT: Check the origin of the data!
    if (~event.origin.indexOf('http://yoursite.com')) {
        // The data has been sent from your site

        // The data sent with postMessage is stored in event.data
        console.log(event.data);
    } else {
        // The data hasn't been sent from your site!
        // Be careful! Do not use it.
        return;
    }
});

Answer 2

没有angularJS的解决方案。 它只是纯粹的js。

document.getElementById("myframe").contentWindow.location.href