点击后，HTML5视频CC按钮消失

Question

当在页面上放置HTML5视频的SRC链接时，只有当它存在于该HTML文件的本地时，TRACK似乎才有效。我们希望将所有视频和字幕文件保存在单独的服务器上，因此这是一个很大的问题。

如果曲目看起来像这样，它们显示正常：

<track src="captions.vtt">

如果VTT文件在另一台服务器上并且轨道如下所示，当您点击它时CC按钮消失且字幕永远不会显示：

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

这种情况发生在Chrome和Opera中。在Edge或IE中根本没有显示标题，但至少按钮不会消失。

Answer 1

更改了我的视频代码：

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

将 crossorigin =＆＃34;匿名＆＃34; 加入其中：

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

并将一个web.config文件添加到服务器中，该服务器包含我们所有包含此文件的VTT文件：

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