I have an off-brand ip-camera that displays a live feed of the video in a <canvas> element in its web ui. I would like to rebuild this ui.

I believe the camera serves the video feed through a websocket connection since rtsp:// in not browser compatible. The feed url is: ws://192.168.0.20:80/websocket.

I put together a basic browser script that connects to the websocket and listens for messages. It connects fine, but no messages begin streaming. The script looks like this:

const WS_URL = 'ws://192.168.0.20:80/websocket';

function setupWebSocket() {
    const ws = new WebSocket(WS_URL);

    ws.onopen = function() { console.log('connected'); }
    ws.onmessage = function(e) { console.log(e.data); }

    return ws;
}

const ws = setupWebSocket();

This code successfully prints "connected" but no messages start arriving in onmessage. If I do a ws.send('some-data') a message will happily come, but again no video data is being automatically streamed from the camera as I thought it would.

Is it correct to expect video data to automatically begin streaming once connected? If not how would I trigger it to start? Am I going about this correctly? I would appreciate any advice no matter how general. As you can probably tell I am not overly seasoned with sockets or video.

Thanks!

UPDATE: The camera model is ONWOTE PoE Security Camera UltraHD 4K 8MP with Audio, 2.8mm Lens Wide View Angle, Indoor/Outdoor, 100ft IR, Add on Turret IP Camera to ONWOTE 4K Security System

The network panel shows a websocket connection managed by libde265.js which is a library to decode h265 data.