在amp-iframe中的amp页面上显示

Question

我试图在放大器文档上实现Disqus。我的想法是使用一个amp-iframe，它加载一个只包含Disqus的小文档。我用了这个放大器框架

<amp-iframe width="300" height="300"
            layout="responsive"
            sandbox="allow-forms allow-modals allow-popups allow-popups-to-escape-sandbox allow-scripts"
            resizable
            frameborder="0"
            seamless
            src="/disquss/name-of-blog-post">
    <div overflow tabindex=0 role=button aria-label="Read more">more!</div>
</amp-iframe>

但是，chrome抛出内容安全策略违规：

拒绝加载脚本'https://a.disquscdn.com/next/embed/lounge.load.f3e1717b71e7256da258d3a504e56865.js‘，因为它违反了以下内容安全策略指令：" script -src https:// https://api.adsnative.com/v1/ad.json *.adsafeprotected.com https://cas.criteo.com/delivery/0.1/napi.jsonp .services.disqus.com：http://referrer.disqus.com/juggler/ disqus.com http:// a.disquscdn.com https://referrer.disqus.com/juggler/ https:// *.moatads.com’不安全-eval‘https://mobile.adnxs.com/mob https://ssl.google-analytics.com“。

因此，基本上，即使允许使用https://a.disquscdn.com/next/embed/lounge.load.f3e1717b71e7256da258d3a504e56865.js，chrome也不会加载a.disquscdn.com。此限制来自iframe disqus使用。当我使用本地沙箱<iframe>而不是<amp-iframe>时，这并不是一个问题。

我想要创建一个示例，但是由于iframe结构，我不能简单地创建一个jsfiddle。

Answer 1

它似乎是这个bug的一个实例：https://code.google.com/p/chromium/issues/detail?id=541221

如果使用sandbox属性，也会使用标准的iframe来执行。

将allow-same-origin添加到沙箱定义似乎可以修复它。我注意到现在Firefox中的情况也是一样的，尽管那个bug中有这样的注释(尽管firefox没有明确列出错误)，但它在那里工作。所以也许这就是它应该工作的方式？我不能说我对沙箱属性知道得够多，不能告诉你。

不过，顺便说一句，我不确定这是个好主意。你会有一个非AMP版本的这一页吗？就我个人而言，我不认为AMP只是一个页面，因为我认为这限制了您，因为在AMP中不是所有的事情都是可能的；2)有些客户端不会加载这个页面(例如，如果没有javascript，或者不理解AMP)，所以我也更喜欢有一个真正的HTML页面。但是，如果您确实有单独的HTML和AMP页面，那么它们将分别跟踪评论(除非您将非AMP页面加载到这个iframe中，并以某种方式隐藏除了注释之外的所有内容--但这似乎完全是浪费！)

所以，我现在实现这一点的方法是添加一个“点击这里查看评论”链接到我的AMP页面，将它们带到完整的页面，并附带注释。这不是一个很好的解决方案，但至少要把评论放在一起。