Hey,
So, I’m working with these HLS videos. And I’ve tried a few solutions (some of them were pretty complex and custom) but everything is leading to one common problem
The video glitches out in middle randomly. The BE team is using Cloudflare (CDN) and sending us URLs to play. At first this looked like a very simple task, but now its a pain…
Video Demo: Unique Download Link | WeTransfer
My appraoches so far:
Even I’m now concern that I might be blocked because of this issue chewie | Flutter package But I’m facing this on iOS and Android both.
Any help would really be appreciated, thanks.
chewie, AFAIK, is just a UI over video_player.
video_player is just a wrapper for native code.
If you check the video_player_android code, you’ll see that it has support for different types of network transports, including RTMP (which should be used to stream video - just stop trying to resolve the entire Universe using a text protocol such as HTTP) and there are 3 kinds of streamings in HTTP:
-
Microsoft’s SS (Smooth Streaming), created for Silverlight. It splits the video in small chunks (2 to 4 seconds). This is deprecated.
-
MPD (MPEG Dash or Dynamic Adaptive Streaming over HTTP): video is split into segments (usually MP4), client selects quality per segment. YouTube, Netflix, Android (ExoPlayer), Smart TVs and modern browser use that. Cache here is paramount.
-
m3U8 (Apple HLS - HTTP Live Streaming). Just a plain text file that points to media segments. Quality is switched by swapping playlists. Used on Apple stuff and compatible with smaprt tvs, browsers, android, etc.
Now, your server is giving the correct headers, segments, etc. for your video? Remember that web techs are very non strict (usually they fix things that should not be fixed, for example, a bad formatted HTML usually presents 0 problems).
Does video_player native packages (video_player_android, for instance) deal with web cache? It deals with streaming quality switches?
One thing I noticed recently: YouTube videos, when downloaded, are corrupt (it glitches and are unusable), but they work just fine on YouTube. Maybe they are slicing the video to make them corrupt so it works only on their platform (which are prepared to deal with that).
Just giving you some ideas so you can search where the problem is.
1 Like
Hey, thank you so much for this direction. The kind of HTTP streaming we are using is the option 3rd (m3u8).
So, would you suggest that I should build the native player to play these if a native android video player supports this?
Addtional context: I’ve tried playing the same URL on online HLS players too. Most of them 9/10 are behaving the same way (Glitches, stops or buffer for a long time) at exact same moments.
well then something is wrong with the stream itself, you should try to record it and analyze it, maybe you can do something to repair it, could be something trivial.
does it work with vlc?
video_player already uses a native player (and chewie uses video_player).
flutter_hls_video_player seems to use a web view to display the video (flutter_hls_video_player/lib/flutter_hls_video_player/view/hls_video_player_html.dart at main · dheeraj11qk/flutter_hls_video_player · GitHub). I would not use something that only opens a web browser >.<
And, if that is failing, probably ANYTHING is failing (i.e.: the last option uses a browser, so it is not flutter fault)
1 Like
Thank you, I’ll try to open the simple browser in-app so that user won’t leave the app and see how that works.
Actually I need to play the URLs, not any downloaded media. By VLC, I’m assuming you mean the stream is downloaded in some file? (Please correct me if i’m wrong)