问题标签 [webvtt]

我想在音频播放时显示音频文件的转录。我尝试了几个选项都无济于事：

<audio src="../audio/myaudio.mp3" controls> <track default srclang="en" kind="captions" label="English subtitles" src="sub.vtt"/> </audio>

.vtt 文件的路径正确。该<track>元素应该是两者的子元素<video>（<audio>参见https://developer.mozilla.org/en-US/docs/Web/HTML/Element/track）。为什么我不能显示我的字幕？

我的 .vtt 文件包含类似

ETC...

我也尝试过使用该<video>元素：

仍然没有运气。我可以看到“抄送”按钮，还可以选择英语字幕项目。音频播放（即使我使用该<video>元素），我看不到任何标题。用“字幕”交换“字幕”没有帮助。

我正在用 ReactJS 编写一个 chrome 扩展，允许用户在 Youtube 上插入字幕。我一直在尝试使用 track 元素在 Youtube 上插入字幕，但它不起作用。

Youtube 有以下元素：

我设法用这个函数注入了一个 track 元素：

该subs.vtt文件与上面代码的 javascript 文件位于同一文件夹中。当代码在 Youtube 上加载时，我收到“加载的字幕”消息，但字幕不会出现。

我尝试将 track.src URL 更改为gist，尝试使用以下命令启动本地服务器

如此处所示，并在此处提出建议，以便我可以将 track.src URL 更改为http://localhost:8000/subtitle.vtt。两种解决方案均无效。

有谁知道为什么它不起作用？

这是 WebVTT 的示例

我使用youtube-dl从 YouTube 上抓取它。

我想将其转换为纯文本。当文本重复时，我不能只是去掉时间和颜色标签。

所以我想知道是否存在将其转换为纯文本的东西，或者是否有人可以提供一些伪代码以便我可以编写代码？

我还用youtube-dl发布了一个关于此的问题。

I have a page that embeds a mp3 audio file along with associated <track kind="subtitles"> .vtt file containing the subtitles which I loop through and load in to divs on the page.

I have a simple fs function to change the formatting of the relevant subtitle as the audio plays - think of it is a karaoke player, highlighting each line as it needs to be sung:

I have noticed occasional and inconsistent delays on the formatting updates which is not desirable for my purpose. In posting audio player timings to to the console trying to figure out what might be causing it I get the following example:

Hunting around online I have found a couple of references to oncuechange being checked only a few times per second - If this is the case then presumably the longer delays I am seeing are a case of bad timing in conjunction with a system clock and explains the inconsistency.

While I don't need absolutely perfect timings for the event being actioned, if I could get the event being checked more frequently (say every 0.1/s) to reduce the unpredictability then that would be great!

So to the question: Is there a way to A. Increase the frequency of event checks? Or B. Do this differently so that the event timings are more accurate?

Thanks in advance for any advice or suggestions.

Edited: 01/10/2018 - Additional info and adding html5 / jQuery tags

Inspired by this SO thread I tried a page timer that checked for the active cue ID changing and posting the results into the console:

In this test a majority of the new test logs occurred immediately after the oncuechange events. Occasionally it would beat the oncuechange but only by a fraction and not enough to make a difference (see last subtitle timing). I initially has the cueTick delay set to 100, then dropped it to 50, 10 and finally 1 without any noticeable difference in the results:

So still no progress - or at least not enough to consider implementing this different method. Any other suggestions?

Thanks in advance

我正在为我的 tvOSApp 使用 Swift 的 AVplayer。

当我使用默认播放器时，视频的字幕会显示在顶部的“字幕”栏上，并且可以轻松切换字幕。那么，如何在不使用默认播放控件的情况下切换这样的字幕呢？

我有用于在屏幕上切换字幕的按钮，我想在这些目标方法期间进行切换。

这是我的 AVPlayer 代码。

我正在使用下面的视频进行测试。 http://184.72.239.149/vod/smil:BigBuckBunny.smil/playlist.m3u8

我阅读了有关 AVPlayer/AVPlayerItem 的文档，但没有得到任何答复。如果有人可以提供帮助，我将不胜感激。

我正在尝试创建带有 .vtt 字幕的（.mp4 格式）视频。唯一出现在屏幕上的是视频中心的一两条黑线，字幕应该是，并且仅在 Chrome 上。它在例如 Edge 中运行良好。他们为什么不出现？文件被上传到服务器。

.vtt 文件（示例）：

截屏：

黑线截图

我正在研究从任何格式到 HLS 的 hls 转码器，我需要同时使用“dvbsub”格式对多个字幕进行编码，目的是让解释 m3u8 HLS 播放列表的客户选择。

主要问题是以这种方式将每个 dvbsub 刻录到实时视频流中：

是一项非常占用 CPU 资源的任务。（我在同一个流中有 8 个或更多 dvbsub）。

有谁知道如何将每个 dvbsub 转换为文本格式（例如 webvtt），或者是否有办法优化流程？（我尝试使用 NVIDIA gpu 执行此刻录过程，但没有取得任何改进）

我读到了可以完成任务的 OCR 程序，但经过几天的研究，我仍然不知道该怎么做。

提前致谢。

编辑：输入是实时 UDP 信号。我需要即时进行转换。

为什么 IE 加载 .vtt 没有黑色背景而 chromes 加载，需要 IE 正常并且有黑色背景搜索没有占上风。

对此问题的任何帮助将不胜感激。

HTML：

CSS

铬合金：

IE：

I am looking to loop through existing .vtt files and read the cue data into a database.

The format of the .vtt files are:

Originally I was trying to use ^ and $ to be quite regimented with the lines along the lines of: /^(\w*)$^(\d{2}):(\d{2}):(\d{2})\.(\d{2,3}) --> (\d{2}):(\d{2}):(\d{2})\.(\d{2,3})$^(.+)$/ims but I struggled to get this working in the regex checker and resorted to using \s to deal with line start/ends.

Currently I am using the following regex: /(.*)\s(\d{2}):(\d{2}):(\d{2})\.(\d{2,3}) --> (\d{2}):(\d{2}):(\d{2})\.(\d{2,3})\s(.+)/im

This partially works using online regex checkers like: https://regex101.com/r/mmpObk/3 (this example does not pick up multi-line subtitles, but does get the first line which at this point is good enough for my purpose as all subtitles are currently 1 liners). However if I put this into php (preg_match_all("/(.*)\s(\d{2}):(\d{2}):(\d{2})\.(\d{2,3}) --> (\d{2}):(\d{2}):(\d{2})\.(\d{2,3})\s(.+)/mi", $fileData, $matches)) and dump the results I get an array of empty arrays.

What might be different between the online regex and php?

Thanks in advance for any suggestions.

EDIT--- Below is a dump of $fileData and a dump of $matches:

因此，我正在尝试使用默认的 chrome 发送器应用程序为 chromecast 设置隐藏式字幕，根据文档，这应该是可能的，如此处所示。我不知道为什么我的代码不起作用。它与提供的示例代码几乎相同。
snipper 可能无法工作，因为它太沙盒化了，在普通的 html 页面中查看它： 点击！
首先应该使用顶部按钮连接他们的 chromecast，然后单击“加载视频”。

我的代码：