HowTo: Node Red – Display IP Cam Images in Dashboard

If you have an IP camera installed on your network - or elsewhere - you can also view the camera image in NodeRed's dashboard.

How to do this is explained in the following article.

Safety instructions

I know the following notes are always kind of annoying and seem unnecessary. Unfortunately, many people who knew "better" have lost eyes, fingers or other things due to carelessness or injured themselves. Data loss is almost negligible in comparison, but even these can be really annoying. Therefore, please take five minutes to read the safety instructions. Because even the coolest project is not worth injury or other trouble.
https://www.nerdiy.de/sicherheitshinweise/

Affiliate links/advertising links

The links to online shops listed here are so-called affiliate links. If you click on such an affiliate link and make a purchase via this link, Nerdiy.de will receive a commission from the relevant online shop or provider. The price does not change for you. If you make your purchases via these links, you support Nerdiy.de in being able to offer other useful projects in the future. 🙂 

Requirements

Helpful articles:
To be able to use this configuration, NodeRed should of course already be installed.
How to prepare a RaspberryPi and then install NodeRed on it is described in the following articles.

The following articles describe what has to be done to prepare the RaspberryPi so far:
RaspberryPi – setup for nerdiys!
RaspberryPi – The first configuration!
RaspberryPi – Control the RaspberryPi via SSH
NodeRed – Installing NodeRed on the RaspberryPi
NodeRed – Install new nodes
NodeRed - Create a user interface with dashboard nodes

Required tool:
-no-

Required material:

In the following list you will find all the parts you need to implement this article.

Log into the NodeRed configuration interface

Before you can edit your NodeRed configuration, you must - if activated - first log into the NodeRed configuration interface.

node-red-node-base64 -Install node

In case the code below can't be copied formatted correctly: I have also uploaded the code in the nerdiy git: https://github.com/Nerdiyde/NodeRedSnippets/blob/master/View%20IP%20Cam%20Images%20in%20Dashboard.txt

[{"id": "50183f7f.5ae77","type":"http request","z":"2bfb0626.bbf15a","name":"imageRequest","method":"GET","ret":"bin","url":"http://YOUR_CAM_IP/image.jpg","tls":"","x":1320,"y":4600,"wires":[["79c3426c.7df78c","bf8a81cf.8f74","945489e7.cfc1d8"]]},{"id":"835ede3.e20822","type":"inject","z":"2bfb0626.bbf15a","name":"regularRequest","topic":"","payload":"","payloadType":"date","repeat":"10","crontab":"","once":false,"onceDelay":0.1,"x":1120,"y":4600,"wires":[["50183f7f.5ae77"]]},{"id":"bf8a81cf.8f74","type":"debug","z":"2bfb0626.bbf15a","name":"debug","active":false,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","x":1510,"y":4680,"wires":[]},{"id":"d86c30df.cda1d","type":"ui_template","z":"2bfb0626.bbf15a","group":"4615860e.37a298","name":"DashboardViewer","order":7,"width":"6","height":"6","format":"Camera
","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":false,"templateScope":"local","x":1790,"y":4600,"wires":[[]]},{"id":"945489e7.cfc1d8","type":"base64","z":"2bfb0626.bbf15a","name":"convertingToBase64","action":"","property":"payload","x":1560,"y":4600,"wires":[["d86c30df.cda1d"]]},{"id":"79c3426c.7df78c","type":"image","z":"2bfb0626.bbf15a","name":"","width":200,"x":1530,"y":4640,"wires":[]},{"id":"4615860e.37a298","type":"ui_group","z":"","name":"Status","tab":"a958b123.88e1d","order":1,"disp":true,"width":"6","collapse":false},{"id":"a958b123.88e1d","type":"ui_tab","z":"","name":"Home","icon":"dashboard"}]

Have fun with the project

I hope everything worked as described for you. If not or you have questions or suggestions please let me know in the comments. I will then add this to the article if necessary.
Ideas for new projects are always welcome. 🙂

PS Many of these projects - especially the hardware projects - cost a lot of time and money. Of course I do this because I enjoy it, but if you think it's cool that I share the information with you, I would be happy about a small donation to the coffee fund. 🙂