Files
d4rk_media/README.md
T
D4rkst3randClaude Opus 5 7b35ef5698 feat: Betrachter fuer Lesbares, und aus dem <video> wird ein Player
Bild, Video, Ton und PDF konnte der Betrachter schon. Was fehlte, war
ausgerechnet die Art, die man am ehesten nur lesen und nicht herunterladen
will: eine .md landete im Zweig "laesst sich hier nicht anzeigen".

LESBARES. Markdown gesetzt, .lua und .json eingefaerbt, CSV als Tabelle, alles
Uebrige mit Zeilennummern. Der Tokenizer ist DERSELBE wie fuer die Schnipsel
auf der API-Seite und nicht ein zweiter -- zwei waeren zwei, die auseinander
laufen. Die Zeilennummern liegen in einer eigenen Spalte: so nimmt ein
Markieren mit der Maus sie nicht mit.

Die CSV-Zerlegung kann Anfuehrungszeichen und doppelte darin. Das ist der Teil,
den ein split(';') falsch macht, und CSV aus Excel hat ihn regelmaessig; das
Trennzeichen wird aus der Kopfzeile geraten.

NICHT ALLES WIRD GEHOLT. Die Groesse steht in der Datenbank, also wissen wir
vorher, worauf wir uns einlassen: ueber 512 KB kommt per Bereichsanfrage nur
der Anfang, und das steht auch da. Ein Betrachter, der bei einem 400-MB-
Protokoll den Tab abschiesst, ist schlimmer als einer, der die Datei gar nicht
erst oeffnet. Gemessen: Range: bytes=0-49 -> 206, 50 Bytes.

MARKDOWN OHNE BIBLIOTHEK, und das ist kein Geiz. Der uebliche Weg heisst marked
plus DOMPurify und endet bei dangerouslySetInnerHTML -- damit haengt die
Sicherheit dieser Seite an der Frage, ob die Filterliste vollstaendig ist. Hier
entsteht NIE eine HTML-Zeichenkette: der Text wird zu React-Knoten, und ein
<script> in einer hochgeladenen .md erscheint als die acht Zeichen, die es ist.
Im ganzen ui/ steht kein einziges dangerouslySetInnerHTML.

Die eine Luecke, die React nicht schliesst, ist href: [klick](javascript:...)
kaeme durch. Zwoelf Faelle in Node durchgeprueft, alle bestanden -- http,
https, mailto und relative Ziele durch; javascript:, JavaScript:, mit
Leerzeichen davor, data:, vbscript:, file: abgelehnt und als Text stehen
gelassen.

DER PLAYER. Die Bedienelemente bleiben die des Browsers: ein selbstgebauter
Schieber sieht in jedem Browser anders falsch aus, kennt keine
Tastatursteuerung und keine Untertitel. Drumherum kam, was der Browser nicht
mitbringt.

Lautstaerke ueber Dateien hinweg -- <video> setzt sie bei jedem neuen Element
auf 1 zurueck, und wer sich durch zwanzig Clips klickt, stellt sie sonst
zwanzigmal leise, waehrend der einundzwanzigste ungefragt wieder hochfaehrt.

Weiter zum naechsten Stueck, abschaltbar, und nur wenn das Naechste auch etwas
zum Abspielen ist: nach einem Lied ungefragt bei einem Bild zu landen waere
schlechter als stehenzubleiben.

Tastatur an EINER Stelle: Leertaste haelt an, Pfeile springen fuenf Sekunden,
Umschalt+Pfeil wechselt die Datei. Bei allem anderen blaettern die Pfeile wie
bisher. Dass das so ist, steht als Zeile unter dem Bild -- eine unsichtbare
Sonderregel fuehlt sich an wie ein Fehler.

SERVER. Die Typtabelle kennt jetzt md, markdown, csv, lua, xml, yml, yaml,
toml, ini, cfg, sql und log -- alle als text/plain. Nicht als text/markdown
(braechte nichts) und erst recht nicht als text/html: wer einen Upload-Token
hat, koennte damit eine Seite unter unserem Namen veroeffentlichen. html, css
und js stehen deshalb weiterhin NICHT drin.

Der Betrachter entscheidet trotzdem nach der Endung und erst danach nach der
gemeldeten Art. Grund steht in der Datenbank: items/readme.md lag schon da und
trug application/octet-stream, weil sie vor der erweiterten Tabelle hochgeladen
wurde. Wer nur auf die Art schaut, zeigt die alte README nicht an und eine neue
schon -- und sucht den Unterschied an der falschen Stelle.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-11 21:58:10 +02:00

8.5 KiB

d4rk_media

Eigener Medien-Dienst für alle FiveM-Ressourcen: Dateien annehmen, ablegen, ausliefern, in einem Dashboard verwalten. Ein Container, SQLite, Dateien auf einer Platte.

