00:00:00Das ist Portless, ein CLI-Tool von Vercel Labs, demselben Team, das auch Agent Browser,
00:00:05JSON Render und Skills entwickelt hat. Es ersetzt localhost-Portnummern durch feste Namen,
00:00:10sodass Menschen und KI-Agenten immer am richtigen Ort landen und Konflikte vermieden werden.
00:00:15Aber wie funktioniert das eigentlich unter der Haube und bringt es mein System durcheinander?
00:00:20Abonniert den Kanal und lasst uns direkt loslegen.
00:00:21Schauen wir uns an einem einfachen Beispiel an, wie man Portless benutzt.
00:00:26Gerade läuft bei mir ein Projekt auf Port 3001.
00:00:30Wenn ich dieses Projekt im Hintergrund laufen hätte und es völlig vergessen würde,
00:00:33und dann ein anderes Projekt starten wollte, das einen ähnlichen Port nutzt,
00:00:37dann bekäme ich diese Fehlermeldung: “Address is already in use”.
00:00:40Genau für dieses Problem wurde Portless entwickelt.
00:00:44Stellt euch vor, ihr hättet verschiedene Agenten in unterschiedlichen Tabs für verschiedene Projekte laufen,
00:00:48und sie stießen auf dieses Problem.
00:00:50Sie könnten es natürlich beheben, aber es wäre besser, wenn immer ein Port verfügbar wäre,
00:00:55damit es erst gar nicht zu diesem Problem kommt.
00:00:58Wenn Portless installiert ist und der Portless-Proxy läuft,
00:01:01aber ihr könnt hier einen beliebigen Namen wählen.
00:01:06aber ihr könnt hier einen beliebigen Namen wählen.
00:01:08Dann folgt der Befehl, den ihr ausführen wollt, also “bun run devapi”.
00:01:12Wenn ich Enter drücke, wird eine zufällige freie Portnummer im 4000er-Bereich gesucht.
00:01:16Dieser Bereich wird eher selten von anderen Programmen belegt.
00:01:20Und meine App wird unter meinem Hostnamen auf .localhost:1355 bereitgestellt.
00:01:25Standardmäßig ist es 1355, was für “less” steht, weil es Portless ist. Versteht ihr?
00:01:30Wenn ich hier klicke, sieht man, dass die App einwandfrei funktioniert.
00:01:34Und wenn ich zu dieser anderen App gehe und genau dasselbe mache,
00:01:37wurde ein anderer freier Port gefunden, aber der Hostname wird verwendet.
00:01:40Die Nummer am Ende bleibt jedoch immer gleich.
00:01:42Tatsächlich könnten wir sie sogar ändern, wenn wir wollten.
00:01:44Wenn wir sie auf Port 80 ändern, könnten wir den Doppelpunkt und die Nummer ganz weglassen.
00:01:49Wenn ich also den Portless-Proxy auf Port 80 starte (mit sudo),
00:01:53und ebenfalls sudo verwende, um den Portless-Prozess zu starten,
00:01:55können wir einfach die Subdomain mit .localhost verwenden.
00:01:59Wir könnten zusätzlich zu Port 80 sogar HTTPS-Unterstützung erhalten,
00:02:03indem wir das HTTPS-Flag verwenden.
00:02:08Aber wenn ihr Vite nutzt, müsst ihr die Port-Variable im Port-Key setzen
00:02:13und den Host auf diesen Wert einstellen.
00:02:15Ich erkläre später im Video, warum das so ist.
00:02:17Es gibt noch viele andere Optionen bei Portless,
00:02:21wie zum Beispiel den Proxy zur Fehlersuche im Vordergrund laufen zu lassen,
00:02:25oder einen Befehl ohne Proxy auszuführen – ebenfalls zum Debuggen oder als Notlösung.
00:02:30Aber warum wird jedes Mal eine zufällige Portnummer verwendet?
00:02:33Und warum braucht es überhaupt einen Proxy? Schauen wir uns die Funktionsweise an.
00:02:35Wir gehen zwei Prozesse durch.
00:02:36Erstens: Was passiert, wenn der Hauptbefehl von Portless im Terminal ausgeführt wird?
00:02:39Und zweitens: Was passiert, wenn ein Browser eine Portless-URL aufruft?
00:02:42Wenn man hier einen Portless-Befehl ausführt, in diesem Fall
00:02:46werden zuerst der Host und der Befehl extrahiert.
00:02:49Portless my-app mit dem Befehl „bun start“,
00:02:52Als Nächstes wird geprüft, ob der Proxy läuft.
00:02:56Falls nicht, wird er gestartet.
00:02:59Es gibt jedoch eine Besonderheit, da man den Port für den Proxy selbst festlegen kann.
00:03:01Standardmäßig ist es 1355.
00:03:06Setzt man ihn jedoch auf einen Wert unter 1024,
00:03:08wird vor der Ausführung um eine Bestätigung gebeten.
00:03:12Liegt der Wert darüber, startet er automatisch.
00:03:15Danach wird ein freier Port zwischen 4000 und 4999 gesucht.
00:03:19Dieser Port wird zufällig gewählt, um den Suchvorgang zu beschleunigen.
00:03:25Wäre die Suche sequenziell, müssten alle Ports nacheinander geprüft werden,
00:03:29was bei vielen laufenden Prozessen lange dauern könnte.
00:03:33Sobald ein Port gefunden wurde, werden die Details in eine JSON-Datei im Root-Store geschrieben.
00:03:35Dann wird euer Befehl auf diesem Port ausgeführt und der Port zur Umgebungsvariable hinzugefügt,
00:03:40auf die die meisten JavaScript-Anwendungen zugreifen können.
00:03:47Konzentrieren wir uns nun auf diesen Teil.
00:03:50und wir beim Standard-Port bleiben, ist das 1355.
00:03:52Wenn ein Browser eine Portless-URL besucht, in diesem Fall „myapp“,
00:03:56Zuerst erfolgt die DNS-Auflösung, bevor eine TCP-Verbindung zum Proxy aufgebaut wird.
00:04:00und sucht damit in der Root-JSON-Datei nach dem Port eurer Anwendung.
00:04:06der einfach den Hostnamen extrahiert, also „myapp“,
00:04:09Sobald der richtige Port bekannt ist, leitet er die Anfrage an eure eigentliche App weiter.
00:04:15Die App sendet die Antwort zurück an den Proxy und dieser an den Browser,
00:04:21da der Browser eine Antwort von Port 1355 erwartet
00:04:26und nicht von der Nummer, die der Proxy in diesem Schritt zufällig zugewiesen hat.
00:04:30Das funktioniert praktischerweise auch mit WebSockets.
00:04:35Alles in allem sehr beeindruckend für ein Wochenendprojekt.
00:04:38Wenn ihr Portless jedoch für ein Projekt verwendet, das nicht auf Next.js basiert (wie Vite), gibt es Probleme.
00:04:40Da eine zufällige Portnummer zugewiesen wird und kein fest installierter Wert,
00:04:47müsst ihr sicherstellen, dass eure App über diesen Port laufen kann,
00:04:52damit der Proxy weiß, wohin der Datenverkehr umgeleitet werden soll.
00:04:56Bei Vite oder ähnlichen Bundlern müsst ihr eventuell diesen Host-Key auf diesen Wert setzen,
00:05:00da Anfragen von unbekannten Quellen sonst abgelehnt werden; dies deaktiviert die Prüfung.
00:05:06Ich habe versucht, den “allowed host”-Key mit verschiedenen Werten zu nutzen, aber ohne Erfolg.
00:05:10Auch wenn diese Lösung extrem scheint,
00:05:16muss man sich bei lokaler Ausführung keine Sorgen machen.
00:05:19Wie die meisten Projekte von Vercel Labs wird auch Portless ständig aktualisiert,
00:05:22sodass solche Details in Zukunft verbessert werden,
00:05:26ebenso wie die Unterstützung für Windows.
00:05:30Apropos Vercel Labs: Falls ihr Agent Browser noch nicht ausprobiert habt,
00:05:32die beste Methode für euren Agenten, mit einem Browser zu interagieren,
00:05:36erfahrt ihr alles darüber im nächsten Video.