HTML5 视频无法使用 crossOrigin="anonymous" 播放

HTML5 video doesn't play with crossOrigin="anonymous"

我正在尝试将 HTML5 视频播放器集成到我的应用程序中。我的视频源和标题(用于曲目标签)来自不同的域。

当我使用

<video crossOrigin="anonymous">
   <source src="domain1Url"> ... </source>
   <track kind="captions" label="English Captions" src="domain2Url" srclang="en" default>
</video>

以上所有代码在 Chrome 不安全模式(禁用网络安全)下对我来说都很好。 对于常规 Chrome,如果我没有指定 crossOrigin 属性,我会收到一条错误消息

Text track from origin '...' has been blocked from loading: Not at same origin as the document, and parent of track element does not have a 'crossorigin' attribute. Origin 'http://localhost...' is therefore not allowed access.

指定crossOrigin属性后,标题API成功获取数据。但是视频不会播放。谁能建议我如何使用 crossOrigin 属性集播放视频?

设置 crossorigin="anonymous" 后,我还需要在视频源 URLs 上启用 CORS。视频 URL 需要 return 以下回复 header:

Access-Control-Allow-Origin: * (or the domain to whitelist)

使用这个扩展帮助我模拟了问题的修复: https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en