Disqus在amp-iframe內的amp頁面上

Question

我嘗試在amp文檔上實現Disqus。我的想法是使用加載僅包含Disqus的小文檔的amp-iframe 。我用這款音箱架

<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> 

然而，鉻拋出一個內容安全策略違規：

拒絕，因爲它違反了以下內容安全策略指令加載腳本 「https://a.disquscdn.com/next/embed/lounge.load.f3e1717b71e7256da258d3a504e56865.js」 ： 「 script-src https：// .twitter.com： 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：// .twitter.com： a.disquscdn.com https://referrer.disqus.com/juggler/ https：//開頭.services.disqus.com： * .moatads.com '不安全-EVAL' https://mobile.adnxs.com/mobhttps://ssl.google-analytics.com「。

所以基本上，即使a.disquscdn.com被允許，chrome也不加載https://a.disquscdn.com/next/embed/lounge.load.f3e1717b71e7256da258d3a504e56865.js。這種限制來自iframe disqus使用。當我使用本機沙盒而不是<amp-iframe>時，這不是問題。

我很想創建一個例子，但由於iframe構造，我不能簡單地創建一個jsfiddle。

Answer 1

這似乎是這個錯誤的實例： https://code.google.com/p/chromium/issues/detail?id=541221

同樣的事情不與標準的iframe，如果使用沙箱屬性發生。

將allow-same-origin添加到您的沙箱定義似乎修復它。我注意到現在Firefox也是如此，儘管該bug中的評論（儘管firefox並沒有明確列出錯誤），它在那裏工作。所以也許這是它應該如何工作？不能說我對沙箱屬性有足夠的瞭解來告訴你。

但是，不管怎樣，我不確定這是一個好主意。你會有這個網頁的非AMP版本嗎？就我個人而言，我沒有看到只有AMP頁面的情況，因爲我認爲這會限制你，因爲1）並非所有事情都可能在AMP中; 2）有些客戶端不會加載此頁面（例如，如果沒有javascript，或者不理解AMP ），所以我更喜歡有一個真正的HTML頁面。但是，如果你確實有單獨的HTML和AMP頁面，那麼他們將單獨跟蹤評論（除非你將非AMP頁面加載到此iframe中，並以某種方式隱藏了除註釋外的所有內容 - 但這似乎是一種完全浪費！）。

所以我目前實施的方式是添加一個「點擊這裏查看評論」鏈接到我的AMP頁面，帶他們到整頁 - 帶評論。不是一個很好的解決方案，但至少可以一起留下評論