iOS設備上的Dailymotion嵌入式播放器（HTML5）

Question

我有一個Dailymotion嵌入式播放器，使用播放器API（http://www.dailymotion.com/doc/api/player.html）。它適用於桌面和Android平板電腦。但在iOS設備上，視頻只是無法啓動。我的代碼如下：

<!-- 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> 

Answer 1

您的代碼完全有效。問題是，大多數移動設備（包括iOS設備）都會阻止視頻自動播放（請參閱Apple documentation : Safari HTML5 Audio and Video Guide）。在這些設備上，首次播放必須由用戶交互觸發，例如觸摸播放按鈕，否則瀏覽器將忽略它。

apiready事件由Dailymotion SDK觸發，不是用戶事件。這就是爲什麼play()方法對視頻沒有影響。

[編輯]：您寧可致電play()方法從另一個事件偵聽器，如click或touchend事件。。 此外，由於Dailymotion播放器嵌入在內，因此瀏覽器始終將父頁面與之間的通信視爲編程事件，而不管父頁面的原始事件是否來自用戶或不。

TLDR：在移動設備上，您必須等待用戶觸摸播放器的開始屏幕。