带有 MP4 视频的 Chromecast 上的 VTT 字幕

Question

我正在尝试让隐藏式字幕与我的 ChromeCast 自定义接收器应用程序一起使用。我已将 CORS 标头添加到我的 CDN。但是，当这些字幕托管在与我的接收器应用程序所在位置不同的存储桶上时，我遇到了让字幕与 MP4 视频文件一起正确加载的障碍。当字幕与接收者应用程序同源托管时，字幕会正确加载，就像在this example app 中所做的那样。

我的发送者应用程序通过以下消息传递信息以启用字幕：

session.sendMessage('urn:x-cast:com.google.cast.sample.closecaption', message, 
onSuccess, onError);

我的接收器应用程序在收到此消息后，会在接收器 html 上创建或替换一个 track 元素，指定正确的来源。

trackElement.src = tracks[activeTrackLanguage];

但是，我收到以下错误：

Cross-origin text track load denied by Cross-Origin Resource Sharing policy.

经过一番研究，我发现了视频元素的 crossorigin 属性。因此，在我的接收器调试控制台中，在我的 mp4 视频已经加载之后，我编写了以下内容：

document.getElementById('player').setAttribute('crossorigin', 'anonymous');

然后，我发送了带有我想播放的字幕的启用字幕消息，并且成功了！不幸的是，拥有crossorigin 属性似乎会阻止正确加载我的 MP4 视频内容，因为我在尝试加载我的视频时收到以下错误：

No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'https://mysite.com' is therefore not allowed access. 

仅当我将此属性添加到我的视频元素时，才会出现加载我的 MP4 视频的错误。 mp4 视频是否支持字幕/字幕？我是否需要在视频加载后添加 crossorigin 属性，然后在我的 vtt 加载后不久删除？似乎有点hacky。任何帮助表示赞赏。

Answer 1

需要在托管视频和曲目的服务器端配置 CORS。