Video.js: 设置视频源后出错

Question

当运行 videojs('vid') 时，我在使用 video.js 时遇到问题。我的目标是创建一个 video.js 对象，以便我可以读取当前时间 (myPlayer.currentTime)。

HTML:

<video id="vid" class="video-js" controls autoplay data-setup="{}">
    <source id="src1">
</video>

Javascript:

$(document).ready(function () {

    videojs('vid').ready(function () {
        var myPlayer = this;
        myPlayer.src({ type: 'video/mp4', src: '/uploads/365.mp4' });
    });
});

这给了我一个错误：

VIDEOJS: ERROR: (CODE:4 MEDIA_ERR_SRC_NOT_SUPPORTED) The media could not be loaded, either because the server or network failed or because the format is not supported.

重要：设置src而不执行videojs('vid')时，同样的视频效果很好。这就像运行 videojs('vid') 重置了所有来源并且无法通过 Javascript 设置 src。

Answer 1

您可以在 videojs 中使用它的 currentTime() 函数获得 currentTime。

var output = document.querySelector('output');
var player = videojs('vid');

requestAnimationFrame(updateTime);

function updateTime() {
  output.innerText = player.currentTime();
  requestAnimationFrame(updateTime);
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/6.0.1/alt/video-js-cdn.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/6.0.1/video.min.js"></script>

<video id="vid" class="video-js" controls autoplay>
  <source src="https://www.w3schools.com/html/mov_bbb.mp4">
</video>

<output></output>

Answer 2

我通过将 src: '/uploads/365.mp4' 更改为完整的 URL 路径自行解决了问题：https://example.com/uploads/365.mp4.

Video.js: 设置视频源后出错

Video.js: Error after setting video src

javascript

video

html5-video

video.js