移动注意事项

Question

我很困惑。带有标准示例的Youtube Iframe API：https://developers.google.com/youtube/iframe_api_reference?hl=de始终用于我的移动设备，现在不再有效..

<div id="player"></div>
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: '250',
    width: '444',
videoId: 'M7lc1UVf-VE',
events: {
  'onReady': onPlayerReady
}
});
}

function onPlayerReady(event) {
event.target.playVideo();

}

与iPad，iPhone和三星galaxy nexus。视频没有播放..有什么变化吗？

谢谢

Answer 1

移动注意事项

自动播放和脚本播放

HTML5元素在某些移动浏览器（例如Chrome和Safari）中，只允许在用户交互（例如点击播放器）启动时进行播放。以下是Apple文档的摘录：


“警告：为了防止用户通过蜂窝网络进行未经请求的下载，嵌入式媒体无法在iOS上的Safari中自动播放 - 用户始终会启动播放。”


由于此限制，自动播放，playVideo（），loadVideoById（）等功能和参数将无法在所有移动环境中使用。

来自：https://developers.google.com/youtube/iframe_api_reference#Mobile_considerations

一个简单的解决方法，可以自定义外观“播放”按钮：

拥有pointer-events: none;的叠加元素。 pointer-events适用于所有现代mobile browsers，或只是将视频容器放在带opacity: 0的按钮上。

Answer 2

大多数移动设备都不允许使用自动播放功能，因此如果您确定它可以正常工作

Answer 3

我也有同样的问题。在PC上运作良好，但在手机上却无法运作。经过一番研究，我发现我尝试播放的视频是 CopyRighted 。因此，该视频无法在手机上播放。希望这可以帮助某人

Answer 4

如果浏览器不是移动浏览器，则仅限.playVideo（）。有许多方法可以检测移动浏览器，如下面的答案所示：Detecting a mobile browser

例如：

if(typeof window.orientation == 'undefined'){
  player.playVideo();
};

Youtube iframe API无法用于移动设备？

4 个答案:

移动注意事项

自动播放和脚本播放