Huon Swales
Huon Swales

Reputation: 41

How can I create a live video stream in a SvelteKit app using a websocket as a source

I am working on a web based robotics control panel with one of the desired features being the ability to stream video data from an onboard camera. The problem that I have found is that the data I receive from the rosbridge node for the camera are JPEG's in string form over a websocket and I'm having trouble finding a good way of converting this data into a video.
The current solution that I have tested to make sure that the camera is working it to update the src property of a <img /> tag with the string.

An example of what im trying to achive is the foxglove studio image panel however I can't find any open source code for it.

Upvotes: 0

Views: 54

Answers (1)

Christian Fritz
Christian Fritz

Reputation: 21374

You will want to use webrtc for that. We wrote a long blog post explaining why this is the right choice for robotics. The key point is that it gives you UDP (so when network is bad, old frames can be dropped), h264 compression, congestion control (reduce image quality when network is bad), packet loss mitigation, it avoids the need for a VPN, and of course most of all: low-latency (~200ms). On the robot you will most likely want to use hardware acceleration, assuming your computer or SoC support that (they better).

Here the post: 5 Ways to Stream Video from Robots and Why You Should Use WebRTC

Upvotes: 1

Related Questions