Does HTML5 Video support srt textTrack?

22,392

Solution 1

I don't think SRT's are natively supported, but you have two options.

1) Use a library like videosub which is just one include in your HTML file and the SRT's just work via JavaScript.

or

2) Use a service like Caption Converter to convert your SRT files to VTT.

Solution 2

Yes , you are correct. .srt is not working with html5, but .vtt does . if we use .srt then we may need a special player. But we can simply convert .srt to .vtt .

There isn't much difference between those two,it is Only the way they represent milliseconds. And also there is a WEBVTT in the beginning of .vtt files . (online converter https://atelier.u-sub.net/srt2vtt/) i.e.

**srt**
3
00:00:06,071 --> 00:00:08,926
Firstly, when to use it.
When are the best times?

**vtt**
3
00:00:06.071 --> 00:00:08.926
Firstly, when to use it.
When are the best times?

Final code block for html5 is like below

<html>
<video id="video" controls preload="metadata">
   <source src="3798-233163.mp4" type="video/mp4">
   <track label="English" kind="subtitles" srclang="en" src="3798-233163.vtt" default>
   <track label="Deutsch" kind="subtitles" srclang="de" src="3798-233163_1.vtt">
   <track label="Español" kind="subtitles" srclang="es" src="3798-233163_2.vtt">
</video>
</html>

Solution 3

I wrote a simple script which will add support for .srt subtitles. You can grab it from here: https://github.com/redbullzuiper/SRT-Support-for-HTML5-videos

It converts .srt files to a .vtt file on the fly. Just add the subtitles like you usualy would.

<video width="320" height="240" controls>
    <source src="/path/to/your/video.mp4" type="video/mp4">
    <source src="/path/to/your/video.ogg" type="video/ogg">

    <track label="English" kind="subtitles" srclang="en" src="subtitle-en.srt" default />
    <track label="Deutsch" kind="subtitles" srclang="de" src="subtitle-de.srt" />
    <track label="Español" kind="subtitles" srclang="es" src="subtitle-es.srt" />
</video>
Share:
22,392
Thomas Lee
Author by

Thomas Lee

I believe

Updated on July 18, 2022

Comments

  • Thomas Lee
    Thomas Lee almost 2 years

    I have tried the html5 video with textTrack, it works properly with .vtt (WebVTT). However, it doesn't work with .srt.

    So my question is whether html5 support .srt on the chrome or firefox?

    I have looked the information in w3 but there are no information about srt.

    http://www.w3.org/TR/html5/embedded-content-0.html#attr-track-kind-subtitles

    I have also investigated on some players. Most of them parse the .srt instead of the html5 video textTrack.

    So I want to find if any document about .srt subtitle format in the native html5 player.

    Thanks