Webcam / IFrame problem with LAN / WAN enviroment

Hiho my friends. I ve a problem with iframes of my webcams when changing the network enviroment.
I forwarded my ports of the node red user interface to make it accessable from everywhere in the www.
I ve some webcams in my menu having their own webinterface. I used a iframe node and linked to these webinterface. (shot1) Everything works fine as long as I am using my ui from my lan. If I call my ui from www the iframes will not work because they link to an internal ip adress witch is not access able from there.... I could change the ip to an external one but that would force the interface allways to route all data through the www. this would cause a delay, traffic and would bound my node red ui to a working www (at least the webcams). Any solutions for making the iframe ui link dynamic or something else that could help ?
thanx !

I forwarded my ports of the node red user interface to make it accessable from everywhere in the www.

This is not recommended, unless you know how to secure it properly.

You might want to read this

1 Like

thanx, but of course I secured node red by using adminAuth, ports > 1024. (like the article tells), I ve backups.... https will follow.

.... but the problem still remains. can anybody help me on that ?

Rereading your topic: your problem will remain unless you open all your cams up to the internet too.
Possible solution: use vpn.

2 Likes

Solution goes like this:

  • webcam 1 interface is reachable at 192.168.0.55:8055 in local network and myhome.ddns.net:8055 in www
  • Create an new group assigned with a template node and use the browser debugging tools to search for a unique indentfier. in my case "Webcam_Test_1_Test_Aufbau_cards md-card"
    (shot)
  • put my code into the template node. the code will basicly
<script>
(function() {
    const external = 'myhome.ddns.net';
    let isLocal = window.location.hostname !== external;

    let cam1 = (isLocal ? '192.168.0.55' : external) + ':8055';
    let cam2 = (isLocal ? '192.168.0.56' : external) + ':8056';
    
    let iframe = document.createElement('iframe');
    iframe.src = 'http://' + cam1;
    iframe.style.height = '400px';
    //iframe.style.border = '2px solid red';
    
    document.querySelector('#Webcam_Test_1_Test_Aufbau_cards md-card').appendChild(iframe);
})();    
</script>

The script will replace the iFrame url depending from the variable "window.location.hostname" to identify if the call was made from myhome.ddns.net or if not local....

Some words to VPN solution: Installing a VPN on my system will cost resources which I need for other stuff. the 1GB RAM of my raspi is on the limit and switching to raspi 4 will be an efford that I ve no time for atm.

As always sorry for my bad english :slight_smile:

I ve no time for atm.

I hope your time is worth more than the security of your home.

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