search

videojs / http-streaming

HLS, DASH, and future HTTP streaming protocols library for video.js
https://videojs-http-streaming.netlify.app/
Other
2.51k stars 424 forks source link

Chrome Not Starting Playback for Live HLS Playlist #276

Open zac-poe opened 5 years ago

zac-poe commented 5 years ago

Description

I have observed what appears to be a Chrome specific issue with playback of some HLS streams with Live playlists. The issue is that .ts segments will be successfully downloaded, but playback does not immediately begin. Instead you see the loading icon for an extended period of time and eventually playback begins. Reloading the same source only intermittently reproduces this issue. However, disabling/enabling browser caching does not appear to impact frequency. This delayed playback problem has not been reproducible in other browsers with the same HLS streams which cause extended loading in Chrome. Additionally, this loading issue does not occur in Chrome with all HLS streams.

Here is a Plnkr example of the issue: https://embed.plnkr.co/Uqwf5dIAotkexI2KBIum/ (Note that Chrome disables embedded auto play prior to user interaction, so you will need to Refresh Live Preview at least once to enable playback.) If you open this example multiple times, you will see that sometimes playback begins immediately, and other times, the loading icon continues to be displayed for 30-45 seconds before playback starts.

Sources

This Rose Bowl Parade stream is used in the example above: https://d1znu9hcihiapf.cloudfront.net/index.m3u8

Steps to reproduce

  1. Open an HLS Live playlist, such as the Rose Bowl Parade (above) in a Chrome VideoJS player and play (or autoplay) the stream
  2. Observe the Network interactions with the page to see that multiple .ts segments are downloaded successfully
  3. Observe that playback does not begin in the player for an extended period of time

(As noted in the initial description, this issue is intermittent and the steps above may need to be repeated to reproduce the loading issue.)

Results

Expected

Playback should begin immediately in Chrome when video segments are successfully downloaded, in uniformity as it does in Firefox, Edge, and Safari.

Error output

No errors are observed from the console or from the debug level VideoJS output.

Additional Information

Please include any additional information necessary here. Including the following:

videojs version

what version of videojs does this occur with? video.js 7.2.3

Browsers

what browsers are affected? please include browser and version for each

Platforms

what platforms are affected? please include operating system and version or device and version for each

Other Plugins

are any other videojs plugins being used on the page? If so, please list them with version below.

Other JavaScript

are you using any other javascript libraries or frameworks on the page? if so please list them below.

welcome[bot] commented 5 years ago

👋 Thanks for opening your first issue here! 👋

If you're reporting a 🐞 bug, please make sure you include steps to reproduce it. We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can. To help make it easier for us to investigate your issue, please follow the contributing guidelines.

amtins commented 5 years ago

I saw you're using HLS v4. Your issue seems to be the same as #177 and #244

zac-poe commented 5 years ago

Thanks for the reply @amtins.

Can you elaborate some why you believe this to be a duplicate? Those tickets seem to reference specific media types never playing. In this instance, there is some load latency specific to the Chrome browser. After that latency, the stream plays successfully and without any errors being reported.