Javascript 如何使用在线链接在视频播放器中添加字幕？

如何使用在线链接在视频播放器中添加字幕？即使当我们使用本地字幕文件（.vtt文件）字幕工作时，但当我们将字幕源从本地文件更改为在线链接时，没有显示字幕，我们使用html5和javascript添加字幕

player.html 这是因为限制。主要浏览器阻止来自其他域的请求以防止攻击。除非请求的服务器允许跨域共享

因此，首先尝试将

crossorigin=“anonymous”

添加到视频标签中

<video id="vid1" height="720" width="1280" crossorigin="anonymous">
    <track id="text1" label="English" kind="subtitles" src="" srclang="en">
</video>

如果上述代码不起作用，则无法从该服务器加载字幕，除非您是所有者，在这种情况下，您需要通过发送

access Control allow Origin

头来允许访问其他人

---

如果不可能，您必须将字幕本地上载到服务器。

我已添加了代码…请检查并给出解决方案

var text = document.getElementById("text1");
var video = document.getElementById("vid1");
video.setAttribute("src","online video URL link here...");// video is playing fine.
video.play();
text.setAttribute("src", "../../assets/static/creed.vtt"); // this is a local file and this one is working fine.
text.setAttribute("src", "http://54.247.191.224:8080/virgin-static/creed.vtt"); // This file is stored in server, and we are using link to fetch the file but it is not working.
// one more online link is not working
text.setAttribute("src", " http://devcache.ff.msf.ioko.com/Test/Movies/2016/6/28/SDFEATUREMOVIE/Creed%20ENG.VTT"); // This file is also not working
video.textTracks[0].mode = 'showing'; // only local stored file is working others are not working.

<video id="vid1" height="720" width="1280" crossorigin="anonymous">
    <track id="text1" label="English" kind="subtitles" src="" srclang="en">
</video>