iOS设备上的Dailymotionembedded式播放器(HTML5)

我有一个使用Player API的Dailymotionembedded式播放器( http://www.dailymotion.com/doc/api/player.html )。 它适用于桌面和Android平板电脑。 但在iOS设备上,video只是无法启动。 我的代码如下:

<!-- This <div> tag will be replaced the <iframe> video player --> <div id="player"></div> <script> // This code loads the Dailymotion Javascript SDK asynchronously. (function() { var e = document.createElement('script'); e.async = true; e.src = document.location.protocol + '//api.dmcdn.net/all.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(e, s); }()); // This function init the player once the SDK is loaded window.dmAsyncInit = function() { // PARAMS is a javascript object containing parameters to pass to the player if any (eg: {autoplay: 1}) var player = DM.player("player", {video: 'somevideoid', width: "100%", height: "100%", params: {autoplay: 0}}); // 4. We can attach some events on the player (using standard DOM events) player.addEventListener("apiready", function(e) { e.target.play(); }); }; </script> 

你的代码是完全有效的。 问题是,大多数移动设备(包括iOS设备)阻止video自动播放(请参阅Apple文档:Safari HTML5audio和video指南 )。 在这些设备上,第一个播放必须由用户交互触发,如触摸播放button,否则浏览器忽略。

apiready事件由Dailymotion SDK触发,不是用户事件。 这就是为什么play()方法对video没有影响。

[编辑]: 您宁愿从另一个事件侦听器(如clicktouchend事件play()调用play()方法。 。 此外,由于Dailymotion Playerembedded在<iframe> ,父页面和<iframe>之间的通信将始终被浏览器视为编程事件,无论父页面的原始事件是来自用户与否。

TLDR:在移动设备上,您必须等待用户触摸播放器的开始屏幕。

Interesting Posts