Well, I have one global template that just includes the HLS.js reference from CDN:
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
And then just a template node that sets up the video player:
<div style="width: 500px; height: 281px; margin: 0 auto;">
<video id="camera1Video" width="500" height="281" controls muted>
</video>
<script>
(function(scope) {
scope.$watch('msg.payload', function(data) {
var timer = setInterval(function() {
if (!window.Hls) return;
clearInterval(timer);
if (data !== undefined && data.endsWith(".m3u8")) {
var camera1Video = document.getElementById('camera1Video');
if(Hls.isSupported()) {
var hls = new Hls();
hls.loadSource(data);
hls.attachMedia(camera1Video);
hls.on(Hls.Events.MANIFEST_PARSED,function() {
camera1Video.play();
});
} else if (camera1Video.canPlayType('application/vnd.apple.mpegurl')) {
camera1Video.src = data;
camera1Video.addEventListener('canplay',function() {
camera1Video.play();
});
}
}
}, 100)
});
})(scope);
</script>
</div>
And I just send in a message at startup with a msg.payload of the URL to the m3u8. Thats it for node-red. Everything else is making sure I have an HLS stream somewhere.
I personally wouldn't run that in node-red... Ideally the camera itself would provide an HLS stream, but Ubiquiti has refused to see the wisdom in that despite it being one of the highest rated feature requests by users for like two years....
I prefer having a separate process doing that because I don't want node-red really effected at all by the huge overhead that video processing always entails. I mean I guess you could probably do it somehow, and more power to ya, but video restreaming seems like such a unique processing job... I tend to prefer a system made up of many small standalone modules instead of shoving everything into a single process though, so maybe I'm weird.
I DON'T think you can just restream from ffmpeg directly... if would get you the stream files, but you'd have to host and push them through an HTTP server of some sort, which can deal with the CORS and HTTP Header concerns still. But yeah, any standalone configurable restreaming processor would work I guess. Like I said, I run nginx + nginx-rtmp module in a docker image that handles that for me, and while it has its caveats, I haven't found anything even close to similar (have any ideas?). Honestly, if your NVR software will do the restream (BlueIris?) that'd be easier, but I'd think this whole thing would be moot if you found you could do that already, because the two nodes I have above would then handle it.
If you want to do actual image processing in node-red, which it sounds like you guys are kicking the wheels on, that's a different animal obviously... a cool project if you could essentially build a standalone NVR out of a dedicated node-red instance though!