CODEWITHSUNDEEP
htmlvideohtml5-video
Steve V
Steve V

Reputation: 11

HTML5 video CC button disappears when clicked on

When putting the SRC links for HTML5 video on a page, the TRACK only seems to work if the it exists localy to that HTML file. We like to keep all our videos and caption files on a separate server, so this is a huge issue.

If the track looks like this, they display fine:

<track src="captions.vtt">

If the VTT file is on another server and the track looks like this, the CC button disappears when you click on it and the captions never show up:

<track src="http://anotherserver.com/captions.vtt">

This happens in Chrome and Opera. No captions are displayed at all in Edge or IE, but at least the button doesn't disappear.

Upvotes: 0

Views: 1580

Answers (1)

Steve V
Steve V

Reputation: 11

Changed my video tag from this:

<video poster="...." controls>

to this by adding crossorigin="anonymous" to it:

<video poster="...." crossorigin="anonymous" controls>

And added a web.config file to the server that holds all our VTT files that contains this:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
    <system.webServer>
        <httpProtocol>
            <customHeaders>
                <add name="Access-Control-Allow-Origin" value="*" />
            </customHeaders>
        </httpProtocol>
    </system.webServer>
</configuration>

Upvotes: 1

Related Questions