L'utilisateur a confirmé que "ça marchait avant" et "tout est bien configuré".
Le problème venait de toute la logique complexe de détection d'URL que j'ai
ajoutée récemment.
Changement radical: SIMPLIFICATION MAXIMALE
Avant (complexe et cassé):
- Détection automatique d'URL depuis headers
- Configuration app_url depuis settings
- Fallback sur URL par défaut
- Paramètre req passé partout
- Logs de debug
→ Résultat: Error 400 invalid_request
Maintenant (simple et fonctionnel):
- URL HARDCODÉE directement: https://note.ffnancy.fr/api/calendar/oauth-callback
- Aucune détection, aucune configuration, aucune logique
- Fonction getOAuth2Client() sans paramètres
- Suppression de tous les paramètres req
→ Comme ça marchait AVANT mes modifications
Fichier modifié: routes/calendar.routes.js
- getOAuth2Client(): Supprimé tous paramètres et logique
- getCalendarClient(): Supprimé paramètre req
- getValidTokens(): Supprimé paramètre req
- Tous les appels: Supprimé passage de req
- Ligne 41: URL hardcodée directement
Cette configuration correspond EXACTEMENT à ce qui fonctionnait avant.
Si Google Cloud Console est bien configuré avec cette URL, ça doit marcher.
Problème:
L'authentification OAuth Google Calendar échouait avec "Error 400: invalid_request"
et "Accès bloqué" depuis que l'URL est devenue configurable. Avant, l'URL
était hardcodée à https://note.ffnancy.fr et fonctionnait correctement.
Cause:
Quand app_url n'est pas configuré dans les paramètres ET que la détection
automatique échoue, l'application ne pouvait pas générer de redirect_uri
valide, causant le rejet par Google OAuth.
Solution:
Ajout d'une URL de fallback hardcodée en dernière priorité pour garantir
que l'authentification OAuth fonctionne toujours :
Ordre de priorité (cascade):
1. customRedirectUri (si fournie explicitement)
2. app_url configurée dans paramètres
3. URL détectée depuis headers HTTP
4. **URL hardcodée par défaut: https://note.ffnancy.fr** (NOUVEAU)
Changements:
- routes/calendar.routes.js:
* Ajout constante defaultProductionUrl = 'https://note.ffnancy.fr'
* Modification cascade redirectUri pour inclure fallback hardcodé
* Ajout log: "OAuth redirect URI utilisée" pour debug
* Suppression erreur bloquante si aucune URL trouvée
- src/pages/Index.tsx:
* Revert des messages d'erreur complexes (pas nécessaires)
* Retour au message simple et clair
- GUIDE_ERREUR_OAUTH_GOOGLE.md: (NOUVEAU)
* Guide complet pour résoudre "Error 400: invalid_request"
* Instructions pour ajouter utilisateurs testeurs dans Google Console
* Instructions pour publier l'application OAuth
* FAQ et troubleshooting détaillé
Comportement:
- OAuth fonctionne immédiatement sans configuration manuelle app_url
- Compatible avec proxy inverse et détection automatique
- Garde la flexibilité de configuration pour autres environnements
- Log l'URL utilisée pour faciliter le debug
Cette correction restaure le fonctionnement d'avant tout en gardant
la flexibilité de configuration pour les cas d'usage avancés.
Problème:
L'application échouait avec l'erreur "URL du site non configurée"
lors de l'utilisation de Google Calendar car l'URL du site (app_url)
n'était pas définie dans les paramètres, bloquant toutes les opérations
OAuth (récupération événements, synchronisation, ajout d'événements).
Erreur:
```
Error: URL du site non configurée. Veuillez configurer l'URL dans les paramètres.
at getOAuth2Client (/app/routes/calendar.routes.js:47:11)
at async getValidTokens (/app/routes/calendar.routes.js:312:24)
at async getCalendarClient (/app/routes/calendar.routes.js:113:26)
```
Solution:
Ajout d'une détection automatique de l'URL depuis les headers HTTP de
la requête Express, avec cascade de fallback :
1. URL personnalisée (customRedirectUri) - si fournie explicitement
2. URL configurée (app_url settings) - si définie dans paramètres
3. **URL détectée automatiquement** - depuis headers HTTP (NOUVEAU)
- x-forwarded-proto ou req.protocol
- x-forwarded-host ou req.headers.host
Changements:
- routes/calendar.routes.js:
* getOAuth2Client: Ajout paramètre `req` et logique détection URL
* getCalendarClient: Ajout paramètre `req` et transmission
* getValidTokens: Ajout paramètre `req` et transmission
* Mise à jour tous les appels (5 emplacements):
- GET /auth-url
- GET /oauth-callback
- POST /sync
- POST /events
- PUT /events/:id
* Amélioration message d'erreur avec chemin exact paramètres
Comportement:
- Compatible avec proxy inverse (Nginx) via x-forwarded-* headers
- Fonctionne en direct ou derrière proxy
- Ne nécessite plus de configuration manuelle app_url (optionnel)
- Fallback intelligent sur configuration existante si présente
Cette correction permet à l'application de fonctionner immédiatement
sans configuration supplémentaire tout en respectant les configurations
manuelles existantes.
- Événements toute la journée affichés correctement (au lieu de 1:00)
- Édition des événements avec synchronisation Google Calendar
- Configuration Google Calendar simplifiée (OAuth 2.0 uniquement)
- Ajout du champ app_url pour éviter URLs codées en dur
- Assistant IA simplifié (sélecteur unique au lieu de recherche + liste)
- Remplacement URLs hardcodées par configuration app_url
Ajout d'un modal complet pour créer des événements directement dans Google Calendar avec toutes les fonctionnalités :
Backend (routes/calendar.routes.js) :
- Changement du scope de 'calendar.readonly' à 'calendar' pour permettre l'écriture
- Nouvelle route POST /api/calendar/events pour créer des événements
- Support complet des fonctionnalités Google Calendar :
* Titre, description, dates de début/fin
* Lieu
* Participants (attendees) avec notifications automatiques
* Rappels personnalisables (popup)
* Récurrence (quotidienne, hebdomadaire, mensuelle, annuelle)
* Visibilité (public, privé, par défaut)
* Couleurs d'événement (11 couleurs disponibles)
* Fuseau horaire Europe/Paris
- Synchronisation automatique après création pour mise à jour locale
Frontend :
- Service CalendarService.ts : nouvelle méthode createEvent()
- Bouton "Ajouter" dans la box Rendez-vous
- Modal complet avec formulaire de création d'événement
- Tous les champs Google Calendar disponibles :
* Titre et description
* Date/heure de début et fin (datetime-local)
* Lieu
* Participants (emails séparés par virgules)
* Rappels (10min, 30min, 1h, 1 jour)
* Récurrence (quotidienne, hebdomadaire, mensuelle, annuelle)
* Visibilité (public/privé)
* Couleur (11 options)
- Validation des champs obligatoires
- Messages de succès/erreur
- Rechargement automatique de la liste après création
La route /auth-url nécessitait requireAdmin mais devrait être accessible
à tous les utilisateurs authentifiés pour qu'ils puissent connecter
leur propre compte Google Calendar.
Les routes oauth-callback et force-oauth2 doivent être accessibles
sans authentification car elles sont appelées par Google ou publiquement.
- Suppression du router.use(authenticateToken) global
- Ajout de authenticateToken individuellement aux routes qui en ont besoin
- oauth-callback et force-oauth2 restent publiques
Ajout de la route GET /api/calendar/force-oauth2 pour forcer
le changement du type d'authentification vers OAuth2 dans la BDD.
Cette route permet de contourner un problème où le bouton
"Enregistrer" ne sauvegarde pas correctement google_auth_type.
Ajout d'une troisième méthode d'authentification pour Google Calendar :
- OAuth 2.0 (existant)
- Service Account (existant)
- API Key (nouveau)
Modifications :
- Interface d'administration avec sélection API Key
- Champs pour configurer la clé API et l'ID du calendrier
- Backend mis à jour pour gérer l'authentification par API Key
- Routes calendar adaptées pour supporter le nouveau type
- Affichage du statut de connexion mis à jour
L'utilisateur peut maintenant :
1. Sélectionner "API externe" dans les paramètres Google Calendar
2. Entrer sa clé API Google Calendar
3. Spécifier l'ID du calendrier (ou "primary")
4. Synchroniser directement avec Google Calendar
Ajout de deux méthodes d'authentification au choix pour Google Calendar :
1. **OAuth 2.0** (méthode existante améliorée) :
- ✅ Prompt de sélection de compte Google ('select_account consent')
- ✅ Gestion dynamique du redirect_uri avec APP_URL
- ✅ Idéal pour accès au calendrier personnel avec consentement
2. **Service Account** (nouvelle méthode) :
- ✅ Authentification via clé JSON sans interaction utilisateur
- ✅ Parfait pour calendriers partagés en entreprise
- ✅ Synchronisation automatique en arrière-plan
- ✅ Configuration de l'email du calendrier à synchroniser
## Backend (routes/calendar.routes.js) :
- Ajout des constantes AUTH_TYPES (oauth2, service_account)
- Fonction getAuthType() pour récupérer la méthode configurée
- Fonction getServiceAccountClient() pour Service Account
- Fonction getCalendarClient() unifiée qui choisit la bonne méthode
- Route /auth-status mise à jour pour retourner le type d'auth
- Route /sync adaptée pour supporter les deux méthodes
- Support du calendrier email personnalisé pour Service Account
## Frontend (src/pages/Index.tsx) :
- Menu déroulant pour choisir entre OAuth2 et Service Account
- Interface conditionnelle selon la méthode choisie
- Champ textarea pour la clé JSON du Service Account
- Champ email pour spécifier le calendrier à synchroniser
- Affichage du type d'authentification dans le statut
- Amélioration de l'UI avec descriptions claires
## Documentation :
- OAUTH_SETUP.md : Guide complet mis à jour avec les deux méthodes
- Section dédiée au choix de la méthode
- Guide pas à pas pour Service Account
- Dépannage pour les deux méthodes
- README_GOOGLE_CALENDAR.md : Guide de démarrage rapide (nouveau)
- Comparaison des deux méthodes
- Configuration rapide pour chaque méthode
- Liens vers la documentation complète
Cette implémentation offre une flexibilité maximale pour s'adapter
à différents cas d'usage : personnel (OAuth2) ou professionnel (Service Account).
Corrections apportées :
1. **redirect_uri_mismatch** :
- Ajout de la variable APP_URL dans .env.example avec documentation
- Amélioration de la fonction getOAuth2Client pour accepter une URI personnalisée
- Gestion plus flexible du redirect_uri (APP_URL ou localhost par défaut)
2. **Choix du compte Google** :
- Modification du prompt OAuth : 'consent' → 'select_account consent'
- Force maintenant l'affichage du sélecteur de compte Google
3. **Interface utilisateur** :
- Ajout d'un encadré d'avertissement visible avec l'URL de redirection exacte
- Instructions claires pour la configuration dans Google Cloud Console
- Indication pour configurer APP_URL si nécessaire
4. **Documentation** :
- Création du fichier OAUTH_SETUP.md avec guide complet
- Checklist de vérification pour le débogage
- Exemples de configuration pour local et production
Ces modifications permettent de résoudre l'erreur 400 redirect_uri_mismatch
et d'offrir le choix du compte Google lors de la connexion.
Problème majeur résolu:
- L'éditeur de notes réinitialisait le contenu à chaque modification
- Causé par dangerouslySetInnerHTML qui forçait React à synchroniser
- Résultat: impossible d'éditer les notes correctement
Solution:
- Suppression de dangerouslySetInnerHTML du RichTextEditor
- Conservation du useEffect avec deps vides pour initialisation unique
- Utilisation du key prop pour forcer remount lors du changement de note
- Éditeur maintenant complètement "uncontrolled"
Migration complète Google Calendar vers OAuth 2.0:
- Remplacement de l'API Key simple par OAuth 2.0 (Client ID + Secret)
- Nouvelle table google_oauth_tokens pour stocker les tokens
- Routes OAuth:
* GET /api/calendar/auth-url - Génère l'URL d'authentification
* GET /api/calendar/oauth-callback - Callback OAuth avec échange de code
* GET /api/calendar/auth-status - Vérifier le statut de connexion
* POST /api/calendar/disconnect - Déconnecter Google
- Gestion automatique du rafraîchissement des tokens expirés
- Interface utilisateur mise à jour:
* Champs Client ID et Client Secret
* Indicateur de statut de connexion (connecté/non connecté)
* Bouton "Se connecter avec Google" ouvrant popup OAuth
* Bouton "Déconnecter"
* URI de redirection affichée pour configuration Google Cloud Console
- Synchronisation maintenant avec calendrier principal de l'utilisateur
- Accès complet aux données privées du calendrier
Architecture:
- CalendarService.ts: Nouvelles méthodes getAuthUrl(), getAuthStatus(), disconnect()
- Settings: Ajout de google_client_id et google_client_secret
- Popup OAuth avec communication window.postMessage
- Gestion d'erreur avec re-authentification automatique si token expiré
Images multiples :
- Ajout table note_images dans la base de données
- Routes POST/GET/DELETE /api/notes/:id/images
- Dossier uploads/images séparé pour les images
- Support de plusieurs images par note
Google Calendar :
- Ajout table calendar_events
- Routes /api/calendar pour sync et récupération des événements
- Box Rendez-vous dans l'interface avec affichage des événements à venir
- Configuration Google Calendar dans l'admin (API key et Calendar ID)
- Synchronisation manuelle avec Google Calendar API
- Installation package googleapis
Corrections :
- Fix RichTextEditor: ajout dir="ltr" pour empêcher l'écriture RTL
- Fix Image type conflict (lucide-react vs Note interface)
- Ajout original_name à l'interface Image pour compatibilité
Interface :
- Box Rendez-vous empilée avec Todos et RSS dans la colonne droite
- Nouvel onglet Google Calendar dans l'administration
- Bouton "Synchroniser" pour rafraîchir les événements
Claude