ESP32-Cam AND Node-red

General
1

My ESP32 - CAM to generate video address is: http://192.168.137.237/mjpeg, what should I obtained and displayed in the Node - red. I've been trying for a long time and I still don't understand. I'd appreciate it if a professional could help me out

2

@Fzp Welcome to the forum!

Where do you want to display the video? In the editor or in the dashboard?
Since you have been trying to do it, what have you tried so far?
Have you tried node-red-contrib-multipart-stream-decoder and it's example flow?

What version of NR and node.js are you running? (you can find this in teh NR startup log)
What platform are you using?

2 Likes
3

hi,zenofmud, I'm glad you could answer my question. I have tried the method you said, but I don't seem to get the flow. I also tried to use the ui-template node code < img SRC = "http://192.168.137.237/mjpeg/1" width = "100%" height = "auto" >. It was not successfully obtained.
I was using a Node-RED version: v3.0.2,Node.js version: v18.16.0

4

I have some ESP32-Cam's myself and for sure, it can work with Node-RED

Does it work when you open the link in a browser? That should work, if not, the problem is not related to Node-RED

But be aware, by default you can only stream to one single client at a time. So if you by mistake leave the streaming ongoing in a web browser and try with Node-RED at the same time it will not work if you have the default firmware in the camera (there are firmware available that supports streaming to multiple clients)

Share your flow and people here can check it and eventually help trying it out for you

5

hi,krambriw.I can access it normally in my browser, I have tried to use wechat mini program to get the video stream normally, my esp32-cam video stream address can only be entered in the LAN, it seems that it can not be shared

6

Example from my ESP32-Cam as POC that it works in Node-RED
Share your flow to get further help. Why you mention LAN?? Do you try to access from Internet? If so it will of course, and hopefully not, work without specific arrangements with firewall, proxy, secure communication etc

image
image1259×702 192 KB

1 Like
7

QQ图片20230824143115
QQ图片202308241431151851×982 91.5 KB

image
image1449×934 72.4 KB

I don't know where I'm going wrong, No pictures show

8

Thank you. I know we got the video stream. I didn't figure it out myself. Thanks again for your careful answer

9

hi,krambriw.I have another question, how to make the video display in the dashboard

10

For that you just need a ui template node. Example code, see below

image
image1670×770 235 KB

<!DOCTYPE html>
<html>
<style>
    img {
        border: 1px solid #ddd;
        border-radius: 8px;
        padding: 2px;
        width: 440px;
        height: 330px;
    }

    .imgc {
        border: 1px solid #ddd;
        border-radius: 8px;
        padding: 2px;
        width: 200px;
        height: 150px;
    }

    .norm {
        border: 4px outset;
        color: white;
        background: #FBF14D;
    }

    .norm:active {
        border: 4px inset;
        color: black;
        background: #FBF14D;
    }

    .dnorm {
        border: 4px outset;
        color: white;
        background: #FBF14D;
    }

    .dnorm:active {
        border: 4px inset;
        color: red;
        background: #FBF14D;
    }
</style>

<center>
    <table>
        <!-- put the link address of your cam in this line: -->
        <tr>
            <!-- Row 1 -->
            <td style="text-align: center"><img src="http://192.168.0.247/mjpeg/1" id="c31" /></td>
        </tr>
    </table>
</center>

</html>
2 Likes
11

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