search

flowplayer / flowplayer-hlsjs

Flowplayer HLS.js plugin
MIT License
81 stars 35 forks source link

Stream is not being closed after calling stop and/or unload on a live hlsjs stream #77

Closed kataleen2k closed 7 years ago

kataleen2k commented 7 years ago

We are experiencing the same issue reported in Issue #66. We are streaming live camera feeds and upon unloading the container via Stop and/or Unload, the browser keeps streaming data from our video server.

Looking in the Chrome Developer Tools we see the same two file types being requested as reported previously: the m3u8 file and the ts file. These requests happen every 10 seconds after the video being stopped. We can also confirm that the video server has an open connection active.

Unfortunately for us using splash is not an option since we need the video to auto start and also we need multiple streams displayed at the same time.

We're wondering if a solution has been found for this problem. Any help is welcome.

Thanks.

phloxic commented 7 years ago

This is not hlsjs specific, unload() - as referenced in #66 - requires splash for any engine: https://flowplayer.com/docs/api.html#methods You can actually do this with hlsjs:

if (api.engine.hlsjs) {
  api.engine.hlsjs.stopLoad();
}

The plugin actually does this if you set the bufferWhilePaused hlsjs option to false on pause, and calls startLoad() before resuming. However:

  1. This is not possible in native HLS playback - iOS, desktop Safari (unless you set hlsjs safari: true) or in the Flash HLS failover
  2. A splash setup is enforced on mobiles (where autoplay is not allowed either), so you won't be able to run multiple instances then anyway (and there are many other scenarios where parallel instances will just bog down performance) - again not hlsjs specifc. You can file a feature request against the core player if you like. My personal opinion is that this has only a chance to work decently in very limited scenarios, like in a local network and with high powered machines. I played around a bit with YouTube's multi-angle feature - 2+ streams retrieved in parallel, but only 1 displayed (less strain than your plan) - and it looks miserable on a laptop. So, where multiple instances are possible, I would on the contrary try to ensure that buffering continues while paused.

Finally you may run into memory issues with the hls.js client library: https://github.com/video-dev/hls.js/issues/1220 and #29

kataleen2k commented 7 years ago

I actually tried the stopLoad() function, but got an error that the function does not exist. Here is the code I am using:

JS References:

<script src="//releases.flowplayer.org/7.0.1/flowplayer.min.js"></script>
<script src="//releases.flowplayer.org/hlsjs/flowplayer.hlsjs.min.js"></script>

HTML: <div data-live="true" class="flowplayer fp-minimal player1" style=""><video autoplay><source type = "application/x-mpegurl" src="<videoURL>"></video></div>

Javascript to activate the player:

$(".player1").flowplayer({      
    ratio: 3 / 4,
        //,onStop: function () { alert('stopped'); this.close().stopBuffering(); } //THIS ALSO DOES NOT SEEM TO FIRE
});

Code that did not work throwing a JS error saying engine does not exist: $(".player1").flowplayer().engine.hlsjs.stopLoad();

Any help is appreciated. Thanks.

phloxic commented 7 years ago

I think you should simply configure hlsjs bufferWhilePaused: false, and forget about stop in favour of just pausing - here's a temporary demo: https://flowplayer.blacktrash.org/fp7/live.html

As you did not provide an actual sample page, here's a quick assessment of your description: