1

我是使用 YouTube API 播放器的新手。

我正在构建一个chrome 扩展来使用 YouTube 的 API。为了使用播放器,我创建了一个方法来进行此操作:

popup.js:

   jQuery(document).ready(function()

    {    

   Player();
    });

 // Creating the player
 function Player(){
   var tag = document.createElement('script');
   tag.src = "//www.youtube.com/iframe_api";
   var firstScriptTag = document.getElementsByTagName('script')[0];
   firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);  
 }


 function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
      height: '1',
      width: '1',
      playerVars: {
                showinfo: '0',        
                controls: '0',
                autohide: '1',
                enablejsapi:'1',
                origin:"http://localhost/myapp"
        },
         events: {
        'onReady': IframeReady,
        'onStateChange': StateChange
        }
         });    
      }


      function IframeReady(event) {

player.addEventListener("onStateChange", "StateChange");
player.addEventListener("onError", "PlayerError");
player.setPlaybackQuality('hd720');
gettingInfo();
              }


 I get the music information (playlits) by using a search function, something like this:


    httpReq.open("GET","https://gdata.youtube.com/feeds/api/videos/-/Music/?v=2&alt=json&orderby="+"relevance"+"&start-index="+"1"+"&max-results="+"10"+"&q="+query);

上述功能完美!我得到了整个播放列表。问题是当我尝试播放视频动作(播放列表)时,播放器似乎无法正常工作。

通过使用 chrome 扩展中的 Inspect 功能,我收到了以下警告:

无法加载资源 chrome-extension://www.youtube.com/iframe_api

我试图通过以下方式解决此问题:

  1. 通过放入清单文件:

      "content_security_policy": 
       "script-src 'self' 'unsafe-eval'; https://www.youtube.com/player_api https://s.ytimg.com/yts/jsbin/www-widgetapi-vfljlXsRD.js; object-src 'self'"
    
  2. 通过把 popup.html 这个:

        <script type="text/javascript" src="//www.youtube.com/iframe_api"></script>
    

谁能告诉我我该如何解决这个问题。

非常感谢。

4

0 回答 0