在HTML5视频标签中访问Google云端硬盘中的WebVTT字幕
问题描述:
我绝不是Web开发人员,所以如果我错失了一些明显的东西,请原谅我。我检查了这个question,我发现使用.mp4文件可以正常工作,但WebVTT文件(.vtt)不可用。 I think the player recognized the subtile as the player bar show "CC" button but in the video, subtitle was not displayed.我做错了什么?任何帮助将被appriciated。在HTML5视频标签中访问Google云端硬盘中的WebVTT字幕
这是我的JS代码。当我在我的电脑上使用本地文件时,字幕轨道文件工作正常,但是当我使用drv与.mp4文件相同时,它不再有效。
<script>
function myFunction1() {
document.getElementById("myVideo").src= "https://www-drv.com/~email/gd/Testing/NG!-01.mp4";
document.getElementById("mySubtitle").src= "https://www-drv.com/~email/gd/Testing/01.vtt";
document.querySelector('video').load();
}
</script>
这里是我的视频编码
<video width="1280" height="720" controls="controls" preload="none">
<source id="myVideo" src="https://www-drv.com/~email/gd/Testing/NG!-01.mp4" type="video/mp4">
<track id="mySubtitle" src="https://www-drv.com/~email/gd/Testing/01.vtt" kind="subtitles" srclang="id" label="English" default>
</video>
答
刚刚发现了解决方案。由于字幕托管服务器未启用CORS,所以曲目将不起作用。 只是需要把它添加到的.htaccess
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
答
This也许是为什么它不工作的原因。
准备您的字幕文件虽然你可以在任何 格式上传字幕,只有SubRip(.SRT),并于SubViewer( .SUB)的支持。
为了帮助可读性:
- 为了帮助有听力障碍,把描述,如[音乐]或方括号内的(笑)。
- 要显示发言人发生变化时,请在新行的开头添加>>。
你可以找到软件来帮助你创建这些文件或聘请公司 为你做。 Learn how to create a caption and transcript files。
您也可以查看此SO post作进一步参考。
感谢您的答复,但我不认为这有关我在做什么的。基本上,我使用HTML5视频标签播放视频和字幕,但是我的问题是代码在本地URL上正常工作,但在上传到Google Drive之后,代码只能使用.mp4 URL而不使用.vtt URL。 –