In the HTML media playback sample there's a code that demonstrates how to add subtitles to the video:
<video id="subtitleVideo" style="position: relative; z-index: auto; width: 50%;"
src="http://ie.microsoft.com/testdrive/Videos/BehindIE9AllAroundFast/Video.mp4"
poster="images/Win8MediaLogo.png" loop controls>
<track id="scenario3entrack" src="media/sample-subtitle-en.vtt" kind="subtitles"
srclang="en" default>
</video>
It works fine, but when I change subtitle track src to src="http://gilevskaya.com/subs.vtt", subtitles stop working.
The file being served is the same, why doesn't it work and how to fix it?
I've recreated the issue on my own domain. At first the subtitles didn't show. I noticed an error in the JavaScript Console in Visual Studio.
MEDIA12604: Text Track: Unknown MIME type. hr=8007000b
So I added the mime type. My site runs on Apache. I added this line to the .htaccess file:
AddType text/vtt;charset=utf-8 .vtt
This sets the .vtt type to be text/vtt and set the encoding to utf-8.
I'm sure it's not hard to find the ways of adding mime types for other servers.
I'm my case I had to add the "www" to the url too... But I think this has something to do with the way the server is set up. You might not need this.