AMP：<amp-iframe> 的来源不得等于容器

Question

我想在我的第一个 AMP 项目中解决这个问题，

这是我遇到的问题：

error.js:58:

Origin of <amp-iframe> must not be equal to container

这是我 index.html:

中的 amp-iframe 代码

<amp-iframe
    width=100
    height=100
    layout="nodisplay"
    sandbox="allow-same-origin allow-forms allow-scripts"
    src="https://www.example.com/scripts/app.js">
</amp-iframe>

当我浏览控制台选项卡时，这就是我所拥有的：

Powered by AMP ⚡ HTML – Version 1462999126709

AMP validation successful.

我用<amp-iframe>用外置javascript，我的custom.js

Answer 1

问题是您正在尝试放大与 AMP 来源相同的 iframe 内容。出于安全原因，这是被禁止的（主要与同源策略在 iframe 中使用合成源的方式有关）。

解决方法是确保外部 JS 从不同的来源提供给您的 AMP。因此，如果您的 AMP 在 example.com 上，那么您应该从 SOMEOTHERORIGIN 提供 iframed JS。example.com

Answer 2

您可以通过从沙盒中删除 "allow-same-origin" 属性来解决此问题。但是，您需要修改您的 Header 并将 "access-control-allow-origin" 设置为 "*"，因为您的浏览器会将您的来源检测为 null由于从沙箱中删除了属性。

Answer 3

只需从 sandbox="allow-same-origin allow-forms allow-scripts" 中删除 allow-same-origin。然后，您可以从与 AMP 页面相同的来源提供您的 iframed 内容。

Answer 4

您可以尝试从沙盒中删除 allow-same-origin="allow-same-origin allow-forms allow-scripts" 但在某些情况下它会产生新的错误。

其他可能的解决方法是确保外部 JS 从不同的来源提供给您的 AMP。因此，如果您的 AMP 在 example.com 上，那么您应该从 SOMEOTHERORIGIN 提供 iframed JS。example.com。

如果上面的两个修复都不起作用，因为你有来自你自己域的 iframe 源，我建议你可以尝试 As amp suggests at - https://github.com/ampproject/amphtml/blob/master/spec/amp-iframe-origin-policy.md

'可以通过重定向轻松绕过 AMP 的异源强制执行，因为只测试了初始 URL'。

为了获得重定向，我尝试使用从 tinyURL 站点生成的 url。我创建了我的 url 的一个 tinyURL 并放置在 amp-iframe 的 src 中并且它正在工作。这是一种重定向。

AMP：<amp-iframe> 的来源不得等于容器

AMP: Origin of <amp-iframe> must not be equal to container

amp-html