Externe HMIs einbinden

Viele Industriemaschinen stellen ihre eigene HMI (Human-Machine Interface) über einen lokalen Webserver bereit. Diese Anleitung zeigt, wie Sie diese HMIs über die IronFlock-Oberfläche zugänglich machen — mit dem Embed-Widget, einem nginx-Reverse-Proxy und Remote-Access-Tunneln.

Einfaches Beispiel: Einzelne Maschine

Der einfachste Fall ist eine einzelne CNC-Maschine (oder SPS, Kamera usw.), deren HMI-Webserver vom lokalen Netzwerk des Edge-Geräts erreichbar ist — zum Beispiel unter 192.168.1.50:8080.

1. Maschinenadresse als App-Parameter konfigurieren

Verwenden Sie einen App-Parameter, damit der Benutzer die lokale HMI-Adresse der Maschine konfigurieren kann (z. B. 192.168.1.50:8080). So ist die Adresse nicht fest codiert und kann pro Geräteinstallation eingestellt werden.

2. Nginx-Reverse-Proxy im Edge-Code hinzufügen

Fügen Sie in Ihrem Docker-Setup einen einfachen nginx-Container hinzu, der die konfigurierte Maschinenadresse liest und an einen festen Port auf dem Edge-Gerät weiterleitet — zum Beispiel localhost:3000. Der Edge-Code liest den App-Parameter und konfiguriert nginx entsprechend.

3. Festen Port im Port-Template definieren

Deklarieren Sie in Ihrem Port-Template den Port, auf dem nginx lauscht:


# .ironflock/port-template.yml
ports:
  - name: CNC Machine HMI
    port: 3000
    main: false

Der Port muss fest sein (nicht dynamisch zugewiesen), da Remote-Access-Ports nicht zur Laufzeit hinzugefügt werden können — sie werden beim Release definiert und pro Installation konfiguriert.

Durch die Deklaration des Ports in port-template.yml können Projektadministratoren den Remote-Zugriff auf die CNC-Maschine in den App-Einstellungen aktivieren oder deaktivieren. Bei der Erstinstallation der App auf einem Gerät muss der Benutzer den Remote-Zugriff auf diesen Port in den Installationseinstellungen explizit erlauben. Dies ist eine Sicherheitsfunktion — Remote-Zugriff ist standardmäßig nicht aktiviert.

Remote-Zugriff ist hier erforderlich, weil der Benutzer, der auf das HMI zugreift, sich auf seinem lokalen Laptop befindet und nicht im Netzwerk des Edge-Geräts. Die Tunnel-Technologie von IronFlock erstellt eine sichere Verbindung vom Browser des Benutzers bis zum weitergeleiteten Port des Edge-Geräts.

Fügen Sie im UI Builder ein Embed-Widget hinzu, das auf die Remote-Access-Tunnel-Adresse des Geräts auf Port 3000 zeigt. Das originale HMI der CNC-Maschine erscheint nun direkt im IronFlock-Board.

Dieses einfache Setup ermöglicht den Remote-Zugriff auf das HMI einer einzelnen Maschine pro Gerät — ohne VPN, ohne Firewall-Änderungen.

Fortgeschritten: Mehrere Maschinen pro Gerät

Wenn ein Edge-Gerät mit mehreren Maschinen verbunden ist, können Sie das Muster erweitern, um alle HMIs über einen einzigen weitergeleiteten Port mit pfadbasiertem Routing bereitzustellen.

1. Maschinenadressen in einer Data-Backend-Tabelle speichern

Fügen Sie Ihrem Data Backend eine Tabelle hinzu, die die Details jeder Maschine enthält, einschließlich der lokalen Webserver-Adresse und des weitergeleiteten Pfads:


# .ironflock/data-template.yml
data:
  tables:
    - tablename: machines
      maintainLatestFlagFor: ['machine_id']
      columns:
        - id: tsp
          dataType: timestamp
        - id: machine_id
          dataType: string
        - id: name
          dataType: string
        - id: local_hmi_address
          dataType: string
        - id: forwarded_hmi_path
          dataType: string

2. Mehrere Maschinen über nginx routen

Konfigurieren Sie nginx so, dass jede Maschine auf einem separaten Pfad unter demselben festen Port als Reverse-Proxy bereitgestellt wird. Leiten Sie zum Beispiel 192.168.1.50:8080 nach localhost:3000/cnc1/ und 192.168.1.51:8080 nach localhost:3000/cnc2/ weiter. Speichern Sie diese weitergeleiteten Pfade zurück in die machines-Tabelle, damit das Board weiß, wo jedes HMI zu finden ist.

Derselbe feste Port und das Port-Template aus dem einfachen Beispiel gelten — ein Port bedient alle Maschinen über verschiedene Pfade.

Erstellen Sie im UI Builder eine separate Board-Seite für das HMI jeder Maschine und fügen Sie auf jeder Seite ein Embed-Widget hinzu, das den forwarded_hmi_path aus der machines-Tabelle liest und als Embed-URL verwendet.

Um Benutzern das Wechseln zwischen HMIs zu ermöglichen, nutzen Sie die Funktion Seiten & Navigation. Fügen Sie ein Seitennavigation-Widget hinzu, das alle verbundenen Maschinen als vertikales Seitenmenü auflistet. Die Menüeinträge können dynamisch aus der machines-Tabelle generiert werden, sodass neue Maschinen automatisch erscheinen. Wenn ein Benutzer auf einen Maschinennamen klickt, navigiert das Board zur entsprechenden Seite und das Embed-Widget auf dieser Seite lädt das korrekte HMI.

Das Ergebnis

Benutzer können alle verbundenen Maschinen im Board durchsuchen, eine auswählen und direkt in IronFlock mit dem originalen HMI interagieren — ohne VPN, ohne separaten Browser-Tab, ohne Firewall-Konfiguration. Das Embed-Widget, Data Backend und der Remote-Access-Tunnel arbeiten zusammen, um eine einheitliche und sichere Steuerungsoberfläche für eine ganze Maschinenflotte zu schaffen.