私は YouTube API プレーヤーを使用する初心者です。
YouTube の API で動作するようにchrome 拡張機能を構築しています。プレーヤーを使用するために、これを行うメソッドを作成しました。
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 を読み込めませんでした
次のことを行って、この問題を修正しようとしました。
これをマニフェストファイルに置くことにより:
"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'"
これをpopup.htmlに置くことで:
<script type="text/javascript" src="//www.youtube.com/iframe_api"></script>
この問題を解決するにはどうすればよいですか。
どうもありがとうございました。