How to insert msg.payload in template UI?

Hi,

I get the ip address and I try to insert it in the iframe. I have read the forum and it should worked but didn't... not sure why.... pls take a look

this iframe with exact ip address works, src="http://172.20.10.2/html/min.php"

But when I try to use msg.payload as the ip address, it fails, src="{{msg.payload}}"

My payload is this "http://172.20.10.2/html/min.php", I have tried with/without "

Btw, I follow this link for my rpi cam and it works. RPi Node Red: Streaming rpi camera to dashboard • T³ Alliance

[{"id":"c35a594d.b471c8","type":"tab","label":"Flow 3","disabled":false,"info":""},{"id":"d55b9849.4b8668","type":"debug","z":"c35a594d.b471c8","name":"with \"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":670,"y":220,"wires":[]},{"id":"7377968.8e4d668","type":"ip","z":"c35a594d.b471c8","name":"ip","https":false,"timeout":"5000","internalIPv4":true,"internalIPv6":true,"publicIPv4":true,"publicIPv6":false,"x":370,"y":220,"wires":[["3c8ed453.f07aac","a687930c.50577"]]},{"id":"c1d58824.9cbf78","type":"inject","z":"c35a594d.b471c8","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"","payloadType":"date","x":210,"y":220,"wires":[["7377968.8e4d668"]]},{"id":"3c8ed453.f07aac","type":"function","z":"c35a594d.b471c8","name":"with \"","func":"Newmsg = {};\nvar ipaddrCam = \"http://\" + msg.payload.internalIPv4 + \"/html/min.php\";\nipaddrCam = '\"' + ipaddrCam + '\"';\nglobal.set (\"ipaddrCam\",ipaddrCam);\nNewmsg.payload = ipaddrCam;\nreturn Newmsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":510,"y":220,"wires":[["d55b9849.4b8668","6c5a5434.f095ec"]]},{"id":"6c5a5434.f095ec","type":"ui_template","z":"c35a594d.b471c8","group":"2045a81e.607958","name":"Working_with_relative_ip_address","order":1,"width":"0","height":"0","format":"<iframe scrolling=no marginwidth=0 marginheight=0 frameborder=0 height=439 width=553 src={{msg.payload}}></iframe>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":760,"y":260,"wires":[[]]},{"id":"bebdcc1f.5a531","type":"ui_template","z":"c35a594d.b471c8","group":"2045a81e.607958","name":"Working_with_absolute_ip_address","order":1,"width":"0","height":"0","format":"<iframe scrolling=no marginwidth=0 marginheight=0 frameborder=0 height=439 width=553 src=\"http://172.20.10.2/html/min.php\"></iframe>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":580,"y":400,"wires":[[]]},{"id":"e2948fec.0c8a2","type":"debug","z":"c35a594d.b471c8","name":"without \"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"payload","targetType":"msg","statusVal":"","statusType":"auto","x":680,"y":300,"wires":[]},{"id":"a687930c.50577","type":"function","z":"c35a594d.b471c8","name":"without \"","func":"Newmsg = {};\nvar ipaddrCam = \"http://\" + msg.payload.internalIPv4 + \"/html/min.php\";\n//ipaddrCam = '\"' + ipaddrCam + '\"';\nglobal.set (\"ipaddrCam\",ipaddrCam);\nNewmsg.payload = ipaddrCam;\nreturn Newmsg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":520,"y":300,"wires":[["e2948fec.0c8a2","7e495c75.367c04"]]},{"id":"7e495c75.367c04","type":"ui_template","z":"c35a594d.b471c8","group":"2045a81e.607958","name":"Working_with_relative_ip_address","order":1,"width":"0","height":"0","format":"<iframe scrolling=no marginwidth=0 marginheight=0 frameborder=0 height=439 width=553 src={{msg.payload}}></iframe>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":760,"y":340,"wires":[[]]},{"id":"2045a81e.607958","type":"ui_group","name":"Group 1","tab":"3d8fbe92.30ee32","order":1,"disp":true,"width":"18","collapse":false},{"id":"3d8fbe92.30ee32","type":"ui_tab","name":"Test","icon":"dashboard","order":3,"disabled":false,"hidden":false}]

Firstly, your flow is un-importable. it is important to surround your code with three backticks
```
like this
```

You can edit and correct your post by clicking the pencil icon.

See this post for more details - How to share code or flow json


Secondly, I can see you have quotes in the string. They should probably not be present.

image

I have created an easier example that shows iframe issue I have.
It seems node-red accepts the iframe but the iframe can not display it....


[{"id":"c35a594d.b471c8","type":"tab","label":"Flow 3","disabled":false,"info":""},{"id":"6c5a5434.f095ec","type":"ui_template","z":"c35a594d.b471c8","group":"2045a81e.607958","name":"https://www.example.com/","order":1,"width":"0","height":"0","format":"<iframe src={{msg.payload}}></iframe>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":590,"y":80,"wires":[[]]},{"id":"bebdcc1f.5a531","type":"ui_template","z":"c35a594d.b471c8","group":"2045a81e.607958","name":"Working_with_absolute_ip_address","order":3,"width":"0","height":"0","format":"<iframe src=\"https://www.example.com/\"></iframe>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":620,"y":160,"wires":[[]]},{"id":"371497f4.35dd88","type":"inject","z":"c35a594d.b471c8","name":"https://www.example.com/","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"https://www.example.com/","payloadType":"str","x":240,"y":80,"wires":[["6c5a5434.f095ec"]]},{"id":"14f682d3.7fb08d","type":"inject","z":"c35a594d.b471c8","name":"\"https://www.example.com/\"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":true,"onceDelay":0.1,"topic":"","payload":"\"https://www.example.com/\"","payloadType":"str","x":240,"y":120,"wires":[["2ab70769.918338"]]},{"id":"2ab70769.918338","type":"ui_template","z":"c35a594d.b471c8","group":"2045a81e.607958","name":"\"https://www.example.com/\"","order":1,"width":"0","height":"0","format":"<iframe src={{msg.payload}}></iframe>","storeOutMessages":true,"fwdInMessages":true,"resendOnRefresh":true,"templateScope":"local","x":600,"y":120,"wires":[[]]},{"id":"2045a81e.607958","type":"ui_group","name":"Group 1","tab":"3d8fbe92.30ee32","order":1,"disp":true,"width":"28","collapse":false},{"id":"3d8fbe92.30ee32","type":"ui_tab","name":"Test","icon":"dashboard","order":3,"disabled":false,"hidden":false}]