For those of you interested in re-streaming your ip cams or other videos sources as HLS and playable in the browser or app, I have some nodes that are available to test. npm install kevinGodell/node-red-contrib-mp4frag npm install kevinGodell/node-red-contrib-ui-mp4frag node-red-contrib-mp4frag is a wrapper around an existing lib, mp4frag. It goes a little further and sets up http routes for serving the files to any player capable of consuming HLS video, such as VLC, HLS.js in most modern browsers, or native HLS on iPhone using Safari. node-red-contrib-ui-mp4frag is an implemention of HLS.js, but can fall back to native HLS on devices that support it. It needs much work, especially for handling the many errors that can occur with video streaming. The 2 nodes seem tightly coupled, but are not intended to be. Just as you can view the HLS stream created by mp4frag from outside of nodered, you can also directly give an HLS playlist for ui_mp4frag to play without needing mp4frag to create it. As for myself, I currently have 14 ip cams setup and I can play them all live to any of my laptops, desktop, or iPhones. Of course, I am using the sub stream of my cams so that I don't overload my browser when asking it to decode so many large videos simultaneously. Future plans: I would like to setup sockets for feeding the HLS video files from server to client. HLS.js does not seem like it was created for live streaming and tends to be far behind realtime. My old video player using socket.io could keep up near realtime, delayed only by the duration of a single segment. The tradeoff for keeping up near realtime was video and audio much less smooth than HLS.js. Edit: forgot to include the flow example code. For trying out just the ui_mp4frag: [{"id":"80969b76.764fc8","type":"tab","label":"Video Test 2","disabled":false,"info":""},{"id":"42030e.9afbb4f4","type":"inject","z":"80969b76.764fc8","name":"Sintel","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"https://commondatastorage.googleapis.com/gtv-videos-bucket/CastVideos/hls/Sintel.m3u8","payloadType":"str","x":136,"y":157,"wires":[["c3f14086.b7964"]]},{"id":"c3f14086.b7964","type":"ui_mp4frag","z":"80969b76.764fc8","name":"","group":"c1a8b6f8.c0022","order":3,"width":"6","height":4,"readyPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_ready.png","errorPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_error.png","hlsJsConfig":"{\"liveDurationInfinity\":true,\"liveBackBufferLength\":0,\"maxBufferLength\":5,\"manifestLoadingTimeOut\":1000,\"manifestLoadingMaxRetry\":10,\"manifestLoadingRetryDelay\":500}","restart":"true","autoplay":"true","x":481,"y":156,"wires":[[]]},{"id":"2a1133d2.816f2c","type":"inject","z":"80969b76.764fc8","name":"Elephants Dream","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"https://commondatastorage.googleapis.com/gtv-videos-bucket/CastVideos/hls/ElephantsDream.m3u8","payloadType":"str","x":165,"y":216,"wires":[["c3f14086.b7964"]]},{"id":"bd240e19.706d48","type":"inject","z":"80969b76.764fc8","name":"Big Buck Bunny","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"https://commondatastorage.googleapis.com/gtv-videos-bucket/CastVideos/hls/BigBuckBunny.m3u8","payloadType":"str","x":166,"y":97,"wires":[["c3f14086.b7964"]]},{"id":"c1a8b6f8.c0022","type":"ui_group","z":"","name":"Video Test 2","tab":"2418e319.003404","order":1,"disp":true,"width":"6","collapse":false},{"id":"2418e319.003404","type":"ui_tab","z":"","name":"Video Test 2","icon":"dashboard","disabled":false,"hidden":false}] For trying out the mp4frag and ui_mp4frag: [{"id":"198dbe2b.3d8d9a","type":"tab","label":"Video Test 1","disabled":false,"info":""},{"id":"5c1f54b6.454f7c","type":"inject","z":"198dbe2b.3d8d9a","name":"Start stream","props":[{"p":"payload"}],"repeat":"","crontab":"","once":true,"onceDelay":"1","topic":"","payload":"true","payloadType":"bool","x":190,"y":100,"wires":[["372f3933.65a7a6"]]},{"id":"d52ddf1.b4a51a","type":"inject","z":"198dbe2b.3d8d9a","name":"Stop stream","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"false","payloadType":"bool","x":190,"y":146,"wires":[["372f3933.65a7a6"]]},{"id":"372f3933.65a7a6","type":"switch","z":"198dbe2b.3d8d9a","name":"","property":"payload","propertyType":"msg","rules":[{"t":"true"},{"t":"false"}],"checkall":"true","repair":false,"outputs":2,"x":341,"y":100,"wires":[["6f7b48af.2862f"],["3f385b73.54d284"]]},{"id":"3f385b73.54d284","type":"function","z":"198dbe2b.3d8d9a","name":"stop","func":"msg = {\n kill:'SIGHUP',\n payload : 'SIGHUP' \n}\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":361,"y":149,"wires":[["6f7b48af.2862f"]]},{"id":"6f7b48af.2862f","type":"exec","z":"198dbe2b.3d8d9a","command":"ffmpeg -loglevel quiet -f mp4 -re -i https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/ElephantsDream.mp4 -c:a copy -c:v copy -f mp4 -movflags +frag_keyframe+empty_moov+default_base_moof pipe:1","addpay":false,"append":"","useSpawn":"true","timer":"","oldrc":false,"name":"elephants dream ffmpeg","x":572,"y":120,"wires":[["609e41bb.4ac748"],[],["609e41bb.4ac748"]]},{"id":"5aedd6d7.d727d","type":"ui_mp4frag","z":"198dbe2b.3d8d9a","name":"elephants dream ui_mp4frag","group":"28171ec9.c62efa","order":0,"width":"5","height":"4","readyPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_ready.png","errorPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_error.png","hlsJsConfig":"{\"liveDurationInfinity\":true,\"liveBackBufferLength\":0,\"maxBufferLength\":5,\"manifestLoadingTimeOut\":1000,\"manifestLoadingMaxRetry\":10,\"manifestLoadingRetryDelay\":500}","restart":"true","autoplay":"true","x":1103,"y":117,"wires":[[]]},{"id":"609e41bb.4ac748","type":"mp4frag","z":"198dbe2b.3d8d9a","name":"elephants dream mp4frag","hlsPlaylistSize":"10","hlsPlaylistExtra":"5","hlsPlaylistUrl":"609e41bb.4ac748","x":832,"y":117,"wires":[["5aedd6d7.d727d"]]},{"id":"5c018bd6.6c9e54","type":"inject","z":"198dbe2b.3d8d9a","name":"Start stream","props":[{"p":"payload"}],"repeat":"","crontab":"","once":true,"onceDelay":"1","topic":"","payload":"true","payloadType":"bool","x":190,"y":220,"wires":[["72de9e54.1c0068"]]},{"id":"2a3b4b00.fa1354","type":"inject","z":"198dbe2b.3d8d9a","name":"Stop stream","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"false","payloadType":"bool","x":190,"y":266,"wires":[["72de9e54.1c0068"]]},{"id":"72de9e54.1c0068","type":"switch","z":"198dbe2b.3d8d9a","name":"","property":"payload","propertyType":"msg","rules":[{"t":"true"},{"t":"false"}],"checkall":"true","repair":false,"outputs":2,"x":341,"y":220,"wires":[["9f93c481.f530c8"],["c9f285e2.5f9bb"]]},{"id":"c9f285e2.5f9bb","type":"function","z":"198dbe2b.3d8d9a","name":"stop","func":"msg = {\n kill:'SIGHUP',\n payload : 'SIGHUP' \n}\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":361,"y":269,"wires":[["9f93c481.f530c8"]]},{"id":"9f93c481.f530c8","type":"exec","z":"198dbe2b.3d8d9a","command":"ffmpeg -loglevel quiet -f mp4 -re -i https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/Sintel.mp4 -c:a copy -c:v copy -f mp4 -movflags +frag_keyframe+empty_moov+default_base_moof pipe:1","addpay":false,"append":"","useSpawn":"true","timer":"","oldrc":false,"name":"sintel ffmpeg","x":569,"y":240,"wires":[["47dbee0c.608cc8"],[],["47dbee0c.608cc8"]]},{"id":"a5e6df5b.fe7c28","type":"ui_mp4frag","z":"198dbe2b.3d8d9a","name":"sintel ui_mp4frag","group":"28171ec9.c62efa","order":0,"width":"5","height":"4","readyPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_ready.png","errorPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_error.png","hlsJsConfig":"{\"liveDurationInfinity\":true,\"liveBackBufferLength\":0,\"maxBufferLength\":5,\"manifestLoadingTimeOut\":1000,\"manifestLoadingMaxRetry\":10,\"manifestLoadingRetryDelay\":500}","restart":"true","autoplay":"true","x":1130,"y":237,"wires":[[]]},{"id":"47dbee0c.608cc8","type":"mp4frag","z":"198dbe2b.3d8d9a","name":"sintel mp4frag","hlsPlaylistSize":"10","hlsPlaylistExtra":"5","hlsPlaylistUrl":"47dbee0c.608cc8","x":828,"y":237,"wires":[["a5e6df5b.fe7c28"]]},{"id":"d22a455c.0e5c48","type":"inject","z":"198dbe2b.3d8d9a","name":"Start stream","props":[{"p":"payload"}],"repeat":"","crontab":"","once":true,"onceDelay":"1","topic":"","payload":"true","payloadType":"bool","x":190,"y":340,"wires":[["ff047477.259928"]]},{"id":"7f59ae27.f6ab3","type":"inject","z":"198dbe2b.3d8d9a","name":"Stop stream","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"false","payloadType":"bool","x":190,"y":386,"wires":[["ff047477.259928"]]},{"id":"ff047477.259928","type":"switch","z":"198dbe2b.3d8d9a","name":"","property":"payload","propertyType":"msg","rules":[{"t":"true"},{"t":"false"}],"checkall":"true","repair":false,"outputs":2,"x":341,"y":340,"wires":[["27f81ab5.717a9e"],["6af91471.f4237c"]]},{"id":"6af91471.f4237c","type":"function","z":"198dbe2b.3d8d9a","name":"stop","func":"msg = {\n kill:'SIGHUP',\n payload : 'SIGHUP' \n}\n\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","x":361,"y":389,"wires":[["27f81ab5.717a9e"]]},{"id":"27f81ab5.717a9e","type":"exec","z":"198dbe2b.3d8d9a","command":"ffmpeg -loglevel quiet -f mp4 -re -i https://commondatastorage.googleapis.com/gtv-videos-bucket/sample/BigBuckBunny.mp4 -c:a copy -c:v copy -f mp4 -movflags +frag_keyframe+empty_moov+default_base_moof pipe:1","addpay":false,"append":"","useSpawn":"true","timer":"","oldrc":false,"name":"big buck bunny ffmpeg","x":576,"y":360,"wires":[["7c65c57a.0c4c2c"],[],["7c65c57a.0c4c2c"]]},{"id":"22fedad.e9cdaa6","type":"ui_mp4frag","z":"198dbe2b.3d8d9a","name":"big buck bunny ui_mp4frag","group":"28171ec9.c62efa","order":0,"width":"5","height":"4","readyPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_ready.png","errorPoster":"https://raw.githubusercontent.com/kevinGodell/node-red-contrib-ui-mp4frag/master/video_playback_error.png","hlsJsConfig":"{\"liveDurationInfinity\":true,\"liveBackBufferLength\":0,\"maxBufferLength\":5,\"manifestLoadingTimeOut\":1000,\"manifestLoadingMaxRetry\":10,\"manifestLoadingRetryDelay\":500}","restart":"true","autoplay":"true","x":1101,"y":357,"wires":[[]]},{"id":"7c65c57a.0c4c2c","type":"mp4frag","z":"198dbe2b.3d8d9a","name":"big buck bunny mp4frag","hlsPlaylistSize":"10","hlsPlaylistExtra":"5","hlsPlaylistUrl":"7c65c57a.0c4c2c","x":832,"y":357,"wires":[["22fedad.e9cdaa6"]]},{"id":"28171ec9.c62efa","type":"ui_group","z":"","name":"Video Test 1","tab":"4e54a2ca.371c7c","order":15,"disp":true,"width":"15","collapse":true},{"id":"4e54a2ca.371c7c","type":"ui_tab","z":"","name":"Video Test 1","icon":"dashboard","disabled":false,"hidden":false}] And some screenshots: [image] [image] [image] [image] [image]

