Ich hab Zoom rausgeschmissen und mir in zwei Tagen einen eigenen Videoraum gebaut.

Warum überhaupt

• Datenschutz: Du entscheidest, wer die Technik betreibt, und prüfst den Vertrag selbst. Es läuft nichts mit, was du nicht eingebaut hast.
• Eigener Look: Dein Name, deine Farben, deine Adresse im Link.
• Kein Konto für Gäste: Link öffnen, Namen eintippen, fertig. Auch auf dem Handy.

Für ein Gespräch mit einer Person oder einer kleinen Runde reicht das. Wenn du Aufzeichnung, Webinare mit hundert Leuten oder Kalenderintegration brauchst, nimm ein fertiges Produkt.

Die Bausteine

Der Schlüssel im Link

So wird er berechnet. Das geheime Wort liegt nur in einer Umgebungsvariable auf dem Server, nie im Code und nie im Link.

import { createHmac } from 'node:crypto';

const key = createHmac('sha256', process.env.RAUM_SECRET)
  .update('raum:' + slug)
  .digest('base64url')
  .slice(0, 22);

Der Server rechnet bei jedem Besuch nach und vergleicht. Stimmt der Schlüssel nicht, gibt es kein Token.

Das Wartezimmer

Du brauchst dafür keine eigene Warteschlange. LiveKit kennt Teilnehmerrechte: Wer ohne Recht zum Senden und Empfangen eintritt, sieht und hört nichts. Du als Gastgeber siehst, wer wartet, und hebst die Rechte per Knopfdruck an. Lädt ein Gast die Seite neu, muss er erneut eingelassen werden. Das ist gewollt.

Was es kostet

Stand 17.10.2026 nennt die Preisseite von LiveKit für den kostenlosen Tarif 5.000 Teilnehmer-Minuten und 50 GB Datenübertragung im Monat. Zwei Personen, eine Stunde, sind 120 Teilnehmer-Minuten. Für ein paar Gespräche im Monat reicht das kostenlose Kontingent also. Dein Hosting für die Next.js-Seite hast du vermutlich schon.

Prüf vor dem Start selbst, was dein Tarif zusichert: Region, Auftragsverarbeitungsvertrag und Grenzen ändern sich. Preise und Tarife siehst du auf livekit.com/pricing.

Zwei Fehler, die ich gemacht habe

1. Zwei Tabs, ein Host, Echo

Zum Testen habe ich den Raum zweimal auf demselben Rechner geöffnet, beide Male als Gastgeber. Mikro und Lautsprecher hören sich dann gegenseitig: Rückkopplung. Teste mit einem zweiten Gerät, etwa dem Handy, oder mit Kopfhörern und stummgeschaltetem zweitem Tab.

2. Der alte Endpunkt hatte ein Loch

Ich hatte schon einen Token-Endpunkt für meinen Sprachassistenten. Er ist öffentlich und gibt auf Wunsch volle Rechte für jeden Raumnamen aus. Hätte jemand dort den Namen eines Besprechungsraums angegeben, wäre er ohne Schlüssel und ohne Wartezimmer drin gewesen. Aufgefallen ist mir das vor dem Start. Die Lösung sind drei Zeilen: Der alte Endpunkt lehnt jeden Raumnamen mit dem Präfix der neuen Räume ab. Wenn du einen zweiten Zweck auf demselben LiveKit-Konto baust, prüf als Erstes, was die alten Endpunkte alles ausstellen.

In welcher Reihenfolge

1. 1LiveKit-Konto anlegen, URL, API-Key und Secret in Umgebungsvariablen legen (nie in den Code).
2. 2Token-Endpunkt bauen und mit zwei Geräten testen, ohne Schlüssel und Wartezimmer.
3. 3Seite mit PreJoin und VideoConference bauen.
4. 4Schlüssel im Link ergänzen, dann das Wartezimmer.
5. 5Alte Token-Endpunkte auf Lücken prüfen, Seite auf noindex stellen.

Zum Kopieren

Die Dokumentation und die React-Bausteine von LiveKit:

https://docs.livekit.io/

https://github.com/livekit/components-js

Die Pakete, die ich benutze:

npm install livekit-server-sdk livekit-client @livekit/components-react @livekit/components-styles

Und ein Prompt, mit dem du Claude Code die erste Fassung bauen lässt:

Baue mir einen eigenen Videoraum in diesem Next.js-Projekt (App Router).
- Seite /raum/[slug]: LiveKit PreJoin (Name, Kamera, Mikro) und danach VideoConference.
- Route /api/raum/token: erzeugt ein LiveKit-Token (livekit-server-sdk), 2 Stunden gültig.
- Zugang nur mit Schlüssel im Link: key = HMAC-SHA256(RAUM_SECRET, "raum:" + slug), gekürzt, Vergleich mit timingSafeEqual.
- Wartezimmer: Gäste bekommen ein Token ohne Senden und Empfangen. Ich als Gastgeber sehe "X wartet" und lasse per Server Action ein (RoomServiceClient.updateParticipant).
- Die Seite ist noindex, ohne Tracking, Secrets nur in Umgebungsvariablen.
- Sperre bestehende Token-Routen für Raumnamen mit Präfix "raum-".
Erkläre mir am Ende, welche Umgebungsvariablen ich setzen muss.