I am currently trying to play a movie with subtitles. TTML format is required. I am using examples on this page: https://msdn.microsoft.com/en-us/library/ie/jj152136%28v=vs.85%29.aspx
TTML:
<?xml version='1.0' encoding='UTF-8'?>
<tt xmlns='http://www.w3.org/ns/ttml' xml:lang='en'>
<body>
<div>
<p begin="00:00:01.878" end="00:00:05.334">Good day everyone, my name is John Smith</p>
<p begin="00:00:08.608" end="00:00:15.296">This video will teach you how to<br/>build a sand castle on any beach</p>
</div>
</body>
</tt>
Vtt:
WEBVTT
00:00:01.878 --> 00:00:05.334
Good day everyone, my name is John Smith
00:00:08.608 --> 00:00:15.296
This video teaches you how to
build a sand castle on any beach.
My player code is as follows:
<video id="video" controls="" autobuffer="" autoplay="" loop="">
<track enabled kind="captions" src="{{url}}" srclang="en" label="English Subtitles" default />
</video>
Using the VTT format (.vtt file, text/vtt mimetype), Chrome is able to use the subtitles and displays them as expected. However, using the TTML format (.xml file, text/vtt mimetype), Chrome and Opera remove the CC button after I click to enable captions and no subtitles are shown.
I have tried adjusting the mimetype but have been getting the error "Resource interpreted as TextTrack but transferred with MIME type text/xml" a lot (tried application/xml+ttml, and some others).
My goal is to have the TTML file play subtitles just as the VTT file does.
Chrome does not support TTML and does not intend to do it: https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/vXuOTK5M0hM