我似乎无法将远程VTT文件加载到html5视频播放器(在ReactJS中,使用video-react v0.11.2 (https://github.com/video-react/video-react) )
<track
kind="subtitles"
label="English subtitles"
src={api.makeFileURL(this.props.chapterPart.VideoFile[0].subtitles, this.props.user.id)}
srcLang="en"
default={true}
/>
这不管用。makeFileURL方法创建一个指向vtt文件的url。示例:http://localhost:3000/api/file/download/5b1932c7f4717028c0b5d711-1529538217239-nicks.vtt?access_token=Q4tBHTC36Rumijnvsb9QruNlQJ5EX1mQPBLD86LHFHfJU3ttXOzCdOJBeqIj6xP9
当我在浏览器中访问该文件时,我可以看到该文件,且mimetype为VTT。当我将该文件包含到我的项目中,并在本地将其加载到跟踪元素中时,一切都很正常。
<track
kind="subtitles"
label="English subtitles"
src="/static/media/5b1932c7f4717028c0b5d711-1529538217239-nicks.vtt"
srcLang="en"
default={true}
/>
我以为这是个跨地域的问题。所以我在Player元素中添加了crossOrigin="true“,这反过来会将该属性传递给html5视频元素,但当我在FF或chrome中查看网络选项卡时,我从未看到请求的文件是远程url。当它是一个本地url时,该文件会显示在网络选项卡中,一切都会正常工作。
没有错误,只是文本轨道不能加载远程文件。
https://stackoverflow.com/questions/50975441
复制相似问题