How to play RTSP streams in Flutter WEB

215

Near as I can tell, there's no video player (for web) that supports RTSP or even HLS right now. Even the official video_player package from the flutter dev team doesn't seem to support that on web, yet. I can offer a workaround though....

If you implement a decent webrtc package and a media server, you can bypass the need to receive RTSP directly on your client. I've been using the flutter_webrtc package for a while now via the livekit_client package. Livekit has a SFU that could be used to proxy RTSP streams for communication to WebRTC enabled clients. I've seen a lot of people use ant media server for that sort of thing as well, and I'm pretty sure you can use the community edition of Ant for free.

People tend to use media servers for aggregating video streams so that instead of 1 client subscribing to 15 streams from various sources, instead a media server somewhere with a very good Internet connection and decent hardware subscribes to those streams and then generates a new video stream (or streams) such that your phone, or tablet, or laptop client somewhere on a 4G network, only has to receive (a) WebRTC stream(s) that can be optimized on the server in various ways.

EDIT: I had another thought, I don't know if this would work very well, but you could dynamically generate an HTML page inside an IFrame and use HTMLElementView. This would let you use a JavaScript/HTML5 video player to play your RTSP stream, however it comes with a heavy cost and you'd want to do a platform check to make sure you're running on web before using it.

Share:
215
Muhammad Shafique
Author by

Muhammad Shafique

Updated on January 01, 2023

Comments

  • Muhammad Shafique
    Muhammad Shafique over 1 year

    Hy there everyone, I'm new to Flutter and I'm want to show RTSP stream from my IP Camera. Is there any way to play RTSP streams in Flutter WEB.