2014-04-01 54 views
0

我有一個Chrome擴展程序,當用戶點擊瀏覽器的操作按鈕的擴展顯示瀏覽器操作彈出式內外部內容

  1. 打開彈出
  2. 調用外部API來顯示廣告

這是我有:

popup.html

<div class="v11container" id="v11container">Some Text</div> 
    <script src="http://b.v11media.com/js/client_api/api.js"> </script> //external api 
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> //jquery 
    <script type="text/javascript"> 
v11onload(function() { 
     $.ajax({ 
      url: 'http://localhost:3000/random', 
      success: function(data) { 
      console.log(data); 
      if(data){ 
       var v11_api = new v11('v11container'); 
       v11_api.show(data.click_url); 
      } 
      } 
     }); 
    }); 
    </script> //using the api to show an ad 

理想情況下,我希望在點擊瀏覽器操作按鈕時顯示廣告。但是,所有正在顯示的是「一些文本」。我的控制檯沒有顯示任何錯誤。問題是來自我引用外部JavaScript的事實,還是因爲我完全錯過了某些東西?注意,我已經在正常的HTML頁面上重現了這個API調用,並取得了巨大的成功。所以我不認爲api電話是問題。

同樣爲了將來的功能,我希望基於某些事件顯示廣告。因此,是否有可能使用JavaScript或Chrome功能顯示瀏覽器動作彈出窗口,還是必須以不同的方式進行操作?

如果您需要更多信息,請告知我們。

回答

2

再次檢查您的控制檯,它一定有一些錯誤。注意:您必須檢查負責popup.html(右擊彈出窗口)的控制檯,而不是負責標籤內容的控制檯(Windows上的F12),當然不是負責後臺頁面的控制檯(在chrome> extensions頁面檢查視圖)。內容安全政策說:Inline JavaScript will not be executed。 所以你需要將你的代碼移動到一個JavaScript文件(popup.js)。

其次,不建議使用外部源代碼,但如果你堅持的話,那麼你必須處理在你的清單文件中content_security_policy項目:

"content_security_policy": "default-src 'self'; script-src 'self' https://code.jquery.com/jquery-1.11.0.min.js https://b.v11media.com/js/client_api/api.js", 

注:本腳本 - src白名單您只能使用https,而不是http。

0

以下是我根據提供的答案實施瞭解決方案的方法。感謝您的幫助。

popup.js:

(function() { 
    var v11 = document.createElement('script'); 
    v11.type = 'text/javascript'; 
    v11.async = true; 
    v11.src = 'https://b.v11media.com/js/client_api/api.js'; 
    var s = document.getElementsByTagName('script')[0]; 
    s.parentNode.insertBefore(v11, s); 
})(); 

v11onload(function() { 
    $.ajax({ 
     url: 'http://localhost:3000/random', 
     success: function(data) { 
      console.log(data); 
      if (data) { 
       var v11_api = new v11('v11container'); 
       v11_api.show(data.click_url); 
      } 
     } 
    }); 
}); 

manifest.json的:

所有這一切都在清單中需要的是什麼Skalár搖尾上述在他的回答。

相關問題