Question

我正在使用video.js创建一个简单的视频页面，我想显示章节曲目。这是HTML代码，基于VideoJS文档here。

<!DOCTYPE html>
<html>
        <head>
                <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
                <link href="http://vjs.zencdn.net/4.0/video-js.css" rel="stylesheet">
                <script src="http://vjs.zencdn.net/4.0/video.js"></script>
        </head>
        <body>
                <video id="example_video_1" class="video-js vjs-default-skin" controls preload="none" width="940" height="560" data-setup='{}'>
                <source src="myvideo.mp4" type="video/mp4" />
                <track kind="chapters" src="mychapters.vtt" srclang="en" label="English" default="default" >
                </video>
        </body>
</html>

这是webvtt文件：

WEBVTT


Chapter 1
00:00:00.000 --> 00:16:30.000>
Sample chapter 1

Chapter 2
00:16:30.000 --> 00:42:30.000>
Sample Chapter 2

在Chrome 27（在Linux上）打开此页面时，Uncaught TypeError: Cannot read property 'id' of undefined处的控制台video.js:22中会显示以下错误。当我将kind="chapters"更改为kind="captions"时，字幕可以正常工作。

任何帮助都会非常感激，因为我不能为我的生活弄清楚我做错了什么。

提前致谢。

Answer 1

不幸的是，您正在寻找的章节功能尚未在videojs版本4.x中运行 - 这是一个已知问题：

https://github.com/videojs/video.js/issues/676

较旧的3.x版本确实有效 - 我已经成功地使用v3.2来提供带章节的视频 - 但是早期版本的播放器无法访问，也没有响应（没有太多额外的努力）。

为了快速处理未被捕获的TypeError（没有足够的时间来更彻底地处理这个问题），我添加了以下创可贴：

if (typeof component === 'undefined') return;

到函数

vjs.Component.prototype.addChild

就在行前：

this.children_.push(component);

（在我正在使用的v4.3的非缩小版本中，这将在1660行左右。）

这显然无法修复破坏的章节功能，但会捕获抛出的错误。

章节曲目不会与VideoJS一起显示

1 个答案: