首页 > 解决方案 > 谷歌浏览器阻止了 iframe 中 window.top.location 的重定向

问题描述

我想将我的网站从 iframe 重定向到主 url,这是我的代码:

window.setTimeout(function() {
    window.top.location = jQuery("link[rel=canonical]").attr("href") + "#ref=shahrekhabar";
    return false;
}, 100);

它适用于 Firefox,但 Google Chrome 阻止了这种类型的重定向。我尝试window.top.location.hrefwindow.top.location.replacewindow.top.location.assign没有运气。

原因:

一些垃圾邮件网站在 iframe 中显示我的网站,我想逃离它们,我认为重定向是一个很好的解决方案。

标签: javascriptredirect

解决方案


编辑以回答 TRUE 问题:

堆栈溢出的一个常见问题是,用户经常会问如何做他们认为可以解决他们遇到的问题的事情,而不仅仅是问我们如何解决问题。我们总是很高兴听到您如何尝试解决您的问题,但如果我们知道这一点以及根本问题是什么总是最好的。因此,就您而言,鉴于您对我的回答的评论,问题应该是:

目前我的网站在我无法控制的网站上显示在 iframe 中?我想阻止他们这样做,我该怎么做?我目前正在尝试将我的网站从 iframe 重定向到主 url,但它不适用于 Chrome。...剩下的问题...

鉴于这个问题,我原来的答案是无用的:

  • 您仍然不能也不应该能够更改父窗口的 URL。
  • 您不拥有在 iframe 中显示您的页面的网站,这意味着您无法注册侦听器来处理 postMessage 或 CustomEvent。

有趣的是,您尝试做的是chrome不允许您这样做的确切原因哈哈哈。但别担心,仍然有解决方案。

介绍 CORS!

CORS 或跨域资源共享是一个域上的站点访问不在同一域上的资源时的名称。谁拥有任何一个站点都没有关系,如果两个域不同,它就是 CORS。现在这对您有好处,因为有诸如 CORS 策略之类的东西,如果他们提出 CORS 请求,您甚至可以阻止任何人访问您域上的资源。请记住,这意味着您无法在另一个网站的 iframe 中显示您的网站,除非它们位于同一域中,但听起来这对您来说可能是值得的。

如果您好奇,与您尝试做的不同,使用 CORS 策略对于不希望他们的网站出现在 iframe 中的开发人员来说是非常标准的程序,并且实际上被 facebook 等著名网站使用, google,甚至是好的 ole stackoverflow(我知道,不久前我试图通过 iframes 同时查看多个问题)。我在下面提供了一个示例,表明这一切都是正确的,以及一个无关紧要的网站示例 (editpad.org)。为了在您的网站上实现这一点,请查看此链接

<iframe src="https://www.editpad.org/"> </iframe>
<iframe src="https://www.google.com/"> </iframe>
<iframe src="https://www.facebook.com/"> </iframe>
<iframe src="https://stackoverflow.com/posts/53917955"> </iframe>

旧答案:

所以你想从 iframe 改变父窗口的位置?这听起来非常危险,而 Firefox没有阻止它的事实让我担心。干得好铬!

你为什么不想要这个?

我可以想到一些你不想要这个的原因,但最大的原因是它只是糟糕的编程。一个页面应该完全独立于它是否在 iframe 中工作,即使页面应该只在 iframe 中查看,它也不应该以这种直接的方式与父窗口交互。

如果在所有平台上都允许这样做,可能会出现的问题:

  • 在您的广告中包含 iframe,一旦您的广告显示,将用户重定向到您的网站,或者更糟的是,将他们重定向到您托管的当前网站的镜像,以收集密码/个人信息。
  • 如果您可以弄乱窗口位置(可以说是关于正在查看的网页最重要和最静态的事情),为什么您不能弄乱任何东西?您可以进入父窗口并调整 DOM 或对类型的输入进行查询选择password以复制值吗?或者如何将事件侦听器静默地附加到父窗口,以便您可以记录任何和所有按键。

你怎么能解决它?

不要太担心我上面提到的问题,因为它们都可以通过遵循适当的标准来避免。事实上,JavaScript 开发人员预想了这个确切的问题,这就是为什么您可以跨窗口发布消息的原因。查看此链接并从那里开始,如果您有任何问题,请随时发表评论,但它应该像发布消息一样简单,在父窗口上检测它,然后根据需要更改位置。

如果您需要将数据从 iframe 发送到父窗口,或者您的 iframe 未托管在同一个域中,则可以改用 CustomEvents(即使我的 iframe 在同一个域中,我也更喜欢),它允许您附加一个数据对象。

至于为什么这两种方案都比直接操作父窗口好,都是因为父窗口需要为消息/自定义事件注册监听器。如果您的页面不在 iframe 内,它只会向自身发布一条消息,而该消息不会被监听。如果您的页面位于它应该在的页面上的 iframe 内,则您的父页面应该已经注册了适当的侦听器。并且没有机会恶意使用这些功能,因为再次,我必须注册一个侦听器,并且我选择在事件被捕获后如何处理。


推荐阅读