Hi, I don't know if this can help (I haven't read all the messages from the beginning but I'll do it as soon as I can). With sub-flow you can set some "environment properties" that can be changed via messages too. And these can be even used to modify some settings of the inside nodes. I used this feature once and it took a while to understand it and how it works

[image] BartButenaers: I assume you should use an editableList. I mean something like in the animated gif that you can see here. Then you can add/remove/reorder items... Not sure if that is 100% what you are looking for?

[image] kevinGodell: I am not sure if there is an event to listen for to detect the toggling of its view. I am using the "ui control" node [image] which generates the following payload when i open or close a tab : [image] this is how I detect if a tab is open or closed, and kill the stream of corresponding camera. But I would prefer that one of your magic tricks more intelligently detects the display or not, of the video. :wink: [image] kevinGodell: EDIT: I just did a quick test by making a group collapsible. Toggling it open and closed does get detect by IntersectionObserver and correctly loads/unloads video. Nice ! Is this something that you can add in your mp4frag node or that I can add myself in Node-Red?

Hi can you expand/explain the comment re exec node ? How can we recreate the dual process issue as that sounds like a bug rather than working as designed.

@dceejay the way i interpreted that was similar to the thread Colin had a couple of months back (related to spawning child processes not being killed) (the thread)

I didn't have a chance to read the other thread, but from what I remember when I peaked at the source code of exec to try to understand it a little better, the spawned processes were kept in an array. If you wanted to later kill one of the processes (if more than one), you had to pass the pid and kill command. I never found a way to get the pid from the node's output to later use with a kill command. Being that spawn mode is for a long running process, I would think there would be a failsafe to only allow 1 process to run (either kill the previous or prevent the new) since multiple processes will be pushing to the same output. If you are making any changes to it, is there any chance to support additional piped outputs, such as stdio[3] and up? I envision it something like the function node that lets me pick the number of outputs which could then be mapped to the stdio pipes. The first output would be the pid on start and then the return code on close. The additional outputs (stdio[1] and higher) would be mapped to the pipes. Being that ffmpeg is good for piping many things at once, I use more than the stdin, stdout, and stderr. I would love to not have to make an ffmpeg specific node. :blush:

