使用requirejs嵌入instagram視頻

我正嘗試使用requirejs將instagram視頻嵌入到我的單頁應用程序中。使用requirejs嵌入instagram視頻

的嵌入一塊從Instagram的代碼如下：

<\blockquote class="instagram-media" data-instgrm-captioned data-instgrm-version="6" style=" bunch of css ">bunch of html<\/blockquote> 
<\script async defer src="//platform.instagram.com/en_US/embeds.js"><\/script>

現在我需要做的，顯示的Instagram的帖子在我的網站是包括<\blockquote>在我的HTML，並能夠加載//platform.instagram.com/en_US/embeds.js腳本。

問題是，因爲我使用的是requirejs，所以我不能只將<\script>標籤放在html中，我必須使用require來加載它。爲此，我嘗試了這些解決方案：

我使用「//platform.instagram.com/en_US/embeds.js」代碼創建了一個js文件。在require.config.js：

paths: {"instagram-embed": "/path/to/embed.js/file"}

，只是包括它在我的ViewModel：

define(["instagram-embed"], function(){});

此解決方案不起作用。試圖加載它，當

define("async!http://platform.instagram.com/en_US/embeds.js", function(){}

requirejs只是超時：

我也試圖與異步插件加載它。

我出來的想法。請幫忙。

來源

2016-05-09 EoiFirst

什麼是像'<\blockquote>'奇怪的僞標籤？這不是有效的HTML語法。另外，我強烈建議提供您正在使用的代碼的實例。 RequireJS和Instagram都不是很多人。通過不提供現場示例，您大大減少了獲得答案的可能性。 – Louis

我發現了一個工作解決方案，但它不是真正的乾淨。

事情是，instagram embbed需要「激活」後使用window.instgrm.Embeds.process();包括//platform.instagram.com/en_US/embeds.js後。

我仍然無法使用要求，仍超時的文件包含加載模塊，但我設法讓它通過，包括它通過<script>標籤在我的index.html工作：

 /* REQUIRE CONFIG AND STARTUP */ 
     <script src="app/require.config.js"></script> 
     <script data-main="app/startup" src="bower_modules/requirejs/require.js"></script> 

     /* INSTAGRAM EMBBEDS */ 
     <script async defer src="//platform.instagram.com/en_US/embeds.js"></script> 
     <script type="text/javascript"> 
      function instagramEmbbedCheck() { 
       if (typeof window.instgrm === 'undefined') 
        setTimeout(instagramEmbbedCheck, 3000); 
       else 
        window.instgrm.Embeds.process(); 
      } 
      instagramEmbbedCheck(); 
     </script>

我需要要使用至少2秒的setTimeout來運行，這是一個很大的問題。現在，這是唯一的方法，我發現我的網站使用instagram embbeds通過require（而不是通過requirejs ...）

來源

2017-01-16 09:11:23 EoiFirst

使用requirejs嵌入instagram視頻

回答

相關問題