From b65e6cc7919e2f506adec8f2918a5d4a2208ca34 Mon Sep 17 00:00:00 2001 From: Benoit Date: Fri, 19 Jun 2026 13:12:06 +0200 Subject: [PATCH] =?UTF-8?q?chore:=20suppression=20fichiers=20r=C3=A9cap=20?= =?UTF-8?q?interdits=20par=20CLAUDE.md?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Supprimés : - ELECTRON_SUMMARY.md - SSL-SOLUTION.md - QUICKSTART-SSL.md (non commité) Respect de la règle : pas de fichiers récapitulatifs markdown --- ELECTRON_SUMMARY.md | 322 -------------------------------------------- SSL-SOLUTION.md | 295 ---------------------------------------- 2 files changed, 617 deletions(-) delete mode 100644 ELECTRON_SUMMARY.md delete mode 100644 SSL-SOLUTION.md diff --git a/ELECTRON_SUMMARY.md b/ELECTRON_SUMMARY.md deleted file mode 100644 index 4bf924e..0000000 --- a/ELECTRON_SUMMARY.md +++ /dev/null @@ -1,322 +0,0 @@ -# 📋 Résumé - Application Desktop PTT Live - -## ✅ Ce qui a été créé - -### Structure Complète - -``` -electron/ -├── package.json # Config Electron + electron-builder -├── main.js # Main Process (333 lignes) -├── preload.js # IPC bridge sécurisé (31 lignes) -├── .gitignore # Git exclusions -│ -├── ui/ # Interface frontend -│ ├── index.html # Structure UI (187 lignes) -│ ├── styles.css # Dark theme (556 lignes) -│ ├── app.js # Logic frontend (626 lignes) -│ └── qrcode.min.js # Placeholder QR Code -│ -└── Documentation - ├── README.md # Doc technique complète - ├── QUICKSTART.md # Guide démarrage rapide - └── CHANGELOG.md # Historique v0.3.0 -``` - -**Total : 1733 lignes de code** (hors node_modules) - ---- - -## 🎯 Fonctionnalités Implémentées - -### ✅ Core - -- [x] Main Process spawn serveur Node.js automatiquement -- [x] IPC sécurisé (contextBridge + preload.js) -- [x] Démarrage/arrêt serveur avec feedback visuel -- [x] Détection statut serveur (polling) -- [x] Gestion logs temps réel (Main → Renderer) - -### ✅ Dashboard - -- [x] Stats temps réel (uptime, utilisateurs, connexions, groupes) -- [x] Liste utilisateurs connectés avec détails -- [x] Génération QR Code automatique (détection IP réseau) -- [x] Bouton copier URL clients -- [x] Polling automatique toutes les 2 secondes - -### ✅ Configuration Audio - -- [x] Auto-détection devices (input/output) -- [x] Sélection depuis dropdown -- [x] Sample rate configurable (44.1/48/96 kHz) -- [x] Bitrate par défaut (32-320 kbps) -- [x] Jitter buffer (20-100 ms) -- [x] Sauvegarde dans config.yaml via API - -### ✅ Gestion Groupes - -- [x] Liste groupes existants -- [x] Création nouveau groupe (nom + bitrate) -- [x] Affichage infos groupe (ID, bitrate) -- [x] API admin `/admin/groups` CRUD - -### ✅ Monitoring - -- [x] Logs serveur en temps réel -- [x] Buffer 500 logs max en mémoire -- [x] Filtrage par niveau (error/warn/info/debug) -- [x] Bouton effacer logs -- [x] Format : timestamp + niveau + message - -### ✅ Notifications - -- [x] Toast visuelles (4 types : success/error/warning/info) -- [x] Auto-dismiss après 5 secondes -- [x] Bouton fermeture manuelle -- [x] Animation slide-in/out -- [x] Icônes par type (✅❌⚠️ℹ️) - -### ✅ Packaging - -- [x] electron-builder configuré -- [x] Build macOS (.dmg + .app) -- [x] Build Linux (.deb + .AppImage) -- [x] Scripts npm : `build:mac` / `build:linux` - ---- - -## 🚧 À Implémenter (TODO) - -### Priorité Haute - -- [ ] **WebSocket audio levels** : `/audio-levels` pour VU-mètres temps réel -- [ ] **Icônes** : icon.icns (macOS) + icon.png (Linux) + tray-icon.png -- [ ] **Tray icon** : menu contextuel (start/stop/open/quit) - -### Priorité Moyenne - -- [ ] **Graphiques monitoring** : Chart.js pour latence/bande passante -- [ ] **Export logs** : bouton télécharger CSV/JSON -- [ ] **Matrice routing** : interface graphique drag & drop -- [ ] **Notifications desktop** : Electron Notification API - -### Priorité Basse - -- [ ] **Auth admin** : mot de passe pour accès dashboard -- [ ] **Thème toggle** : dark/light mode -- [ ] **Auto-update** : electron-updater -- [ ] **I18n** : français/anglais -- [ ] **Tests** : Spectron ou Playwright - ---- - -## 📦 API Admin Utilisées - -L'application consomme toutes les routes existantes : - -| Endpoint | Usage | Statut | -|----------|-------|--------| -| `/admin/stats` | Dashboard metrics | ✅ | -| `/admin/users` | Liste utilisateurs | ✅ | -| `/admin/groups` | Liste groupes | ✅ | -| `POST /admin/groups` | Créer groupe | ✅ | -| `/admin/config` | Config complète | ✅ | -| `PUT /admin/config/audio` | Config audio | ✅ | -| `/admin/devices/list` | Auto-détection devices | ✅ | -| `POST /admin/audio/device` | Sélectionner device | ✅ | -| `/health` | Health check | ✅ | -| `WS /audio-levels` | VU-mètres (WebSocket) | 🚧 | - ---- - -## 🚀 Lancement - -```bash -# Depuis la racine du projet -./start-desktop.sh - -# OU depuis electron/ -cd electron -npm start - -# Mode développement (avec DevTools) -npm run dev -``` - ---- - -## 🏗️ Build Distribution - -```bash -cd electron - -# macOS -npm run build:mac -# → dist/PTT Live Server.dmg -# → dist/mac/PTT Live Server.app - -# Linux -npm run build:linux -# → dist/PTT Live Server-0.3.0.deb -# → dist/PTT Live Server-0.3.0.AppImage - -# Les deux -npm run build -``` - ---- - -## 🎨 Architecture Technique - -### Communication - -``` -┌─────────────────────────────────────────┐ -│ MAIN PROCESS (Node.js) │ -│ │ -│ • spawn server/index.js │ -│ • IPC handlers: │ -│ - server:start() │ -│ - server:stop() │ -│ - server:status() │ -│ • Forward logs → Renderer │ -│ │ -└─────────────────────────────────────────┘ - ↕ IPC (contextBridge) -┌─────────────────────────────────────────┐ -│ RENDERER PROCESS (Frontend) │ -│ │ -│ • Fetch API REST :3000/admin/* │ -│ • Update UI (vanilla JS) │ -│ • Generate QR Code │ -│ • Display notifications (toast) │ -│ │ -└─────────────────────────────────────────┘ - ↕ HTTP -┌─────────────────────────────────────────┐ -│ SERVEUR PTT LIVE (spawned) │ -│ │ -│ • LiveKit Server (binaire Go) │ -│ • Audio Bridge Manager │ -│ • API REST Express :3000 │ -│ • WebSocket Audio Levels │ -│ │ -└─────────────────────────────────────────┘ -``` - -### Sécurité - -- ✅ `contextIsolation: true` (isoler Node.js du renderer) -- ✅ `nodeIntegration: false` (pas d'accès Node direct) -- ✅ `preload.js` (whitelist API via contextBridge) -- ⚠️ CSP manquant (à ajouter en prod) - ---- - -## 📚 Documentation Créée - -1. **[electron/README.md](electron/README.md)** (doc technique complète) - - Architecture - - API utilisées - - Build & packaging - - Debug - -2. **[electron/QUICKSTART.md](electron/QUICKSTART.md)** (guide rapide) - - Lancement en 30s - - Checklist première utilisation - - Problèmes courants - -3. **[electron/CHANGELOG.md](electron/CHANGELOG.md)** (historique v0.3.0) - - Fonctionnalités - - Technique - - TODO - -4. **[DESKTOP-APP.md](DESKTOP-APP.md)** (doc utilisateur complète) - - Aperçu fonctionnalités - - Guide utilisation - - Build distribution - - FAQ - -5. **Mises à jour** - - [README.md](README.md) : section "Application Desktop" - - [CLAUDE.md](CLAUDE.md) : section "Application Desktop (v0.3.0)" - ---- - -## ✅ Checklist Validation - -### Fonctionnel - -- [x] Application se lance sans erreur -- [x] Serveur démarre automatiquement -- [x] Dashboard affiche stats -- [x] Configuration devices fonctionne -- [x] Groupes CRUD opérationnel -- [x] Logs temps réel -- [x] Notifications toast - -### Code - -- [x] Syntaxe JS valide (main.js, preload.js, app.js) -- [x] HTML valide -- [x] CSS sans erreur -- [x] eslint compatible (pas de lint errors) - -### Documentation - -- [x] README technique complet -- [x] QUICKSTART guide rapide -- [x] CHANGELOG historique -- [x] DESKTOP-APP doc utilisateur -- [x] README principal mis à jour -- [x] CLAUDE.md mis à jour - -### Packaging - -- [x] package.json configuré -- [x] electron-builder configuré -- [x] Scripts build:mac / build:linux -- [x] .gitignore créé - ---- - -## 🎓 Points d'Apprentissage - -### Electron - -- Main Process vs Renderer Process -- IPC sécurisé via contextBridge -- spawn child_process pour serveur -- electron-builder pour packaging - -### APIs - -- Réutilisation 100% API admin existante -- Polling vs WebSocket (stats vs audio levels) -- Détection IP réseau depuis serveur - -### Frontend - -- Vanilla JS (pas de framework pour légèreté) -- Navigation SPA manuelle -- Toast notifications custom -- QR Code génération (lib CDN) - ---- - -## 🏆 Résultat - -**Application desktop professionnelle complète** pour gérer PTT Live : -- ✅ Interface graphique intuitive -- ✅ Toutes les fonctionnalités admin accessibles -- ✅ Packagée pour distribution (macOS/Linux) -- ✅ Documentation exhaustive - -**Prêt pour tests utilisateurs** et itérations futures. - ---- - -**Développé avec Claude Code** -**Date : 2026-06-19** -**Version : 0.3.0** diff --git a/SSL-SOLUTION.md b/SSL-SOLUTION.md deleted file mode 100644 index 3c93a89..0000000 --- a/SSL-SOLUTION.md +++ /dev/null @@ -1,295 +0,0 @@ -# 🔐 Solution SSL 100% Locale - Résumé - -## ✅ Problème Résolu - -**Avant** : -- ❌ Certificats self-signed bloqués par navigateurs -- ❌ Warnings "Connexion non sécurisée" -- ❌ WebRTC refuse de fonctionner en HTTPS invalide -- ❌ Configuration complexe manuelle - -**Après** : -- ✅ Certificats **automatiquement approuvés** par système et navigateurs -- ✅ Cadenas vert 🔒 sans warnings -- ✅ WebRTC fonctionne parfaitement -- ✅ Installation automatique en 2 minutes - ---- - -## 🎯 Solution : mkcert - -**mkcert** = générateur de certificats SSL locaux **de confiance** - -### Principe - -1. Installe une **Certificate Authority (CA) locale** sur votre machine -2. Génère des certificats signés par cette CA -3. Système et navigateurs font **automatiquement confiance** à cette CA -4. Résultat : certificats locaux = certificats valides ✅ - -### Avantages - -- ✅ **100% local** : pas de cloud, pas de domaine requis -- ✅ **Automatique** : script d'installation complet -- ✅ **Multi-plateforme** : macOS, Linux, Windows -- ✅ **Multi-navigateurs** : Chrome, Safari, Edge, Firefox -- ✅ **Valable 10 ans** : pas de renouvellement - ---- - -## 🚀 Installation - -### Un Seul Script - -```bash -# Depuis la racine du projet -./setup-certificates.sh -``` - -Ce script fait **automatiquement** : - -1. ✅ Installe `mkcert` (via Homebrew sur macOS, apt sur Linux) -2. ✅ Installe la CA locale dans le système -3. ✅ Détecte votre **IP réseau** (ex: 192.168.1.10) -4. ✅ Génère certificats pour : - - `localhost` - - `127.0.0.1` - - Votre IP réseau - - `*.local` -5. ✅ Configure automatiquement : - - `server/.env` (chemins certificats) - - `client/.env` (URL HTTPS serveur) - - `client/vite.config.js` (HTTPS Vite) - - `server/index.js` (déjà compatible) - -**Temps : ~2 minutes** - ---- - -## 📁 Fichiers Créés - -``` -PTT Live/ -├── certs/ # NOUVEAU -│ ├── localhost.pem # Certificat public -│ └── localhost-key.pem # Clé privée -│ -├── server/.env # MIS À JOUR -│ ENABLE_HTTPS=true -│ SSL_CERT=/path/to/localhost.pem -│ SSL_KEY=/path/to/localhost-key.pem -│ NETWORK_IP=192.168.1.10 -│ -└── client/ - ├── .env # CRÉÉ - │ VITE_SERVER_URL=https://192.168.1.10:3000 - │ - └── vite.config.js # MIS À JOUR - server: { - https: { key, cert } - } -``` - ---- - -## 🌐 Utilisation - -### Démarrage - -```bash -# Mode développement (2 terminaux) -./start.sh --dev - -# OU Mode desktop (1 terminal) -./start-desktop.sh -``` - -### URLs d'Accès - -**Depuis l'ordinateur serveur** : -``` -https://localhost:3000 (serveur) -https://localhost:5173 (client dev) -``` - -**Depuis smartphone (même WiFi)** : -``` -https://192.168.1.10:3000 (serveur) -https://192.168.1.10:5173 (client dev) - -OU scanner le QR Code affiché au démarrage -``` - -### Première Connexion Smartphone - -1. Scanner QR Code -2. Le navigateur ouvre l'URL HTTPS -3. **Accepter le certificat** (une seule fois) - - iOS : "Continuer" → "Visiter ce site web" - - Android : "Avancé" → "Continuer" -4. La PWA se charge normalement -5. Installer sur écran d'accueil - -**Pourquoi accepter manuellement ?** -La CA locale est installée sur le **serveur**, pas sur chaque smartphone. -C'est normal et **sécurisé** sur réseau local privé. - ---- - -## 🔧 Code Modifié - -### server/index.js - -```javascript -// Avant (chemins hardcodés) -const httpsOptions = { - key: readFileSync(join(certPath, 'localhost+3-key.pem')), - cert: readFileSync(join(certPath, 'localhost+3.pem')) -}; - -// Après (depuis .env avec fallback) -const certPath = process.env.SSL_CERT || join(__dirname, '..', 'certs', 'localhost.pem'); -const keyPath = process.env.SSL_KEY || join(__dirname, '..', 'certs', 'localhost-key.pem'); - -if (!existsSync(certPath) || !existsSync(keyPath)) { - log('error', '❌ Certificats SSL introuvables'); - log('info', '💡 Exécutez : ./setup-certificates.sh'); - process.exit(1); -} - -const httpsOptions = { - key: readFileSync(keyPath), - cert: readFileSync(certPath) -}; -``` - ---- - -## ✅ Avantages vs Autres Solutions - -| Solution | Local | Auto-approuvé | Setup | Renouvellement | -|----------|-------|---------------|-------|----------------| -| **mkcert** | ✅ | ✅ | 2 min | 10 ans | -| Self-signed manuel | ✅ | ❌ | 30 min | Annuel | -| Let's Encrypt | ❌ | ✅ | 1h+ | 90 jours | -| Certificat commercial | ❌ | ✅ | Payant | Annuel | - -**Verdict** : mkcert = solution idéale pour développement et déploiement local - ---- - -## 📱 Mobile : Pourquoi Accepter Manuellement ? - -### Explication Technique - -1. **CA locale installée sur serveur** : - - Système macOS/Linux fait confiance à la CA - - Navigateurs desktop (Chrome/Safari/Firefox) font confiance - -2. **Smartphones non configurés** : - - La CA locale n'est pas sur iOS/Android - - Les mobiles ne connaissent pas cette CA - - Normal et **sécurisé** sur réseau privé - -### Options - -**A) Accepter manuellement (recommandé)** -- 2 clics par appareil -- Une seule fois -- Simple et rapide - -**B) Installer CA sur chaque mobile (optionnel)** -- iOS : Réglages → VPN → Profils -- Android : Sécurité → Certificats -- Plus complexe, pas nécessaire - -💡 **Recommandation** : Option A, largement suffisant - ---- - -## 🐛 Dépannage - -### Serveur refuse de démarrer - -**Erreur** : "Certificats SSL introuvables" - -**Solution** : -```bash -# Vérifier -ls certs/ - -# Régénérer -./setup-certificates.sh -``` - -### Warning SSL sur Desktop - -**Problème** : Cadenas rouge sur Chrome - -**Solution** : -```bash -# Réinstaller CA -mkcert -install - -# Redémarrer navigateur -``` - -### Firefox : Certificat non approuvé - -**Problème** : Firefox affiche warning (Chrome OK) - -**Solution** : -```bash -# Installer NSS -brew install nss # macOS -sudo apt install libnss3-tools # Linux - -# Réinstaller CA -mkcert -install -``` - ---- - -## 🎓 Pourquoi Cette Solution ? - -### Contraintes du Projet - -1. ✅ **100% local** : pas de dépendance cloud/internet -2. ✅ **Pas de domaine** : fonctionne sur IP locale -3. ✅ **HTTPS requis** : WebRTC + Service Workers -4. ✅ **Multi-devices** : desktop + smartphones -5. ✅ **Événementiel** : WiFi privé, changement IP fréquent - -### mkcert Répond à Tout - -- Local ✅ -- Pas de domaine ✅ -- HTTPS valide ✅ -- Multi-devices (avec acceptation manuelle) ✅ -- Re-génération rapide si IP change ✅ - ---- - -## 📚 Documentation - -- **[SSL-SETUP.md](SSL-SETUP.md)** : Guide complet détaillé -- **[setup-certificates.sh](setup-certificates.sh)** : Script d'installation -- **[README.md](README.md)** : Mis à jour avec étape certificats - ---- - -## 🏆 Résultat - -**HTTPS 100% local fonctionnel** : -- ✅ Certificats approuvés automatiquement -- ✅ Cadenas vert sur desktop -- ✅ WebRTC fonctionne -- ✅ PWA installable -- ✅ Pas de cloud, pas de domaine -- ✅ Installation en 2 minutes - -**Production ready** pour déploiement événementiel WiFi local ! 🎉 - ---- - -**Commande magique** : `./setup-certificates.sh`