noVNC

Allgemein

noVNC

Von Adrian Gayl 0

Ziel ist es per noVNC einen HTML5 VNC-Viewer unter Windows bereitzustellen. Und über einen Apache ReverseProxy im Internet zu veröffentlichen.

Schaubild des Ablaufs beim Aufruf der noVNC-Seite. Zielsystem stellt VNCServer und per Websockify die noVNC Seite zur verfügung. Erreichbar per portforwarding vom Internet aus. Aufruf geschieht über einen ReverseProxy aus dem Internet.

Drei Komponenten (und ein Zertifikat) sind erforderlich.

Auf die Installation des VNC-Servers gehe ich nicht weiter ein. Nur ein Hinweis: Manche VNC-Server lassen keine Verbindung zu solange kein Passwort gesetzt wurde.

Die Dateien für noVNC und Websockify habe ich in einem Unterordner unter c:\noVNC kopiert. Die Verzeichnisstruktur sieht dann so aus:

Explorerfenster zeigt auf C:\noVNC Inhalt erkennbar: Ordner noVNC, Ordner Websockify , Zertifikat self.pem

Das Zertifikat kann wie im Readme von Websokify beschrieben ist erstellt werden: https://github.com/novnc/websockify#encrypted-websocket-connections-wss

openssl req -new -x509 -days 365 -nodes -out self.pem -keyout self.pem

Dann kann auch schon noVNC gestartet werden:

c:\novnc\websockify\websockify.exe 4000 127.0.0.1:5900 --web C:\noVNC\noVNC\ --cert c:\novnc\self.pem

Der Webserver läuft in diesem Beispiel nun auf Port 4000 auf der Zielmaschine. Dieser muss nun von außen erreichbar sein. Dazu wird das Portforwarding im Router konfiguriert. Dazu habe ich Port 14012 auf die interne IP auf Port 4000 freigegeben. Nach erfolgreichem test, ob Websockify den Ordnerinhalt von C:\noVNC\noVNC\ auflistet, kann man die Datei vnc.html in index.html umbenennen, damit diese automatisch geladen wird.

Beim Verbindungsaufbau erschien bei mir zunächst immer der Fehler: 400 Client must support ‚binary‘ or ‚base64‘ protocol

Diesen Fehler habe ich behoben, nachdem ich bei der Methode / Funktion open(uri, protocols)
this.attach(new WebSocket(uri, protocols)); in
this.attach(new WebSocket(uri, [‚binary‘, ‚base64‘])); umgeschrieben habe.

Damit noVNC auf Port 443 erreichbar ist, wurde ein ReverseProxy auf einem Apache wie folgt konfiguriert:

# turn off name check for backend server SSL cert
		SSLProxyVerify none
		SSLProxyCheckPeerCN off
		SSLProxyCheckPeerName off
		SSLProxyCheckPeerExpire off

# Proxy target
        ProxyPreserveHost On
        ProxyRequests on
        ProxyPass "/" "https://dynaddress.gayl.org:14012/"
        ProxyPassReverse "/" "https://dynaddress.gayl.org:14012/"

# RewriteEngine WS://
        RewriteEngine on
        RewriteCond %{HTTP:Upgrade} ^websocket$ [NC]
        RewriteCond %{HTTP:CONNECTION} ^upgrade$ [NC]
        RewriteRule .*  ws://dynaddress.gayl.org:14012/ [P]

# LogfilePathes
        ErrorLog ${APACHE_LOG_DIR}/vnc_ssl_error.log
        CustomLog ${APACHE_LOG_DIR}/vnc.log WithHost

So sieht dann die Anmeldeseite aus:

Webbrowser mit noVNC-Webseite und dem Butten "Verbinden"

Und so schaut es aus, wenn man verbunden ist:

Anmeldemaske eines Windowsdeskop im Browser