[image] krambriw: Reason for my question is that I would like to use OpenCV to open & read your playlists created by the mp4frag nodes. Have I missed something? I added the mp4 video route to the latest update of node-red-contrib-mp4frag. You can now access a live mp4 file. It is a similar route as the others, /mp4frag/e1444359.6666/video.mp4. I was able to view this video directly in chrome and firefox and vlc. Let me know if your opencv can consume the video. [image] SuperNinja: On Windows 10, this node does not work I was thinking that maybe ffmpeg in not in path on your system. Can you access ffmpeg in the command line on the window 10 box? In all of my old nodejs tests involving ffmpeg, I never had any trouble making it work on any system. For node-red-contrib-ui-mp4frag, I added some more code to detect when a video is hidden in an attempt to unload video feeds if not being watched. Still not perfect due to the various browser implementations and lack of conformity. Does not properly support pip mode yet.

[image] kevinGodell: Let me know if your opencv can consume the video YES!!! Works fine now! Two things I have noticed It's very easy during testing, by accident, to start more than one ffmpeg processes if you use an inject node like I do. Therefore I simply added a rate limit like in picture below [image] I have problems sometimes to restart the stream again. It seems the mp4frag node is keeping the url "hanging" so to say. If I change/deploy and change it back/deploy it works again. Sometimes it also works to restart the stream multiple times without any problems Below just a sample using your latest mp4frag mp4 video sent through my AI analyzer https://drive.google.com/file/d/16bJ_CzLauLa8s0fOp-9pJ48pb-LdDxqg/view?usp=sharing Link to the original video (beautiful underwater dance, just 6 minutes, worth viewing): https://vimeo.com/259539583

[image] krambriw: It's very easy during testing, by accident, to start more than one ffmpeg processes if you use an inject node like I do. Therefore I simply added a rate limit like in picture below Yes, I have also noticed that issue. @SuperNinja mentioned something similar. [image] krambriw: I have problems sometimes to restart the stream again. It seems the mp4frag node is keeping the url "hanging" so to say. If I change/deploy and change it back/deploy it works again. Sometimes it also works to restart the stream multiple times without any problems Can you be more specific on the trouble so I can try to duplicate it. Is this when using the video.mp4 path or just viewing in browser using socket io or hls.js? This might also be the issue of double starting the ffmpeg process and mp4frag receives 2 streams at the same time. Since mp4frag is buffering video chunks to serve via http or socket io, it has to be notified when it should reset itself and clear the buffer. Currently, it is tightly coupled to listening for a code or signal from exec to know when the ffmpeg process has stopped and it can ready itself to listen to a fresh new mp4 stream. If it never gets that signal, it will still be trying to receive fragmented mp4 pieces. Seems more and more likely that we will need an ffmpeg dedicated node that properly gives out its status/progress and kills/restarts the process as needed, etc.

Node-RED

Node-RED Forum

[beta testing] nodes for live streaming mp4

Share Your Nodes

Steve-Mcl 30 October 2020 19:53 112

and this one A conundrum with exec node and kill

Topic		Replies	Views
Media source extension video player for live streaming mp4 Developing Nodes	61	8048	5 September 2020
@kevingodell/node-red-mp4frag published to npm Share Your Nodes	16	692	18 January 2023
Input required for an mp4frag cheat sheet General	15	764	12 February 2023
Storing video as mp4 General	41	3654	8 May 2021
IP camera: stream and record a fragment General	89	9737	25 March 2021

Copyright OpenJS Foundation and Node-RED contributors. All rights reserved. The OpenJS Foundation has registered trademarks and uses trademarks. For a list of trademarks of the OpenJS Foundation, please see our Trademark Policy and Trademark List. Trademarks and logos not indicated on the list of OpenJS Foundation trademarks are trademarks™ or registered® trademarks of their respective holders. Use of them does not imply any affiliation with or endorsement by them.

[beta testing] nodes for live streaming mp4

Related topics