Osadzanie zewnętrznych interfejsów HMI

Wiele maszyn przemysłowych udostępnia własny HMI (Human-Machine Interface) przez lokalny serwer webowy. Ten przewodnik pokazuje jak udostępnić te interfejsy HMI z poziomu interfejsu IronFlock używając widgetu Embed, nginx reverse proxy i tuneli dostępu zdalnego.

Podstawowy przykład: Pojedyncza maszyna

Najprostszy przypadek to pojedyncza maszyna CNC (lub PLC, kamera itp.), której serwer webowy HMI jest dostępny z sieci lokalnej urządzenia brzegowego — na przykład pod adresem 192.168.1.50:8080.

1. Skonfiguruj adres maszyny jako parametr aplikacji

Użyj parametru aplikacji, aby umożliwić użytkownikowi konfigurację lokalnego adresu HMI maszyny (np. 192.168.1.50:8080). W ten sposób adres nie jest zahardkodowany i może być ustawiony per instalacja urządzenia.

2. Dodaj nginx reverse proxy w kodzie brzegowym

W konfiguracji Docker swojej aplikacji dołącz prosty kontener nginx, który odczytuje skonfigurowany adres maszyny i przekazuje go do stałego portu na urządzeniu brzegowym — na przykład localhost:3000. Kod brzegowy odczytuje parametr aplikacji i konfiguruje nginx odpowiednio.

3. Zdefiniuj stały port w szablonie portów

W swoim szablonie portów, zadeklaruj port, na którym nasłuchuje nginx:


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

Port musi być stały (nie przydzielany dynamicznie), ponieważ portów dostępu zdalnego nie można dodawać w czasie wykonywania — są definiowane w czasie wydania i konfigurowane per instalacja.

W UI Builder dodaj widget Embed wskazujący na adres tunelu dostępu zdalnego urządzenia na porcie 3000. Oryginalny HMI maszyny CNC pojawia się teraz bezpośrednio w panelu IronFlock.

Ta podstawowa konfiguracja zapewnia zdalny dostęp do HMI pojedynczej maszyny per urządzenie — bez VPN, bez zmian w firewallu.

Zaawansowane: Wiele maszyn per urządzenie

Gdy urządzenie brzegowe jest połączone z kilkoma maszynami, możesz rozszerzyć wzorzec, aby obsługiwać wszystkie ich interfejsy HMI przez jeden przekazywany port używając routingu opartego na ścieżkach.

1. Przechowuj adresy maszyn w tabeli backendu danych

Dodaj tabelę do swojego backendu danych, która śledzi szczegóły każdej maszyny, w tym adres lokalnego serwera webowego i przekierowaną ścieżkę:


# .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. Routuj wiele maszyn przez nginx

Skonfiguruj nginx do reverse-proxy każdej maszyny na oddzielnej ścieżce pod tym samym stałym portem. Na przykład przekieruj 192.168.1.50:8080 do localhost:3000/cnc1/ i 192.168.1.51:8080 do localhost:3000/cnc2/.

3. Dodaj widgety Embed z nawigacją opartą na stronach

W UI Builder utwórz oddzielną stronę panelu dla HMI każdej maszyny i dodaj widget Embed na każdej stronie, który odczytuje forwarded_hmi_path z tabeli machines i używa go jako URL osadzenia.

Aby umożliwić użytkownikom przełączanie między HMI, użyj funkcji Strony i nawigacja. Dodaj widget Nawigacja boczna wylistowujący wszystkie podłączone maszyny jako pionowe menu paska bocznego.

Wynik

Użytkownicy mogą przeglądać wszystkie podłączone maszyny w panelu, wybrać jedną i wchodzić w interakcję z jej oryginalnym HMI bezpośrednio w IronFlock — bez VPN, bez osobnej karty przeglądarki, bez konfiguracji firewalla.