From 7cb264820e8d07c12000f175141ff21276d1b2cf Mon Sep 17 00:00:00 2001 From: "matthias.lotz" Date: Sun, 16 Nov 2025 18:25:32 +0100 Subject: [PATCH] docs: Correct migration guide - ALL routes changed, not just admin MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Critical corrections to frontend/MIGRATION-GUIDE.md: - Emphasize ALL API routes now have consistent /api prefix - Old routes had inconsistent prefixes (some with /api, some without) - List specific files with wrong routes that need fixing: * ModerationGroupsPage.js: /groups/* → /api/admin/groups/* * ModerationGroupImagesPage.js: /moderation/groups/* → /api/admin/groups/* * PublicGroupImagesPage.js: /groups/* → /api/groups/* - Add 3-phase checklist: Route Prefixes → Authentication → Testing - Provide grep commands to find ALL fetch/axios calls - Make clear this affects the entire frontend, not just admin features Migration effort estimate increased: 3-4 hours (route audit + auth) --- frontend/MIGRATION-GUIDE.md | 145 +++++++++++++++++++++++++++++++----- 1 file changed, 125 insertions(+), 20 deletions(-) diff --git a/frontend/MIGRATION-GUIDE.md b/frontend/MIGRATION-GUIDE.md index 68cd96b..1e1f6ca 100644 --- a/frontend/MIGRATION-GUIDE.md +++ b/frontend/MIGRATION-GUIDE.md @@ -1,16 +1,61 @@ -# Frontend Migration Guide - Admin API Authentication +# Frontend Migration Guide - API Umstrukturierung **Datum:** 16. November 2025 -**Betrifft:** Alle Admin-API-Aufrufe im Frontend -**Status:** ⚠️ Aktion erforderlich +**Betrifft:** ALLE API-Aufrufe im Frontend +**Status:** ⚠️ Aktion erforderlich - ALLE Routen prüfen! --- -## 🔒 Was hat sich geändert? +## � BREAKING CHANGE: Konsistente `/api` Prefixes -Alle Admin-Endpoints (`/api/admin/*`) benötigen jetzt **Bearer Token Authentication**. +**ALLE API-Routen haben sich geändert!** -### Betroffene Endpoints +### Vorher (inkonsistent): +```javascript +// Teils mit /api +fetch('/api/upload/batch') +fetch('/api/manage/xyz') + +// Teils OHNE /api - FALSCH! +fetch('/groups/123') +fetch('/groups/123/approve') +fetch('/moderation/groups/123') +``` + +### Jetzt (konsistent): +```javascript +// ALLE Routen mit /api Prefix +fetch('/api/upload/batch') +fetch('/api/manage/xyz') +fetch('/api/groups/123') // Public +fetch('/api/admin/groups/123/approve') // Admin +fetch('/api/admin/groups/123') // Admin +``` + +--- + +## 🔒 Admin API Authentication + +Alle Admin-Endpoints (`/api/admin/*` und `/api/system/*`) benötigen jetzt **Bearer Token Authentication**. + +### Route-Hierarchie + +1. **Public API**: `/api/*` + - Öffentlich zugänglich + - `/api/upload`, `/api/groups`, `/api/download`, etc. + +2. **Management API**: `/api/manage/*` + - Token-basiert (UUID aus Upload-Response) + - Für Gruppenbesitzer + +3. **Admin API**: `/api/admin/*` ⚠️ **BEARER TOKEN ERFORDERLICH** + - Moderation, Logs, Consents + - `/api/admin/groups`, `/api/admin/deletion-log`, etc. + +4. **System API**: `/api/system/migration/*` ⚠️ **BEARER TOKEN ERFORDERLICH** + - Wartungsfunktionen + +### Betroffene Admin-Endpoints - `/api/admin/groups` - Gruppen auflisten - `/api/admin/groups/:id` - Gruppe abrufen @@ -34,7 +79,31 @@ Alle Admin-Endpoints (`/api/admin/*`) benötigen jetzt **Bearer Token Authentica ## 📝 Erforderliche Änderungen -### 1. Environment Variable hinzufügen +### 1. ALLE API-Routen prüfen und `/api` hinzufügen + +**Schritt 1**: Finde alle API-Aufrufe im Frontend: + +```bash +# Alle fetch/axios Aufrufe finden +grep -r "fetch\(" frontend/src/ +grep -r "axios\." frontend/src/ +``` + +**Schritt 2**: Prüfe jede Route und füge `/api` Prefix hinzu (falls fehlend): + +```javascript +// ❌ FALSCH (alte Routen) +fetch('/groups/123') +fetch('/groups/123/approve') +fetch('/moderation/groups/123') + +// ✅ RICHTIG (neue Routen) +fetch('/api/groups/123') // Public +fetch('/api/admin/groups/123/approve') // Admin (+ Bearer Token!) +fetch('/api/admin/groups/123') // Admin (+ Bearer Token!) +``` + +### 2. Environment Variable für Admin Token hinzufügen ```bash # frontend/.env oder frontend/.env.local @@ -52,7 +121,7 @@ node -e "console.log(require('crypto').randomBytes(32).toString('hex'))" **⚠️ Wichtig**: Gleiches Token in Backend `.env` als `ADMIN_API_KEY` eintragen! -### 2. API-Aufrufe anpassen +### 3. API-Aufrufe für Admin-Endpoints anpassen #### Vorher (ohne Auth): ```javascript @@ -133,36 +202,72 @@ try { ## 🔍 Betroffene Dateien finden -Such nach allen Admin-API-Aufrufen: +### Alle API-Calls prüfen (KRITISCH!) ```bash cd frontend/src -# Alle Admin-API-Calls finden: -grep -r "/api/admin" --include="*.js" --include="*.jsx" +# ALLE API-Calls finden (fetch + axios): +grep -rn "fetch(" --include="*.js" --include="*.jsx" +grep -rn "axios\." --include="*.js" --include="*.jsx" -# Alle Fetch-Calls in spezifischen Komponenten: -grep -r "fetch.*admin" Components/Pages/ +# Spezifisch nach alten Routen OHNE /api suchen: +grep -rn "fetch('/groups" --include="*.js" +grep -rn "fetch('/moderation" --include="*.js" + +# Admin-API-Calls finden: +grep -rn "/api/admin" --include="*.js" --include="*.jsx" ``` -**Wahrscheinlich betroffene Komponenten:** +**Bekannte betroffene Dateien:** + +### Routen ohne `/api` Prefix (MÜSSEN GEFIXT WERDEN): - `Components/Pages/ModerationGroupsPage.js` + - ❌ `/groups/${groupId}/approve` → ✅ `/api/admin/groups/${groupId}/approve` + - ❌ `/groups/${groupId}` (DELETE) → ✅ `/api/admin/groups/${groupId}` + - ❌ `/api/social-media/platforms` → ✅ `/api/admin/social-media/platforms` + - `Components/Pages/ModerationGroupImagesPage.js` -- `Components/ComponentUtils/ConsentManager.js` (wenn im moderate-Modus) -- `services/reorderService.js` (Admin-Reorder) -- Jede andere Komponente, die Admin-Funktionen aufruft + - ❌ `/moderation/groups/${groupId}` → ✅ `/api/admin/groups/${groupId}` + +- `Components/Pages/PublicGroupImagesPage.js` + - ❌ `/groups/${groupId}` → ✅ `/api/groups/${groupId}` + +### Admin-Endpoints (benötigen Bearer Token): +- `Components/Pages/ModerationGroupsPage.js` - Alle Admin-Calls +- `Components/Pages/ModerationGroupImagesPage.js` - Gruppe laden + Bilder löschen +- `Components/ComponentUtils/DeletionLogSection.js` - Deletion Log +- `Components/ComponentUtils/ConsentManager.js` - Consent Export (wenn Admin) +- `services/reorderService.js` - Admin-Reorder (wenn vorhanden) + +### Public/Management Endpoints (nur Pfad prüfen): +- `Utils/batchUpload.js` - Bereits korrekt (`/api/...`) +- `Components/Pages/ManagementPortalPage.js` - Bereits korrekt (`/api/manage/...`) +- `Utils/sendRequest.js` - Bereits korrekt (axios) --- ## ✅ Checkliste +### Phase 1: Route-Prefixes (ALLE Dateien) +- [ ] Alle `fetch()` und `axios` Calls gefunden (grep) +- [ ] Alle Routen ohne `/api` Prefix identifiziert +- [ ] `/api` Prefix zu Public-Routen hinzugefügt (`/api/groups`, `/api/upload`) +- [ ] Admin-Routen auf `/api/admin/*` geändert +- [ ] Management-Routen auf `/api/manage/*` geprüft (sollten schon korrekt sein) + +### Phase 2: Admin Authentication - [ ] `REACT_APP_ADMIN_API_KEY` in `.env` hinzugefügt - [ ] Token im Backend als `ADMIN_API_KEY` konfiguriert - [ ] Zentrale `adminFetch` Funktion erstellt -- [ ] Alle Admin-API-Calls gefunden (grep) -- [ ] Authorization Header zu allen Admin-Calls hinzugefügt +- [ ] Authorization Header zu ALLEN `/api/admin/*` Calls hinzugefügt +- [ ] Authorization Header zu `/api/system/*` Calls hinzugefügt (falls vorhanden) - [ ] 403 Error Handling implementiert -- [ ] Frontend lokal getestet + +### Phase 3: Testing & Deployment +- [ ] Frontend lokal getestet (alle Routen) +- [ ] Admin-Funktionen getestet (Approve, Delete, etc.) +- [ ] Public-Routen getestet (Gruppe laden, Upload) - [ ] Production `.env` aktualisiert ---