Läuft unter https://fivemanage.d4rkst3r.de — Dashboard und API an der Wurzel, Dateien unter /f/.

vehicles/adder.webp   →   https://fivemanage.d4rkst3r.de/f/vehicles/adder.webp

Der Pfad ist der Schlüssel. vehicles/adder.webp bleibt vehicles/adder.webp, damit die Vorlage in einem Skript schlicht {model}.webp lauten kann. Die Adressen stehen nirgends in der Datenbank — sie werden bei jeder Antwort aus PUBLIC_URL gebaut. Ein Umzug auf einen anderen Namen ist eine geänderte Variable, kein Datenbankeingriff.

Anleitung für Skripte Wiki — Quelle ist docs/
Stand und Reihenfolge ROADMAP.md
Arbeitsweise CLAUDE.md — prüfen statt raten

Starten

cp .env.example .env      # PUBLIC_URL und ADMIN_PASSWORD ausfüllen
docker compose up -d --build

Das war es. Ein Container, ein Volume, kein zweiter Dienst.

In Portainer: Stacks → Add stack → Repository, Compose path: docker-compose.yml. Die Werte kommen als Stack-Variablen.

Compose path nimmt genau EINE Datei. Ergänzungen werden stillschweigend übergangen — alle Container gesund, alles 502. Das hat beim Vorgänger einen Nachmittag gekostet.

An der Oberfläche arbeiten

npm --prefix server/ui install
npm --prefix server/ui run dev

Läuft auf localhost:5173 und leitet /api und /f an den Container weiter. Dass das Sitzungs-Cookie dabei ankommt, liegt an einer Ausnahme: es trägt Secure, und ein Browser nimmt so eines über http nur auf localhost an.


Was der Dienst kann

Hochladen — über die Skript-API mit Token (drei Rumpfformen: multipart, Base64, rohe Bytes) oder aus dem Dashboard per Ziehen und Ablegen. Bilder, Videos, Ton, PDF. Ein ZIP wird ausgepackt statt abgelegt, und die Ordner darin bleiben erhalten — 3670 Bilder einzeln ins Fenster zu ziehen ist keine Bedienung.

Ausliefern — mit ETag, 304, Bereichsanfragen und nosniff. Vorschaubilder werden beim Upload erzeugt (320 px WebP): aus 7,5 MB je Galerieseite werden 766 KB.

Sparen, ohne Adressen zu ändern — neben jedem PNG und JPEG liegt eine WebP-Fassung, ausgeliefert unter derselben Adresse je nach Accept des Aufrufers. Nachgemessen über den ganzen Bestand: 199 MB → 33 MB, das sind 83 %. Für Lua ändert sich nichts — es schickt kein Accept: image/webp und bekommt weiterhin das Original.

Zurückholen — Gelöschtes liegt 30 Tage im Papierkorb, danach räumt der Dienst selbst auf. Die Datei ist dann nur nicht mehr öffentlich, nicht weg.

Zählen — wie oft eine Datei geholt wurde und wann zuletzt. Beantwortet die Frage, die ein Aufbewahrungsbericht sonst nicht beantworten kann: braucht das noch jemand?

Verwalten — Galerie mit Ordnerbaum, Suche, Filter nach Medienart, Sortierung, Mehrfachauswahl, Verschieben, Löschen.

Ansehen ohne neuen Tab — Bild, Video, Ton, PDF und alles Lesbare: Markdown wird gesetzt, .lua und .json eingefärbt, CSV als Tabelle, alles andere mit Zeilennummern. Video und Ton mit gemerkter Lautstärke und „weiter zum nächsten Stück"; Leertaste hält an, die Pfeile springen fünf Sekunden, mit Umschalt wechseln sie die Datei.

Markdown wird ohne Bibliothek dargestellt, und das ist kein Geiz: der übliche Weg endet bei dangerouslySetInnerHTML, und die Sicherheit hängt dann an einer Filterliste. Hier entsteht nie eine HTML-Zeichenkette — der Text wird zu React-Knoten, ein <script> in einer hochgeladenen .md erscheint als die acht Zeichen, die es ist.

Nachvollziehen — ein Verlauf: wer hat wann was abgelegt, ersetzt, verschoben oder gelöscht.

Anmelden — über Discord (eine Rolle auf dem Server genügt) oder mit Passwort. Das Passwort bleibt als Notausgang.

Sichern — täglich, geprüft, in die Nextcloud. Und der Dienst meldet nach Discord, wenn die Sicherung ausbleibt.


Die eine Regel

Jeder Knopf gibt Rückmeldung, auch der erfolgreiche.

Das ist der Fehler, an dem der Fivemanage-Anlauf gescheitert ist: dessen http-util.ts warf jeden Fehlschlag als new Error(…), die Hooks prüften auf instanceof ApiError — und damit verschwand jeder Fehler lautlos. Create organization gab weder Erfolg noch Misserfolg zurück; das Ergebnis waren neunzehn gleichnamige Organisationen.

