0

我正在尝试更改 HTML <video> 元素的 src 属性并在播放第一个视频 10 秒后播放它,在桌面上它工作正常,但是在移动设备中它在更改源后卡住并且它永远不会播放。

我正在使用 plyr.js,但是没有它也会发生同样的情况。

document.addEventListener('DOMContentLoaded', () => { 
  const player = new Plyr('#player', {
      controls: ['play-large', 'play', 'progress', 'current-time', 'mute', 'volume', 'captions', 'settings', 'pip', 'airplay', 'fullscreen'],
  });

  player.on('ready', event => {
    player.play();
  });

  player.on('timeupdate', event => {
    console.log(player.currentTime);
    if (player.currentTime > 10) {
      player.source = { 
        type: 'video',
        sources: [
          {
            src: 'https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ForBiggerEscapes.mp4',
            type: 'video/mp4',
            size: 720,
          }
        ]
      }
    }
  });
});

我知道 webkit 政策,但是,他们没有指定在更改源后视频需要再次播放用户交互,这对我来说没有意义。

https://codepen.io/andreupifarre/full/qJYeJL/

这是政策的一部分吗?难道我做错了什么?这可以做到吗?

4

0 回答 0