Vimeo player JS API is not working in iOS

泄露秘密 提交于 2019-12-19 10:12:16

问题


I'm trying to use the API to play a video, but it only works after you click the play button in the player in iOS. In desktop and Chrome for Android, it is working fine.

http://codepen.io/bdougherty/pen/JgDfm

$(function() {
    var iframe = $('#player1')[0];
    var player = $f(iframe);
    var status = $('.status');

    // When the player is ready, add listeners for pause, finish, and playProgress
    player.addEvent('ready', function() {
        status.text('ready');

        player.addEvent('pause', onPause);
        player.addEvent('finish', onFinish);
        player.addEvent('playProgress', onPlayProgress);
    });

    // Call the API when a button is pressed
    $('button').bind('click', function() {
        player.api($(this).text().toLowerCase());
    });

    function onPause() {
        status.text('paused');
    }

    function onFinish() {
        status.text('finished');
    }

    function onPlayProgress(data) {
        status.text(data.seconds + 's played');
    }
});
<script src="https://f.vimeocdn.com/js/froogaloop2.min.js"></script>
<iframe id="player1" src="https://player.vimeo.com/video/76979871?api=1&player_id=player1" width="630" height="354" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

<div>
  <button>Play</button>
  <button>Pause</button>
  <p>Status: <span class="status">&hellip;</span></p>
</div>

Is there a workaround that I can use?


回答1:


I contacted the Vimeo support team. They said behavior differs in Chrome Mobile (Android) because they're able to use the Player in that browser (Chrome Mobile). In iOS, playback is handled by the iOS native media player.

They Play method can only be called if the user initiates playback first by tapping the play button onscreen (in iOS).

Related Question: Can you autoplay HTML5 videos on the iPad?



来源:https://stackoverflow.com/questions/35967342/vimeo-player-js-api-is-not-working-in-ios

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!