Question

我的网站iframe内有一个注册表单，我想在iframe的网址发生变化时（当用户成功注册时）创建重定向。

这两个网站是跨域的，我知道几乎不可能提取网址跨域，但是有解决方法吗？我知道src不会改变，我想使用onload()，当iframe第二次加载时（当用户成功注册时），执行一个函数重定向到感谢页面。

Answer 1

以下是使用javascript“ Porthole ”的示例。

可能，但请记住iframe的安全问题。解决方案：如果您可以控制原始页面+ iframe，则可以通过在双方实施一些javascripts来“欺骗”浏览器。

首先在两个域上创建一个“代理”页面。将其命名为'proxy.html'或其他（注意：您必须使用'porthole.min.js'，您可以从底部的来源获取此信息）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <!-- Replace the url with your own location -->
        <script type="text/javascript" src="porthole.min.js"></script>
        <script type="text/javascript">
            window.onload=function(){ Porthole.WindowProxyDispatcher.start(); };
        </script>
    </head>
    <body>
    </body>
</html>

在父页面上（请参阅 iframe proxy.html页面）

<script type="text/javascript" src="porthole.min.js"></script>
<iframe id="guestFrame" name="guestFrame" src="http://iframe.otherdomain.com/"></iframe>

<script type="text/javascript">
var iframeDomain = 'http://iframe.otherdomain.com';
var redirectUrl = 'http://www.mydomain.com/redirect-to/signed-up';

function onMessage(messageEvent) {
    if (messageEvent.origin == iframeDomain) {
        if (messageEvent.data["action"]
         && messageEvent.data["action"] == 'signed-up) {
            window.location.href = redirectUrl; // The final action!
            // This is the eventual redirect that will happen
            // once your visitor has signed-up within the iframe
        }
    }
}
var windowProxy;
window.onload=function(){ 
    // Create a proxy window to send to and receive messages from the iFrame
    windowProxy = new Porthole.WindowProxy(
        'http://iframe.otherdomain.com/proxy.html', 'guestFrame');

    // Register an event handler to receive messages;
    windowProxy.addEventListener(onMessage);
};
</script>

在 iframe页面（请参阅父 proxy.html页面）

<script type="text/javascript">
var windowProxy;
window.onload=function(){ 
    // Create a proxy window to send to and receive messages from the parent
    windowProxy = new Porthole.WindowProxy(
        'http://www.mydomain.com/proxy.html');

    // Register an event handler to receive messages;
    windowProxy.addEventListener(function(event) { 
        // handle event (not used here, the iframe does not need to listen)
    });
};
</script>

从iframe中，您可以使用javascript向父页面发送消息（以及其他方式）。如果您在iframe域中仅使用1个javascript，则可以执行以下操作，以便在将URL更改为特定内容时将消息发送到父框架，例如“signed-up.php”（未经测试，但您将会得到这个想法）

<script type="text/javascript">
window.onload=function(){
    if(window.location.href.indexOf("signed-up.php") > -1) {
        windowProxy.post({'action': 'signed-up'}); // Send message to the parent frame
        // On the parent page, the function 'onMessage' is triggered.
    }
};
</script>

<强>来源：

http://ternarylabs.github.io/porthole/
Github：https://github.com/ternarylabs/porthole
演示：http://sandbox.ternarylabs.com/porthole/

iFrame网址更改时执行功能

1 个答案: