# Snapshop from a video stream

**URL:** <https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662>\
**Category:** General\
**Created:** [9 February 2021 09:55 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662 "2021-02-09T09:55:41Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ino](https://avatars.discourse-cdn.com/v4/letter/i/bbe5ce/32.png) [@Ino](https://discourse.nodered.org/u/Ino)\
**Post date:** [9 February 2021 09:55 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/1 "2021-02-09T09:55:41Z")

</div>

I am using a template node for streaming video. This stream is from a esp32 CAM and is working fine with a good fps rate; so I don't want to change this.  
code:

/style  
img src="[http://192.168.x.x](http://192.168.x.x)" width="200px"

Is there a way to grab a picture from this stream and save it? I tried a lot of solutiotions, but after 2 days (and nights) I still haven't found the right way. Sometimes I had something working, but than my fps rate gets too low. I hope that someone had the same problem with the right solution and want to share it.

Thanks in advantage

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [9 February 2021 16:23 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/2 "2021-02-09T16:23:27Z")

</div>

> [@Ino](#):
>
> I don't want to change this

Hi Ino,  
Do you want to take a snapshot in your browser, and store it on the pc where your browser is showing your dashboard? Or do you want to take a snapshot in your Node-RED flow, and store it on the device where your Node-RED flow is running?  
Bart

---

<div class="post-metadata">

**Author:** ![kuema](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/kuema/32/6542_2.png) [@kuema](https://discourse.nodered.org/u/kuema)\
**Post date:** [9 February 2021 17:28 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/3 "2021-02-09T17:28:48Z")

</div>

If I remember correctly, those ESP32 cams serve a motion JPEG stream. So saving the "image" in the browser won't work, as it tries so save the stream indefinitely.

I have been using this approach for my Motion based webcams, serving MJPEG as well.

> [@Node-Red with OpenCV](https://discourse.nodered.org/t/node-red-with-opencv/26067/7):
>
> I am using a similar setup with some RPis running Motion. I have Node-RED running on another machine, where I can capture a still image using an ffmpeg from an exec node, and process the image with [node-red-contrib-image-tools](https://flows.nodered.org/node/node-red-contrib-image-tools). Mainly reducing size and quality for use in a Telegram bot. Here's a basic flow for that, just change IP and port of your Motion server: [{"id":"370d8c79.3d439c","type":"exec","z":"93b1388c.f7fc4","command":"ffmpeg -i http://ip:port/ -vframes 1 -f image2 -","addpay":fa…

Basically it uses ffmpeg via an exec node. It captures exactly one frame (a single jpeg) that is sent via stdout back to Node-RED.

---

<div class="post-metadata">

**Author:** ![Ino](https://avatars.discourse-cdn.com/v4/letter/i/bbe5ce/32.png) [@Ino](https://discourse.nodered.org/u/Ino)\
**Post date:** [9 February 2021 17:28 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/4 "2021-02-09T17:28:53Z")

</div>

Hello Bart,

Thanks for the reply!

I want to take a snapshot in my Node-RED flow and store it on the device where the Node\_RED flow is running; a Raspberry Pi. I tried some of your nodes and the most interesting is multipart- stream-decoder, but the fps rate is significant decreasing when I use this node. For my application this is not prefarable because I want to make a snapshot in an occurring suddenly, situation and look back later.

FYI I will use it onboard of a (sailing) vessel and past year I had a discussion (and damage) caused by an accident with another ship.

Kind regards, Ino

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [9 February 2021 19:48 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/5 "2021-02-09T19:48:01Z")

</div>

> [@Ino](#):
>
> multipart- stream-decoder, but the fps rate is significant decreasing when I use this node

Ah, I wasn't aware of that.  
It is written in Javascript so I will never be able to get the same performance as e.g. ffmpeg. But I have been optimizing the code over and over again, so I had hoped that it would be at least usable... Especially since the ESP32 cam [seems](https://discourse.nodered.org/t/esp32-cam-and-node-red/18161/8) sends the Content-Lenght (i.e. the length of the image byte buffer) withing the stream: then my node just can copy entire images, without having to search for boundaries between images (which should be very fast).

Perhaps this is a bit off-topic, but what do you mean with "_fps is decreasing significant_"? I always put an _ **node-red-contrib-msg-speed** _ node in my flow when I want to measure the fps ...  
Since I only use my own multipart decoder node for decoding mjpeg, I have no experience with other nodes. In that case you might have a look at the proposal from @kuema above...

Sorry to hear from your boat accident. But beside that, it is always nice to hear in which use case our contributions are being used 😉

---

<div class="post-metadata">

**Author:** ![Ino](https://avatars.discourse-cdn.com/v4/letter/i/bbe5ce/32.png) [@Ino](https://discourse.nodered.org/u/Ino)\
**Post date:** [9 February 2021 20:37 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/6 "2021-02-09T20:37:09Z")

</div>

@BartButenaers, @kuema

Bart, to avoid misunderstandings, your multipart stream decoder works great and I already used it. In this case I try to get the highest fps rate to get a smooth 'flow' on my screen. Maybe I have overlooked something in your decoder and I have to try it again. In my case I got a slow refreshing view, but maybe its an EPS32 cam problem. I alsowill try the proposal of kuema.  
In any case thanks for your contribution!

@kuema Thanks for your reply. I will install the required software and the flow. I will inform you about the results.

Kind regards,

Ino

---

<div class="post-metadata">

**Author:** ![BartButenaers](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/bartbutenaers/32/10476_2.png) [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)\
**Post date:** [9 February 2021 20:50 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/7 "2021-02-09T20:50:17Z")

</div>

> [@Ino](#):
>
> In my case I got a slow refreshing view

Ok, then I have misunderstood your issue ...  
How do you send the images to your dashboard: do you push the images to your dashboard? Because that can slow down due to the current setup of the [socket.io](http://socket.io) websocket channel, when you push too much data through it. Cannot determine how you do it, because the template code snippet that you have shared seems to be only a part of it?  
But perhaps that is not the issue, so the ffmpeg solution from Matthias might already solve everything ...

---

<div class="post-metadata">

**Author:** ![Ino](https://avatars.discourse-cdn.com/v4/letter/i/bbe5ce/32.png) [@Ino](https://discourse.nodered.org/u/Ino)\
**Post date:** [12 February 2021 16:03 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/8 "2021-02-12T16:03:49Z")

</div>

Unfortunately, I can't get it fixed;even the ffmpeg solution is not working. I am using the given code in the template node and it works fine for a video stream. So my next step will be doing something completely different and after a while pick it up again and try to export the image to a payload and than.....

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [13 April 2021 16:04 UTC](https://discourse.nodered.org/t/snapshop-from-a-video-stream/40662/9 "2021-04-13T16:04:25Z")

</div>

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.