flv.js 直播画面停止

谦谦你好，想你请教个问题。我使用flv.js做直播，但是一旦网页被最小化或者是tab被切换到别的页面，不在当前正在直播的页面，等下一次再回到直播页面时，发现视频画面卡住不动了，但是我观察到Network中的流传输并没有停止，所以我想请教一下这是这么回事，是否是参数不对，代码如下。

if (flvjs.isSupported()) {
    let player = ele;
    destroyPlayer(this.livePlayer.player2);
    livePlayer.player = flvjs.createPlayer({
         type: 'flv',
         url: 'http://127.0.0.1:7001/live/movie.flv',
         hasAudio: false,
         isLive: true                         
    },{        
         isLive: true,                                                                                                   
         deferLoadAfterSourceOpen: true,
         enableStashBuffer: true,
         autoCleanupSourceBuffer: true          
    });
    livePlayer.player2.attachMediaElement(player);
    livePlayer.player2.load();
    livePlayer.player2.play();

Sep 25 '17 04:09 ThreeFat

chrome？

Sep 25 '17 04:09 xqq

是的，chrome，请问这个参数具体是什么作用 deferLoadAfterSourceOpen

Sep 25 '17 06:09 ThreeFat

我这面也是用的直播的源，只传了type 和 url。没有这个问题。给你参考一下。

Sep 26 '17 05:09 IShinji

不使用 isLive ? 这样不会当造成延时累积吗

Sep 26 '17 06:09 ThreeFat

请问是什么原因导致呢？每次切换到别的页面停留一会，再切换回直播页面，画面就卡住了，偶尔不会卡住也会造成很大的延迟。是哪个参数设置的不会吗？

Sep 27 '17 04:09 ThreeFat

换个直播视频源供应商试试？

Sep 27 '17 07:09 IShinji

尝试过更换直播视频源，还是一样的出现这个现象。

Sep 27 '17 09:09 ThreeFat

切页面造成画面卡住可能是浏览器导致的问题。目前已知最新的chrome 62会在标签页处于后台时暂时挂起视频解码，切回时会恢复，但我这里没有遇到任何问题。另，这一点与flv.js没有直接关系。

Sep 27 '17 14:09 xqq

这是我使用的Chrome版本号版本 60.0.3112.113（正式版本）（32 位）。是的，就标签页处于后台时视频会卡住，切换回来时偶尔能恢复，并且如果正常恢复后几个直播窗口的延时都不同，我找不到原因所在，所以只能求助大神了

Sep 28 '17 01:09 ThreeFat

谦谦，经过一段时间测试，发现Chrome(最新)标签后台挂起直播卡住，切换回来时常恢复不了，经测试在Firefox上没有出现这个问题，不知道您有没有什么解决方法或者想法？

Oct 12 '17 02:10 ThreeFat

看下chrome://media-internals里对应的log, 还有chrome://gpu底部的log

Oct 12 '17 05:10 xqq

chrome://gpu底部的log：

chrome://media-internals对应log：

Oct 12 '17 06:10 ThreeFat

你GPU进程都崩了

Oct 12 '17 06:10 xqq

GPU进程为什么会崩掉诶？

Oct 12 '17 07:10 ThreeFat

不清楚, 你切回来画面是不是绿了

Oct 12 '17 08:10 xqq

没有变绿，只是视频卡住不动，不过fetch还在加载数据，如果想要恢复必须要重新detachMediaElement，后然attachMediaElement，再load，但是这种体验很不好

Oct 15 '17 06:10 ThreeFat

建议换台机器试试

Oct 15 '17 07:10 xqq

观察发现bilibili对直播视频解码方式是软解,后台标签之后明显发现CPU占用率下降,而我的却好像没有,后台标签发现CPU占用率波动很小,是否是因为视频采用的是硬解码,请问,可以通过flv.js来进行控制浏览器的解码方式吗?

Oct 16 '17 07:10 ThreeFat

不能. 显然解码方式由不得flv.js决定，bilibili更不可能主动采用软解

Oct 16 '17 07:10 xqq

那真的困扰,也尝试过使用bilibili上的媒体流,同样会卡住,这说明不是流的问题也和解码方式无关,那只能前端程序的问题,可一直找不到根源所在.

Oct 16 '17 07:10 ThreeFat

也怀疑过是不是同一个页面视频窗口太多导致,尝试减少到只有一个窗口,问题依旧.

Oct 16 '17 07:10 ThreeFat

所以换别的机器试过没

Oct 16 '17 07:10 xqq

试过了,更换了多台机器,也测试过多个版本的Chrome,尝试依然如此.

Oct 16 '17 08:10 ThreeFat

发现Chrome标签页后台时,画面暂停,恢复之后呢继续刚才的时间点播放.比如:现在我有一个摄像头正在直播,摄像头上时间在切换标签页是为10.30.50, 那在一分钟之后切换回来直播是接着刚才的时间 10.30.50,继续的,而不是10.31.50,这是为什么呢,这么才能让直播流一直是最新的呢?

Oct 20 '17 02:10 ThreeFat

有遇到过谷歌浏览器拉http-flv流长时间后画面卡住或者崩溃的情况吗

Nov 17 '17 14:11 ZSC714725

请问你解决了吗，关于切换页签，回来继续播放新时间的问题。我使用的方法会重新刷一下，感觉体验很不好。

Dec 25 '17 09:12 XmYellow

视频流只有设置为hasAudio为false的时候就会重现这个问题。@xqq

Jun 21 '18 07:06 hengwangm

视频流参数添加设置 hasAudio：false 的时候就可以解决纯视频流了加载但video不显示的问题。@xqq @hengwangm

Jun 26 '18 05:06 yanye411325

我遇到了同样的问题，安卓微信H5浏览器自带一个全屏的功能，播放视频时点击全屏，再切回来就卡在切全屏时候的画面了，目前还不知道怎么解决

Jul 08 '19 02:07 f056917

发现Chrome标签页后台时,画面暂停,恢复之后呢继续刚才的时间点播放.比如:现在我有一个摄像头正在直播,摄像头上时间在切换标签页是为10.30.50, 那在一分钟之后切换回来直播是接着刚才的时间 10.30.50,继续的,而不是10.31.50,这是为什么呢,这么才能让直播流一直是最新的呢?

我也遇到这个问题，你后面是怎么解决的呢，看到有说监听document.addEventListener('visibilitychange',pageHiddenHandler,false);这个事件然后处理currentTime的

Nov 11 '19 09:11 fancyluo88

flv.js flv.js copied to clipboard

直播画面停止

flv.js
flv.js copied to clipboard