Deshalb hier:

  • In server/ui/src/api.ts steht der einzige fetch und genau eine Fehlerklasse.
  • In store.ts steht run(): Aktion rein, Erfolgstext rein — es meldet bei Erfolg diesen und bei Fehlschlag den Text des Dienstes. Wer darüber geht, kann keinen stillen Knopf bauen.
  • Jeder wartende Knopf ist gesperrt und zeigt einen Kreisel.
  • Fehlermeldungen bleiben stehen, bis jemand sie wegklickt.
  • Der Dienst hat eine Auffanglinie (app.onError): auch ein unerwarteter Fehler bekommt einen Satz statt eines nackten Internal Server Error.

Betrieb

Sicherung

tools/sichern.ps1, täglich 04:30 als geplante Aufgabe.

Die Datenbank wird nicht kopiert, sondern über SQLites eigene Sicherungsschnittstelle herausgeholt — im WAL-Modus liegt das Zuletzte noch nicht in media.db. Die Bilder kommen aus einem nur lesend eingehängten Volume dazu, alles in ein tar.gz.

Und sie prüft sich selbst: auspacken, Datenbank öffnen, Medien, Token und Benutzer zählen, mit dem laufenden Dienst vergleichen. Danach geht sie per WebDAV in die Nextcloud und wird von dort zurückgeholt und die Prüfsumme verglichen — ein PUT, der 201 sagt, hat nichts bewiesen.

Zugangsdaten und Aufbewahrung stehen im Panel unter Einstellungen.

Wiki

pwsh -File tools\wiki.ps1

Trägt docs/*.md ins Gitea-Wiki. Einseitigdocs/ ist die Quelle, das Wiki die Kopie. Wer dort tippt, verliert es beim nächsten Lauf.

Zurückspielen

tar xzf d4rk_media-JJJJ-MM-TT-HHMM.tar.gz

Ergibt media.db und files/. Beides ins Volume legen, während der Container steht. Vorschaubilder und WebP-Fassungen sind nicht im Archiv — beides ist abgeleitet und wird mit zwei Knöpfen unter Speicher → Wartung neu gerechnet. Der Papierkorb ist ebenfalls nicht drin: was dort liegt, ist gelöscht.


Was hier bewusst fehlt

Logging. Genau dafür schleppt Fivemanage ClickHouse mit, und genau da ist der Wartungsaufwand echt. Der Verlauf im Dashboard beantwortet „wer war das" — mehr braucht es hier nicht.

Mandanten, Rollen, Teams. Ein Dienst, den eine Person betreibt.

Automatisches Löschen. Vorbereitet ist der Bericht davor: wie viel ist älter als 7/30/90/365 Tage, was liegt doppelt. Eine Regel zu bauen, bevor man weiß, was da liegt, ist der Weg, wie man Daten verliert.

Spielerportal. Setzt voraus, dass Spieler hochladen. Der richtige Weg wäre dann presigned URLs — kurzlebige signierte Adressen, mit denen ein Client hochlädt, ohne je einen Token zu sehen.


Zwei Dinge, die Zeit gekostet haben

Der Proxy hielt Bilder fest. NPMs assets.conf greift über eine Regex auf jede URL, die auf .webp, .png, .js, .css endet, legt die Antwort 30 Minuten weg und ignoriert dabei unsere Kopfzeilen. Ein überschriebenes Bild blieb damit eine halbe Stunde alt — und /api/exists/…webp wurde zwischengespeichert und danach auch ohne Token ausgeliefert.

Behoben mit drei Blöcken in der Custom Nginx Configuration des Proxy-Hosts:

location ^~ /api/ { proxy_cache off; include conf.d/include/proxy.conf; }
location ^~ /f/   { proxy_cache off; include conf.d/include/proxy.conf; }
location ^~ /t/   { proxy_cache off; include conf.d/include/proxy.conf; }

Das ^~ ist der ganze Trick: eine gewöhnliche Präfix-Regel verliert gegen die Regex. In einem Wegwerf-Nginx nachgemessen.

Node 22 ist festgenagelt. better-sqlite3 11.10.0 liefert fertige Binärdateien für ABI 115 (Node 20) und 127 (Node 22) — Node 24 hat ABI 137 und fehlt. Der Griff zur neuesten Version fällt auf node-gyp zurück und braucht python3, make und g++ im Abbild.


Herkunft

Der Vorgänger war Fivemanage Lite mit PostgreSQL, MinIO und ClickHouse. Der Stack lief; woran er gescheitert ist, steht oben unter Die eine Regel und ausführlich in ROADMAP.md. Von dem, was er über eine Dateiablage hinaus kann, haben wir nichts gebraucht und alles mitgeschleppt.

Seine Compose-Dateien liegen in legacy/, als Beleg und wegen der Kommentare — nichts davon wird noch gestartet.