使用 WebVTT 未显示字幕

Posted 2023-05-07

技术标签:

【中文标题】使用 WebVTT 未显示字幕【英文标题】：Subtitles not showing using WebVTT 【发布时间】：2013-04-12 03:18:34 【问题描述】：

所以我正在尝试为 html5 视频添加字幕并找到了 WebVTT。我对此进行了一些研究，甚至复制了一些示例代码以查看是否可行，但我没有运气。

字幕根本不会出现在视频中。

这是 HTML。

<video id="video"  class="video" controls>
              <source src="solar.mp4" type="video/mp4">
              <source src="client2.ogv" type="video/ogv">
              <source src="solar.webm" type="video/webm">
              <source src="solar.flv" type="video/flv">

              <track label="English Captions" kind="captions" srclang="en" src="english-subtitles.vtt">
        </video>

以及测试 VTT 文件。

WEBVTT

1
00:00:13,00 --> 00:00:16,000
Man did you see that awesome thing like last week -

2
00:00:16,100 --> 00:00:20,100
- and i said wow a lot of people are starting to talk about this.

【问题讨论】：

【参考方案1】：

本地不行，需要在服务器上运行。

【讨论】：

【参考方案2】：

我遇到了和你一样的问题。

问题在于 Chrome 有一个安全功能，不允许文件在 Chrome 中运行本地文件。

解决办法是run Chrome with the allow local access flag。该链接提供了每个操作系统的说明。

【讨论】：

【参考方案3】：

您使用了不正确的时间戳格式。在第二个值之后应该有一个.（点）。

应该是这样的：00:00:00.000 --> 00:00:10.000