>_ DevTrendsde

Sprache

Start

Sprachen

Bereiche

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

Traefik vom Browser aus verwalten ohne manuelles YAML-Bearbeiten

Wenn du Traefik aktiv als Reverse Proxy in deinem Home-Lab oder auf Produktionsservern nutzt, kennst du wahrscheinlich seine Hauptbeschränkung. Das integrierte Dashboard sieht zwar gut aus, ist aber völlig statisch. Du kannst die Liste der Routen ansehen, aber du kannst keine neue Domain hinzufügen oder eine Middleware direkt im Browser anpassen. Du musst ein Terminal öffnen, dich per SSH verbinden und YAML-Dateien bearbeiten. Ein falsch gesetztes Leerzeichen – und der gesamte Datenverkehr steht still.

Ein Entwickler unter dem Nickname chr0n6 ist auf dieses Problem gestoßen und hat das Projekt Traefik Manager erstellt. Es ist ein Web-Panel für die visuelle Verwaltung des Routers, das dich davor bewahrt, spätnachts in einen Texteditor eintauchen zu müssen.

Traefik Manager Interface

Warum die vertraute Dateibearbeitung durch eine Web-Oberfläche ersetzen

Die gesamte Logik von Traefik basiert auf den Konzepten Routes, Services und Middlewares. Wenn du mehr als ein Dutzend Services hast, wird die Pflege der dynamischen Konfiguration zur Routinearbeit.

Traefik Manager bietet einen visuellen Builder für das Erstellen und Bearbeiten dynamischer Konfigurationsdateien. Das Tool generiert YAML nicht einfach von Grund auf neu – es nutzt die ruamel.yaml-Bibliothek. Das bedeutet, dass manuelle Kommentare und Go-Templates in den Dateien beim Speichern über die UI nicht überschrieben werden.

Die Oberfläche bewältigt mehrere häufige Traefik-Administrationsaufgaben:

  • HTTP-, TCP- und UDP-Route-Builder mit Unterstützung für komplexe Regeln wie PathPrefix oder HostRegexp.
  • Fertige Voreinstellungen für beliebte Media-Server wie Jellyfin, Plex und Emby, die mit einem Klick die korrekten Security-Header und Streaming-Parameter konfigurieren.
  • TLS-Zertifikatsverwaltung mit Anzeige des Ablaufdatums.
  • Integrierter Monaco-Editor mit Syntax-Highlighting für Fälle, in denen du eine ungewöhnliche oder benutzerdefinierte Regel schreiben musst.

Middleware-Setup-Assistenten ohne Dokumentation lesen zu müssen

Das netteste Detail des Projekts sind die Schritt-für-Schritt-Assistenten für Middlewares. Anstatt jedes Mal in der Traefik-Dokumentation nach der genauen Syntax für Authorization-Header oder Request-Rate-Limiting zu suchen, wählst du das benötigte Szenario aus 24 fertigen Assistenten.

Unter den unterstützten Szenarien:

  • Basic- und Digest-Autorisierung.
  • Forward-Auth-Konfiguration für die Arbeit mit Authentik, Authelia und Gatekeeper.
  • OIDC-/SSO-Konfiguration.
  • Rate-Limiting und IP-Allowlists.
  • URL-Präfix-Ersetzung, -Entfernung oder -Hinzufügung.

Jeder Assistent stellt klare Fragen in einem Formular und generiert dann den entsprechenden Abschnitt in der Datei. Wenn du ein Proxying über Cloudflare oder einen anderen externen Dienst nutzt, schlägt das Tool vor, wie du die Trusted-Hops-Tiefe korrekt konfigurierst, damit Client-IP-Adressen nicht auf dem Weg verloren gehen.

Änderungsrollback und automatisches Git-Backup

Die größte Angst beim Ändern von Proxy-Einstellungen ist, versehentlich den Zugang zum Proxy selbst zu unterbrechen. Traefik Manager hat einen Schutz gegen dieses Szenario eingebaut.

Vor jeder Dateispeicherung erstellt das System ein gezieltes lokales Backup mit Zeitstempel. Wenn etwas schiefgeht, kannst du die vorherige funktionierende Version mit einem Knopfdruck wiederherstellen.

Für diejenigen, die ihre Konfiguration lieber in Repositories speichern, gibt es einen eingebauten Git-Auto-Push-Mechanismus. Du kannst GitHub, GitLab, Gitea oder Forgejo verknüpfen. Nach jeder Änderung committet und pusht das Panel automatisch auf den Branch. Es gibt einen History-Viewer mit visuellem Diff-Vergleich direkt in der Oberfläche, sodass du immer sehen kannst, wer und wann die Konfiguration geändert hat.

