javascript - 重新加载 iframe 内容后获取 iframe 的 URL

Question

我正在开发一个相位游戏，该游戏将通过 iframe 嵌入到网站中。该游戏支持多种语言，因此我们已经开始使用访问该游戏的站点作为指标（phaser-game.com/ru 将使用俄语，phaser-game.com/ar 将使用阿拉伯语等） .

这是到目前为止的代码（通过window.addEventListener('load', getDomainSetLanguage);以下方式触发：

function getDomainSetLanguage()

{

    let url = (window.location !== window.parent.location) ? document.referrer : document.location.href;

    console.log('url = ' + url);

    for (let i = 0; i < COUNTRIES_DOMAIN.length; i++)

    {

        if (url.indexOf(COUNTRIES_DOMAIN[i].URL) >= 0)

        {

            DOMAIN_ID = COUNTRIES_DOMAIN[i].ID;

            LANGUAGE_ID = COUNTRIES_DOMAIN[i].LANGUAGE_ID;

            break;

        }

    }

    if (DOMAIN_ID === -1)

    {

        DOMAIN_ID = 1;

    }

    if (LANGUAGE_ID === -1)

    {

        LANGUAGE_ID = 1;

    }

    console.log('DOMAIN_ID = ' + DOMAIN_ID + "; LANGUAGE_ID = " + LANGUAGE_ID);

}

现在这在表面上工作正常。但是，游戏确实会时不时地触发重新加载，并且当游戏返回时，它现在会获得自己的 URL，而不是父级 / iframe 的 URL。

这是游戏语言默认为英语的结果。

请注意，这仅发生在 Chrome 和 Safari 中。FireFox 工作得很好。

有什么我想念的吗？或者还有什么我可以尝试的吗？

我试过记录document.referrerand的值document.location.href，但我只是收到有关权限和内容的浏览器错误，游戏默认为英语。

我从这里读到Chrome（可能还有 Safari）不会触发 iframe 中对象的 onload 功能，但我不确定这是否适用于我，因为我有很多其他与 onload 相关的功能可以工作.

需要说明的是，我无法修改iframe本身，因此任何解决方案都必须来自游戏本身。

Answer 1

let url = (window.location !== window.parent.location) ? document.referrer : document.location.href;代码中的这一行使得当您在 iframe 中时，document.referrer用作确定语言的 URL。根据Document.referrer 上的MDN 页面：该Document.referrer属性返回链接到此页面的页面的 URI。在 内<iframe>，Document.referrer最初将设置为与href父窗口的相同的值Window.location。这意味着它可以在初始加载时正常工作，正如您所经历的那样。据我所知，规范并没有明确说明如何处理重新加载。这可能是浏览器行为差异的原因。认为重新加载后它应该是空的并不是太疯狂，因为当时它不是从父页面加载的。另一种解决方案是使用window.parent.location.href，它始终引用iframe父窗口的 URL （在 document.referrer 和 window.parent.location.href 之间的区别中阅读更多内容）。您的代码行可能如下所示：// if parent and child href are equal, using either yields the same result// if there is no parent, window.parent will be equal to window// therefore, the conditional statement isn't necessary&nbsp;let url = window.parent.location.href;