>_ DevTrendsde

Sprache

Start

Sprachen

Bereiche

Frontend Backend Mobile DevOps AI / ML GameDev Blockchain Embedded Sicherheit
TypeScript

So leiten Sie ein Terminal direkt an den Browser weiter mit WeTTY

Stellen Sie sich vor: Sie müssen dringend auf einen Home-Server oder eine virtuelle Arbeitsmaschine zugreifen – von einem Tablet, dem Laptop einer anderen Person oder einem Arbeitscomputer mit strengen Sicherheitsrichtlinien, auf dem Port 22 vollständig gesperrt ist und Sie keinen ordentlichen SSH-Client installieren können. Sie öffnen einen Browser, geben eine Adresse ein und erhalten eine vollständige Befehlszeile mit Ihrer vertrauten Shell.

Genau dafür wurde das Projekt WeTTY (Web + TTY) entwickelt.

WeTTY

Unter der Haube

Ältere Lösungen wie Ajaxterm oder Anyterm waren extrem langsam, weil sie auf normale HTTP-Anfragen angewiesen waren, die hin und her gingen. WeTTY funktioniert anders. Das Backend ist mit TypeScript und Node.js aufgebaut, die Kommunikation mit dem Browser erfolgt über WebSockets, und das Rendern wird vom xterm.js-Terminal-Emulator gehandhabt (derselbe, der VS Code antreibt).

Dank der Kombination aus xterm.js und WebSockets ist die Eingabelatenz kaum spürbar, wenn Sie über eine stabile Internetverbindung verfügen. Pseudo-Grafik-Tools funktionieren im Browser-Fenster ohne Probleme: htop, tmux, mc, vim und nano. Mausunterstützung, Tastenkürzel und Terminal-Farben funktionieren wie erwartet.

So starten Sie

Sie können das Tool auf zwei schnelle Arten bereitstellen: über npm oder in einem Docker-Container.

Option 1. Installation über npm

Wenn auf dem Rechner bereits Node.js Version 20 oder höher sowie Build-Tools (make, python, build-essential) vorhanden sind, kann das Tool mit einem einzigen Befehl installiert werden:

npm -g i wetty

Nach der Installation starten Sie den Dienst:

wetty --port 3000

Navigieren Sie nun zu http://localhost:3000 und melden Sie sich mit dem gewünschten Benutzer an. Wenn WeTTY als normaler Benutzer läuft, wird eine SSH-Sitzung zu localhost standardmäßig hergestellt. Als root wird stattdessen /bin/login aufgerufen.

Option 2. Ausführung in Docker

Persönlich finde ich es am einfachsten, solche Tools in Containern zu halten, um den Host nicht mit unnötigen globalen Node.js-Paketen zu belasten:

docker run --rm -p 3000:3000 wettyoss/wetty --ssh-host=192.168.1.50

Ersetzen Sie 192.168.1.50 durch die IP-Adresse des Hosts, zu dem Sie sich per SSH verbinden möchten.

Nützliche Startparameter

Das Tool bietet flexible Konfiguration über Kommandozeilen-Flags:

  • --ssh-host und --ssh-port leiten die Verbindung an einen separaten Remote-Server weiter.
  • --ssh-user legt einen Standardbenutzer fest, damit Sie den Login nicht jedes Mal eingeben müssen.
  • --ssl-key und --ssl-cert aktivieren die direkte Datenverkehrsverschlüsselung.
  • --allow-iframe erlaubt das Einbetten des Terminals in iframes auf anderen Sites (zum Beispiel in Dashboards oder Monitoring-Panels).

Wenn Sie nicht bei jedem Start Flags angeben möchten, können Sie die Parameter in eine Konfigurationsdatei packen und sie über --conf übergeben.

Sicherheit und Produktiveinsatz

Es ist absolut nicht empfehlenswert, einen ungeschützten HTTP-Port von WeTTY ins Internet zu exponieren. Jeder Angreifer könnte versuchen, Passwörter per Brute-Force anzugreifen oder unverschlüsselten Datenverkehr abzufangen.

In der Praxis wird typischerweise ein Reverse Proxy (NGINX, Traefik oder Caddy) vor WeTTY geschaltet, um mehrere Aufgaben zu übernehmen:

  1. Ausstellung und Verlängerung kostenloser SSL-Zertifikate von Let's Encrypt.
  2. Proxy-Weiterleitung von WebSocket-Verbindungen.
  3. Eine zusätzliche Autorisierungsschicht durch Basic Auth oder Authelia.
  4. Einschränkung des Zugriffs basierend auf IP-Adress-Whitelists.

Hier ein typisches NGINX-Konfigurationsbeispiel:

location /wetty/ {
    proxy_pass http://127.0.0.1:3000/wetty/;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_read_timeout 43200000;

    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $http_host;
    proxy_set_header X-NginX-Proxy true;
}

Vergessen Sie nicht, WeTTY selbst mit dem --base /wetty/ Flag zu starten, damit die Routing-Pfade korrekt ausgerichtet sind.

Für wen dieses Projekt geeignet ist

WeTTY adressiert spezifische praktische Bedürfnisse:

  • Schnelle Administration von Home-Servern (Home Lab) und Routern direkt vom Mobiltelefon oder iPad aus.
  • Einrichtung von Demo-Umgebungen und Schulungs-Sandboxes, in denen Teilnehmer Shell-Zugriff benötigen, ohne SSH-Clients konfigurieren zu müssen.
  • Einbettung eines Terminal-Fensters in interne webbasierte Infrastrukturmanagement-Panels.
  • Zugriff auf Server aus isolierten Unternehmensnetzwerken, in denen nur die Ports 80 und 443 geöffnet sind.

Wenn Sie eine leichtgewichtige Möglichkeit benötigen, ein Terminal im Browser zu starten, ohne auf schwergewichtige Web-Oberflächen wie Cockpit oder Proxmox angewiesen zu sein, erledigt WeTTY dies in nur wenigen Minuten. Starten Sie einfach den Container hinter einem Reverse Proxy und fügen Sie Authentifizierung hinzu.

Ähnliche Projekte