Verwaltung mehrerer Server über Agent

Wenn du nicht nur einen Server hast, sondern eine Infrastruktur mit mehreren Hosts, musst du kein separates Panel auf jedem bereitstellen und öffnen.

Das Projekt enthält Traefik Manager Agent (TMA), geschrieben in Go. Du installierst ihn neben Traefik auf einem Remote-Rechner, generierst einen API-Key und verbindest ihn mit der zentralen Oberfläche. Ein Server-Switcher erscheint oben im Panel. Darüber kannst du Logs ansehen, Routen ändern und Konfigurationen auf allen verbundenen Hosts zurücksetzen.

Darüber hinaus benötigt der Agent nicht einmal direkte Git-Einstellungen – der Hauptserver kann ihre Konfigurationen abrufen und in separaten Branches deines Repositories speichern.

Monitoring, CrowdSec und Sicherheit

Das Panel beschränkt sich nicht auf das Erstellen von Dateien. Es kann Live-Analysen sammeln und anzeigen.

Der Monitoring-Tab zeigt den Status aller Services, die Proxy-Version und aktive EntryPoints. Er zeigt auch Warnungen zu entdeckten Schwachstellen (CVEs), die deine spezifische Traefik-Version betreffen. Dies hilft dir, den Container rechtzeitig auf dem neuesten Stand zu halten.

Wenn CrowdSec auf dem Server läuft, verbindet sich das Panel mit dessen LAPI. Vom Browser aus kannst du die Liste der blockierten Adressen sehen, bestimmte IPs entsperren oder verdächtigen Datenverkehr zwangsweise durch ein Captcha leiten.

Was die Sicherheit des Panels selbst betrifft, ist alles gut durchdacht:

  • Autorisierung via bcrypt und TOTP-Zwei-Faktor-Authentifizierung.
  • OIDC-Unterstützung für die Anmeldung über ein unternehmensweites Einzelkonto.
  • Eingebauter Schutz gegen CSRF, Session-Angriffe und Rate-Limiting.
  • Tokens für die Mobile-App, die eine besondere Erwähnung verdient.

Der Entwickler hat auch einen mobilen Client für Android (React Native) veröffentlicht, der über API-Keys funktioniert. Von deinem Telefon aus ist es praktisch, schnell eine fehlerhafte Route zu deaktivieren oder den Service-Status unterwegs zu überprüfen.

Schnellstart

Du kannst das Panel buchstäblich mit einem Befehl über das offizielle Installationsskript oder mit einer standardmäßigen Compose-Datei starten.

Beispiel für eine minimale docker-compose.yml:

services:
  traefik-manager:
    image: ghcr.io/chr0nzz/traefik-manager:latest
    container_name: traefik-manager
    restart: unless-stopped
    ports:
      - "5000:5000"
    environment:
      - COOKIE_SECURE=false
    volumes:
      - /path/to/traefik/dynamic.yml:/app/config/dynamic.yml
      - /path/to/traefik-manager/config:/app/config
      - /path/to/traefik-manager/backups:/app/backups

Nach dem Ausführen von docker compose up -d navigierst du zu http://localhost:5000 und durchläufst einen kurzen Ersteinrichtungsassistenten.

Unter der Haube

Die Projektarchitektur ist einfach und zuverlässig. Das Backend ist in Python 3.11 und Flask mit einem Gunicorn-Server geschrieben. Das Frontend kam ohne schwere Frameworks aus: Plain JavaScript, Tailwind CSS für das Layout, Phosphor-Icons und der Monaco-Editor.

Alle JS- und CSS-Ressourcen sind direkt ins Docker-Image gebündelt, sodass das Panel eigenständig funktioniert und während des Betriebs keine Anfragen an externe CDNs stellt.

Zusammenfassung

Traefik Manager adressiert ein seit langem bestehendes Bedürfnis in der Community. Das Tool eignet sich für Home-Lab-Betreiber, kleine Teams und Systemadministratoren, die das manuelle Bearbeiten von YAML-Dateien leid sind.

Wenn dein Traefik mehr als fünf Services bedient oder du mehrere Nodes verwaltest, lohnt es sich definitiv, das Projekt zu testen. Die praktischen Middleware-Setup-Assistenten und das eingebaute Änderungsrollback sparen viel Zeit bei der Konfiguration deines Netzwerks.

Ähnliche Projekte