从 iFrame 重定向父窗口在 Safari 中不起作用答案

【问题标题】：Redirect parent window from iFrame not working in Safari从 iFrame 重定向父窗口在 Safari 中不起作用
【发布时间】：2019-12-05 18:42:30
【问题描述】：

我的网站是 mysite.com。我正在构建 othersite.com 并让我的用户完成一项任务。

我可以通过 API 检查我的用户是否已完成 othersite.com 上的任务。但是，我想找出另一种方法来确定用户何时完成任务，以便我可以导航到 mysite.com 上的下一页。

当用户在 othersite.com 上完成任务时，othersite.com 会将他们重定向到 mysite.com/complete/ -- 在 iframe 内。我一直在利用这一点，将以下 JS 代码放在 mysite.com/complete/

window.top.location == 'mysite.com/next';

使父窗口自动推送到下一页。我已经在 Chrome 上进行了这项工作，但在 Safari 上它会重定向内部 iframe，而不是父级。

是什么导致了 Chrome 和 Safari 之间的差异？有没有更好的方法来实现这个目标？

注意：我已经看到了这个 this answer，所以 Safari 中的 window.top.location 函数似乎发生了一些事情，但即使尝试修复我也无法逃避内部 iframe。

【问题讨论】：

标签： javascript iframe safari

【解决方案1】：

你不能那样做。大多数浏览器都不允许跨站点脚本。

但是，您可以通过此处描述的跨文档消息传递与其他窗口通信：https://developer.mozilla.org/en/DOM/window.postMessage

您最多可以从弹出窗口向开启器发送消息，并在开启器中收听此类消息。然后开瓶器必须自行更改其位置。

父窗口：

<script language="javascript">

function open_a_window() 
{
    var w = 200;
        var h = 200;
        var left = Number((screen.width/2)-(w/2));
        var tops = Number((screen.height/2)-(h/2));

        window.open("window_to_close.html", '', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+tops+', left='+left);

   return false;
}

// opener:
window.onmessage = function (e) {
  if (e.data === 'location') {
    window.location.replace('https://www.google.com');
  }
};

</script>

<input type="button" onclick="return open_a_window();" value="Open New Window/Tab" />

弹出窗口：

<!DOCTYPE html>
<html>
<body onload="quitBox('quit');">

<h1>The window closer:</h1>

<input type="button" onclick="return quitBox('quit');" value="Close This Window/Tab" /> 


<script language="javascript">

function quitBox(cmd) 
{      
    if (cmd=='quit')    
    {   
       window.opener.postMessage('location', '*');
       window.open(location, '_self').close();    
    }     
    return false;   
}

</script>

</body>
</html>

【讨论】：