Chromecast 上的 YouTube iframe api 行为
Posted
技术标签:
【中文标题】Chromecast 上的 YouTube iframe api 行为【英文标题】:YouTube iframe api behavior on Chromecast 【发布时间】:2013-09-06 02:55:47 【问题描述】:尝试在 Chromecast 上播放 YouTube 视频,而不是使用 YouTube 接收器,而只是使用 iframe YouTube api。当接收器 url 在桌面 chrome 浏览器中加载时,它可以正常播放,但是当相同的 url 加载到 Chromecast 上时,我收到消息“此视频当前不可用 - 了解更多”。如果我一直尝试让小部件在创建后播放不同的视频,它有时还会显示“视频播放需要 Adobe Flash Player”。
小部件是在 onYouTubeIframeAPIReady() 回调中使用新的 YT.Player 创建的,如文档中所示。也许我很困惑,但我认为 iframe api 是基于 html5,而不是基于 flash。有没有人成功地实现了这一点,或者 Chromecast 不支持这一点,因此出现了奇怪的行为?我也偶然发现了这个http://www.youtube.com/html5
【问题讨论】:
我已经成功构建了一个使用 iFrame API 的接收器,并且我尝试过的任何视频都没有任何问题。哪些视频 ID 给您带来了错误,因此我可以在接收器中试用它们,如果成功,请在此处分享代码作为答案? 我试过的每一个。例如,来自 youtube api 参考示例 - 'M7lc1UVf-VE' 但是你让它工作是非常令人鼓舞的——可能只是配置/初始化。如果您可以发布一些非常有用的代码。 【参考方案1】:这是我目前在接收器上使用的代码。消息处理(两个方向)是命中注定的,我目前正在努力解决这个问题……但是 iFrame 库的加载、视频的嵌入等一切正常。如果它对您不起作用,我们可以开始调查您的设置可能有何不同。我尝试在可能有用的地方添加 cmets。
<html>
<head>
<script src="https://www.gstatic.com/cast/js/receiver/1.0/cast_receiver.js">
</script>
<script type="text/javascript">
// first create our receiver object and our channel handler
var receiver = new cast.receiver.Receiver('YOUR_APP_ID', ['ChromecastYoutube'],"",5);
var ytChannelHandler = new cast.receiver.ChannelHandler('ChromecastYoutube'); // 'using 'ChromecastYoutube' as my dev namespace. Wouldn't really be that in production.
ytChannelHandler.addChannelFactory(receiver.createChannelFactory('ChromecastYoutube'));
ytChannelHandler.addEventListener(
cast.receiver.Channel.EventType.MESSAGE,
onMessage.bind(this)
);
receiver.start();
window.addEventListener('load', function() // we won't try to load the iframe libraries until the chromecast window is fully loaded.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
);
var player;
function onYouTubeIframeAPIReady()
player = new YT.Player('player',
height: '562',
width: '1000',
videoId: 'jLlSqucqXB0',
playerVars: 'autoplay': 0, 'controls': 0 ,
events:
'onReady': onPlayerReady,
'onPlayerStateChange': onStateChange
);
function onPlayerReady(event)
document.getElementById('annotation').innerHTML="We're ready to go";
function onStateChange(event)
switch (event.data)
case YT.PlayerState.ENDED:
// TODO let sender know we're done, then close casting
break;
case YT.PlayerState.PLAYING:
// TODO let sender know we're playing
break;
case YT.PlayerState.PAUSED:
// TODO let sender know we're paused
break;
function onMessage(event) // currently, any one of these will work, but subsequent ones seem to falter. Investigating...
ytBindings="playVideo":player.playVideo(),"pauseVideo":player.pauseVideo(),"stopVideo":player.stopVideo(),"getStatus":player.getPlayerState()
ytBindings[event.message];
</script>
<style>
#wrapper
width: 1000px;
margin: 10px auto;
text-align: center;
#annotation
color: #ffffcc;
font-size: 200%;
margin-top:25px;
</style>
</head>
<body>
<div id="wrapper">
<div id="player"></div>
<div id="annotation"></div>
</div>
</body>
</html>
【讨论】:
它在各方面都与我的相似,除了一个。我先设置了一个 SoundCloud 小部件,也在 iframe 中,然后随便在同一页面上添加了一个 YouTube iframe。似乎它们不能共存,但我不知道为什么。如果我删除 SoundCloud 小部件,则视频播放正常。如果你觉得如此倾向然后添加这个... 似乎更复杂,可能与额外的 iframe 无关。仅使用 YouTube iframe,它适用于我最初使用的一组视频 id,但我现在收到以下任何 id 的 flash 错误.... ktvTqknDobU 、 5NV6Rdv1a3I 、 e9SeJIgWRPk 这些都是 Vevo 视频。不幸的是,Vevo(和其他一些内容提供商,通常与音乐有关)在他们的视频中设置了限制,因此它们根本不能嵌入,或者只能嵌入到 Flash 播放器等中。如果有阻止阻止HTML5 嵌入,它将尝试默认为 Flash 嵌入(当然,这就是 iFrame 的用途),这会触发错误,因为 Chromecast 没有 Flash 播放器。如果您尝试强制使用 HTML5 模式,则会收到错误 150,表明它无法嵌入。 就 Soundcloud 小部件而言,这是一个奇怪的问题。它自己运行良好,但确实会引发一些 DOM 错误。当与 YouTube iframe 结合使用时,YouTube 嵌入会抛出错误 5,这是 HTML5 播放器中的一般错误(我想知道这是否是由 soundcloud 小部件抛出的错误触发的)。 非常有帮助 - 谢谢。我需要找出客户端上的不可嵌入视频以避免请求。关于 SoundCloud,我不需要两者共存,但很高兴知道那里有问题。【参考方案2】:当前行为:现在似乎已通过 Chromecast 固件 16041 以及在 Chromecast 设置期间正确设置了国家/地区代码进行了修复。在此处查看最新评论https://code.google.com/p/gdata-issues/issues/detail?id=5923
旧答案: 这是问题的根本原因:https://support.google.com/chromecast/answer/2995235?hl=en 某些视频可能无法使用 Chromecast 播放。私人视频、直播内容和未获准用于移动播放的视频将无法与 Chromecast 一起使用。 希望这会改变,杀死一个主要的 Chromecast 用例。
【讨论】:
获取请求以尝试解决此问题....我认为 Vevo 视频无法在 Chromecast 上播放,因为它们不可嵌入。对于 iframe youtube 播放器,情况确实如此。但是,android YouTube 应用可以毫无问题地投射(并且没有广告)。显然谷歌可以做我们做不到的事情,但你认为如果我改用 YouTube 接收器而不是 iframe 小部件,这会解决问题吗? 查看更新后的答案。似乎 Chromecast Youtube 限制已解除。【参考方案3】:我也遇到了这个问题,发现原因是我在视频开始之前使用 html5 音频播放一些音效。删除音效使 youtube 播放器再次工作。
【讨论】:
以上是关于Chromecast 上的 YouTube iframe api 行为的主要内容,如果未能解决你的问题,请参考以下文章
当连接到不同的应用程序/设备时,我可以控制 chromecast 的音量吗?