Search code examples
videowindows-runtimehtml5-videowinjs

HTTP subtitles in WinJS video element


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?


Solution

  • 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.