1
Nginx Proxy Manager
hans edited this page 2026-06-26 09:46:51 +02:00

Nginx Proxy Manager

Warum NPM für den Token?

Eine Angular-App ist eine reine Client-Side-Anwendung. Alles in environment.prod.ts landet nach ng build als Klartext in den JS-Bundles — wer DevTools öffnet, sieht den Token.

Lösung: Der Angular-Build spricht nie direkt Directus an. NPM leitet /api-Requests weiter und injiziert den Token serverseitig.

Browser            NPM                    Directus
  │                 │                        │
  │  GET /api/...   │                        │
  │────────────────►│  GET /items/...        │
  │                 │  Authorization: Bearer  │
  │                 │────────────────────────►│
  │                 │         200 JSON        │
  │◄────────────────│◄───────────────────────│
  │  (kein Token    │
  │   sichtbar)

Proxy Host einrichten

Details-Tab

Domain Names:          home.neugasse.lan
Scheme:                http
Forward Hostname/IP:   10.0.0.x  (NAS-IP)
Forward Port:          9999
Cache Assets:          ✓
Block Common Exploits: ✓

Advanced-Tab — Custom Nginx Configuration

# Directus API — Items
location /api/items/landingpage {
    proxy_pass http://directus.neugasse.lan/items/landingpage;
    proxy_set_header Authorization "Bearer <DIRECTUS_TOKEN>";
    proxy_set_header Host directus.neugasse.lan;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

# Directus Assets — Bilder
location /api/assets/ {
    proxy_pass http://directus.neugasse.lan/assets/;
    proxy_set_header Authorization "Bearer <DIRECTUS_TOKEN>";
    proxy_set_header Host directus.neugasse.lan;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

<DIRECTUS_TOKEN> durch den echten Token ersetzen.

Token rotieren

Wenn der Token kompromittiert ist oder erneuert werden muss:

  1. Directus Admin-UI → SettingsAccess Tokens
  2. Alten Token löschen
  3. Neuen Token erstellen
  4. NPM → Proxy Host → Advanced → Token ersetzen → Save
  5. Testen:
curl http://home.neugasse.lan/api/items/landingpage | head -c 100
# Erwartet: JSON mit Items

Konfiguration testen

# Über NPM — Token wird injiziert
curl http://home.neugasse.lan/api/items/landingpage | python3 -m json.tool | head -20

# Direkt an Directus ohne Token — muss 403 zurückgeben
curl http://directus.neugasse.lan/items/landingpage
# {"errors":[{"message":"You don't have permission..."}]}

Wenn Schritt 1 200 und Schritt 2 403 liefert, ist der Proxy korrekt konfiguriert.