Javascript chrome中使用vue的hls.js不会更新m3u8播放列表
我想在mounted()函数中部署m3u8格式的实时流媒体视频,使用:Javascript chrome中使用vue的hls.js不会更新m3u8播放列表,javascript,vue.js,live-streaming,m3u8,hls.js,Javascript,Vue.js,Live Streaming,M3u8,Hls.js,我想在mounted()函数中部署m3u8格式的实时流媒体视频,使用: if(Hls.isSupported()) { let video = this.$refs.videoPrueba2; let hls = new Hls(); hls.loadSource('./HLS/out.m3u8'); hls.attachMedia(video); hls.on(Hls.Events.MANIFEST_PARSED, function () {
if(Hls.isSupported()) {
let video = this.$refs.videoPrueba2;
let hls = new Hls();
hls.loadSource('./HLS/out.m3u8');
hls.attachMedia(video);
hls.on(Hls.Events.MANIFEST_PARSED, function () {
video.play();
});
}
但是,当页面加载时,播放机将加载播放列表中包含的所有视频,直到此时为止,并停止播放。它不会播放正在创建的新ts文件。我必须按住CTRL+SHIFT+R(删除缓存并重新加载页面)才能看到包含新ts文件的视频
我使用以下ffmpeg命令创建了.m3u8文件:
ffmpeg -re -i short.mp4 -c:v h264 -flags +cgop -g 30 -vf scale=-1:360 -hls_list_size 0 ./HLS/out.m3u8
我试着说:
hls.loadSource('./HLS/out.m3u8');
在设定的时间间隔内,但没有起到任何作用
这可能是vue导致的内存泄漏,而loadSource不知道从何处加载?这是一个与浏览器缓存相关的问题,通过替换以下内容解决:
app.use(express.static(path.join(__dirname, 'streams'), { maxAge: 31557600000 }));
与:
app.use(express.static(path.join(__dirname, 'streams'), { maxAge: 0 }));