191 lines
5.2 KiB
Markdown
191 lines
5.2 KiB
Markdown
# Facebook Post Tracker
|
|
|
|
Eine Chrome/Firefox-Extension mit Docker-Backend zum Verwalten und Abhaken von Facebook-Beiträgen über mehrere Browser-Profile hinweg.
|
|
|
|
## Features
|
|
|
|
- ✅ **Browser-Extension**: Fügt jedem Facebook-Beitrag Tracking-Funktionalität hinzu
|
|
- 📊 **Multi-Profile-Support**: Verwalte 5 verschiedene Browser-Profile
|
|
- 🌐 **Web-Interface**: Übersicht über alle zu bearbeitenden Beiträge
|
|
- 🔄 **Auto-Check**: Beiträge werden automatisch beim Öffnen abgehakt
|
|
- 🐳 **Docker-Setup**: Einfaches Backend-Deployment
|
|
|
|
## Systemarchitektur
|
|
|
|
```
|
|
┌─────────────────┐
|
|
│ Browser │
|
|
│ Extension │◄─────┐
|
|
└────────┬────────┘ │
|
|
│ │
|
|
▼ │
|
|
┌─────────────────┐ │
|
|
│ Docker Backend │ │
|
|
│ (Node.js API) │ │
|
|
│ + SQLite DB │ │
|
|
└────────┬────────┘ │
|
|
│ │
|
|
▼ │
|
|
┌─────────────────┐ │
|
|
│ Web Interface │──────┘
|
|
└─────────────────┘
|
|
```
|
|
|
|
## Installation
|
|
|
|
### 1. Backend starten (Docker)
|
|
|
|
```bash
|
|
# In das Projektverzeichnis wechseln
|
|
cd /mnt/c/fb
|
|
|
|
# Docker Container bauen und starten
|
|
docker-compose up -d
|
|
|
|
# Logs ansehen (optional)
|
|
docker-compose logs -f
|
|
```
|
|
|
|
Das Backend läuft nun auf `http://localhost:3000`
|
|
Das Web-Interface ist erreichbar unter `http://localhost:8080`
|
|
|
|
### 2. Browser-Extension installieren
|
|
|
|
#### Chrome:
|
|
1. Öffne `chrome://extensions/`
|
|
2. Aktiviere "Entwicklermodus" (oben rechts)
|
|
3. Klicke auf "Entpackte Erweiterung laden"
|
|
4. Wähle den Ordner `/mnt/c/fb/extension`
|
|
|
|
#### Firefox:
|
|
1. Öffne `about:debugging#/runtime/this-firefox`
|
|
2. Klicke auf "Temporäres Add-on laden"
|
|
3. Wähle die Datei `/mnt/c/fb/extension/manifest.json`
|
|
|
|
### 3. Extension konfigurieren
|
|
|
|
1. Klicke auf das Extension-Icon 📋 in der Browser-Toolbar
|
|
2. Wähle dein aktuelles Profil (1-5) aus
|
|
3. Klicke auf "Speichern"
|
|
|
|
## Nutzung
|
|
|
|
### In der Browser-Extension (auf Facebook):
|
|
|
|
1. **Beitrag hinzufügen**: Bei jedem Facebook-Beitrag erscheint automatisch ein Tracking-UI
|
|
- Gib die Anzahl ein (1-5), wie viele Profile den Beitrag abhaken sollen
|
|
- Klicke auf "Hinzufügen"
|
|
- Der Beitrag wird automatisch für das aktuelle Profil abgehakt
|
|
|
|
2. **Beitrag abhaken**: Bei bereits getrackten Beiträgen
|
|
- Siehst du den Status: `X/Y Profile ✓/✗`
|
|
- Klicke auf "Abhaken", wenn noch nicht für dein Profil erledigt
|
|
|
|
### Im Web-Interface:
|
|
|
|
1. Öffne `http://localhost:8080`
|
|
2. Wähle dein aktuelles Profil aus
|
|
3. **Offene Beiträge**: Zeigt alle Beiträge, die noch nicht von allen Profilen abgehakt wurden
|
|
4. **Alle Beiträge**: Zeigt alle erfassten Beiträge
|
|
5. Klicke auf "Beitrag öffnen & abhaken", um:
|
|
- Den Beitrag in neuem Tab zu öffnen
|
|
- Automatisch für dein Profil abzuhaken
|
|
|
|
## API-Endpunkte
|
|
|
|
Das Backend stellt folgende REST-API bereit:
|
|
|
|
- `GET /api/posts` - Alle Beiträge abrufen
|
|
- `GET /api/posts/by-url?url=...` - Beitrag über URL abrufen
|
|
- `POST /api/posts` - Neuen Beitrag erstellen
|
|
- `POST /api/posts/:id/check` - Beitrag für Profil abhaken
|
|
- `POST /api/check-by-url` - Beitrag über URL abhaken
|
|
- `DELETE /api/posts/:id` - Beitrag löschen
|
|
|
|
## Datenbankstruktur
|
|
|
|
```sql
|
|
posts:
|
|
- id (TEXT, PRIMARY KEY)
|
|
- url (TEXT, UNIQUE)
|
|
- title (TEXT)
|
|
- target_count (INTEGER)
|
|
- created_at (DATETIME)
|
|
|
|
checks:
|
|
- id (INTEGER, PRIMARY KEY)
|
|
- post_id (TEXT, FOREIGN KEY)
|
|
- profile_number (INTEGER)
|
|
- checked_at (DATETIME)
|
|
- UNIQUE(post_id, profile_number)
|
|
```
|
|
|
|
## Docker-Befehle
|
|
|
|
```bash
|
|
# Container starten
|
|
docker-compose up -d
|
|
|
|
# Container stoppen
|
|
docker-compose down
|
|
|
|
# Logs ansehen
|
|
docker-compose logs -f
|
|
|
|
# Container neu bauen
|
|
docker-compose build
|
|
|
|
# Datenbank zurücksetzen (ACHTUNG: Löscht alle Daten!)
|
|
docker-compose down -v
|
|
```
|
|
|
|
## Entwicklung
|
|
|
|
### Backend lokal entwickeln (ohne Docker):
|
|
|
|
```bash
|
|
cd backend
|
|
npm install
|
|
npm run dev
|
|
```
|
|
|
|
### Extension während Entwicklung neu laden:
|
|
|
|
- **Chrome**: Gehe zu `chrome://extensions/` und klicke auf das Reload-Symbol
|
|
- **Firefox**: Gehe zu `about:debugging` und klicke auf "Neu laden"
|
|
|
|
## Troubleshooting
|
|
|
|
### Backend nicht erreichbar
|
|
|
|
- Prüfe, ob Docker läuft: `docker ps`
|
|
- Prüfe die Logs: `docker-compose logs backend`
|
|
- Stelle sicher, dass Port 3000 nicht bereits belegt ist
|
|
|
|
### Extension funktioniert nicht
|
|
|
|
- Öffne die Browser-Konsole (F12) und prüfe auf Fehler
|
|
- Stelle sicher, dass das Backend läuft
|
|
- Lade die Extension neu
|
|
- Prüfe, ob du auf Facebook.com bist
|
|
|
|
### CORS-Fehler
|
|
|
|
- Das Backend hat CORS aktiviert
|
|
- Stelle sicher, dass du `http://localhost:3000` verwendest (nicht `127.0.0.1`)
|
|
|
|
### Icons fehlen in Extension
|
|
|
|
- Die Extension verwendet Emoji-Icons als Fallback
|
|
- Für richtige Icons kannst du PNG-Dateien in den Größen 16x16, 48x48, 128x128 erstellen und in `extension/icons/` ablegen
|
|
|
|
## Technologie-Stack
|
|
|
|
- **Backend**: Node.js, Express, SQLite (better-sqlite3)
|
|
- **Web-Interface**: Vanilla JavaScript, HTML, CSS
|
|
- **Extension**: Manifest V3 (Chrome & Firefox kompatibel)
|
|
- **Deployment**: Docker, docker-compose
|
|
|
|
## Lizenz
|
|
|
|
MIT |