我正在尝试将HTML5视频播放器集成到我的应用程序中。我的视频源和字幕(用于曲目标签)来自不同的网域。
当我使用
<video crossOrigin="anonymous">
<source src="domain1Url"> ... </source>
<track kind="captions" label="English Captions" src="domain2Url" srclang="en" default>
</video>
上述所有代码在Chrome不安全模式(禁用网络安全)下对我来说都很好用。使用普通 Chrome,如果我不指定 crossOrigin 属性,我会收到一条错误消息,指出
来自原点的文本轨道"..."已被阻止加载:与文档不在同一来源,并且 track 元素的父元素没有"交叉源"属性。起源 "http://localhost..."因此不允许访问。
指定 crossOrigin 属性后,标题 API 将成功获取数据。但视频无法播放。任何人都可以建议如何使视频在设置跨源属性的情况下播放?
在设置 crossorigin="anonymous" 后,我也需要在视频源 URL 上启用 CORS。视频网址需要返回以下响应标头:
访问控制允许来源:*(或要列入白名单的域)
使用此扩展程序帮助我模拟了该问题的修复程序:https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi?hl=en