【发布时间】：2015-07-19 01:10:27
【问题描述】：
我使用两个使用 YouTube Iframe API 的指令将 Youtube 视频嵌入到我的 Angular 应用程序中。第一个异步加载库
angular.module('myApp')
.service('youTubeService', function($rootScope, $window) {
var self = this;
self.ready = false;
$window.onYouTubeIframeAPIReady = function () {
self.ready = true;
console.log("Youtube service ready");
$rootScope.$broadcast('youTubeServiceReady', true);
};
var tag = document.createElement('script');
tag.src = '//www.youtube.com/iframe_api';
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
});
然后我使用 javascript 库嵌入视频
angular.module('myApp')
.directive('youtube', function (youTubeService) {
return {
link: function (scope, element, attrs) {
var player;
var playerReady = false;
var playerState;
var callback;
var carouselScope = element.parent().parent().scope();
function createPlayer() {
player = new YT.Player(element[0], {
height: attrs.height,
width: attrs.width,
videoId: attrs.youtube,
playerVars: { 'start' : attrs.starttime, 'end' : attrs.endtime, 'origin': 'https://', showinfo: 0, modestbranding: 1 },
events: {
onReady: function () {
playerReady = true;
// if (callback !== null) {
// callback();
// }
},
onStateChange: function (event) {
//console.log("Time:" + getCurrentTime() + ", Duration:" + getDuration() );
playerState = event.data;
if (playerState === YT.PlayerState.PAUSED) {
carouselScope.play();
}
}
}
});
}
if (youTubeService.ready) {
createPlayer();
} else {
scope.$on('youTubeServiceReady', function () {
createPlayer();
});
}
...
直到昨天为止，这已经工作了几个月，但现在我得到了以下视频，因为我嵌入了所有桌面浏览器，如此处所述
https://support.google.com/youtube/answer/6098135?hl=en-GB
我的问题是我不知道我应该改变什么，因为据我了解 iframe api 是正确的。有谁知道我应该改变什么？
【问题讨论】：
-
服务和指令代码看起来不错；但是，看起来您正在加载通过指令 (attrs.youtube) 上的属性提供的 youtube ID。那个属性是怎么设置的……是手动的吗？还是从数据 API 获取的 ID？如果是后者，那么该来源很可能正在使用现已停用的 V2 API。
-
由于这个确切的问题，我们的整个网站都被破坏了 :( 与我们的代码的唯一区别是
onYouTubeIframeAPIReady被放在 Angular 应用程序之外，并且承诺会定期检查全局设置就绪的 bool . -
另外，更奇怪的是，一些嵌入在我们的网站中使用相同的确切代码工作。
-
@jlmcdonald - 感谢您为我指明正确的方向。我们使用使用 V2 api 的 rails gem 在我们的 id 中获取视频。当我们切换到一个新的 gem 时，一切都恢复正常了。如果您发表评论作为答案，我会接受
标签： youtube youtube-api embed