diff --git a/.env.example b/.env.example index 3ad68fd..170cadd 100644 --- a/.env.example +++ b/.env.example @@ -21,3 +21,8 @@ MAX_FILE_SIZE=5242880 # Limite de taux (requests par fenêtre) RATE_LIMIT_MAX=100 RATE_LIMIT_WINDOW_MS=900000 + +# URL de l'application (IMPORTANT pour Google OAuth) +# En local: http://localhost:2222 +# En production: https://votre-domaine.com (sans slash final) +APP_URL=http://localhost:2222 diff --git a/OAUTH_SETUP.md b/OAUTH_SETUP.md new file mode 100644 index 0000000..429154a --- /dev/null +++ b/OAUTH_SETUP.md @@ -0,0 +1,95 @@ +# Configuration OAuth Google Calendar + +Ce guide vous aide à résoudre les erreurs d'authentification OAuth Google. + +## Problème : Erreur 400 - redirect_uri_mismatch + +Cette erreur se produit quand l'URL de redirection configurée dans votre code ne correspond pas à celle configurée dans Google Cloud Console. + +### Solution + +#### 1. Identifier votre URL de redirection + +Votre application utilise automatiquement : +``` +{VOTRE_DOMAINE}/api/calendar/oauth-callback +``` + +Exemples : +- En local : `http://localhost:2222/api/calendar/oauth-callback` +- En production : `https://votredomaine.com/api/calendar/oauth-callback` + +#### 2. Configurer la variable d'environnement APP_URL + +Si vous utilisez un domaine personnalisé ou une URL différente de `http://localhost:2222` : + +1. Créez un fichier `.env` à la racine du projet (copiez depuis `.env.example`) : + ```bash + cp .env.example .env + ``` + +2. Modifiez la variable `APP_URL` dans le fichier `.env` : + ```env + # Pour un domaine local + APP_URL=http://localhost:2222 + + # Pour un domaine en production + APP_URL=https://votredomaine.com + + # IMPORTANT : Pas de slash "/" à la fin ! + ``` + +3. Redémarrez l'application pour que les changements prennent effet. + +#### 3. Configurer Google Cloud Console + +1. Allez sur [Google Cloud Console - Credentials](https://console.cloud.google.com/apis/credentials) + +2. Sélectionnez votre projet + +3. Cliquez sur votre "OAuth 2.0 Client ID" + +4. Dans la section **"URIs de redirection autorisées"**, ajoutez EXACTEMENT l'URL affichée dans l'interface NoteFlow (panneau Administration > Google Calendar) + +5. Cliquez sur **"Enregistrer"** + +6. **Important** : Attendez quelques minutes que Google propage les changements (peut prendre 5-10 minutes) + +#### 4. Tester la connexion + +1. Dans NoteFlow, allez dans **Administration** > **Google Calendar** + +2. Vérifiez que l'URL affichée dans l'encadré jaune correspond exactement à celle configurée dans Google Cloud Console + +3. Cliquez sur **"Se connecter avec Google"** + +4. Vous devriez maintenant voir un écran de sélection de compte Google + +## Problème : Pas de choix du compte Google + +### Solution + +Ce problème a été corrigé dans le code. L'authentification utilise maintenant `prompt: 'select_account consent'` qui force l'affichage du sélecteur de compte Google. + +Si vous ne voyez toujours pas le choix du compte : +1. Déconnectez-vous de Google Calendar dans NoteFlow +2. Effacez les cookies Google dans votre navigateur +3. Reconnectez-vous + +## Vérification rapide + +✅ Checklist : +- [ ] Fichier `.env` créé avec la bonne valeur pour `APP_URL` +- [ ] URL de redirection configurée dans Google Cloud Console (sans faute de frappe !) +- [ ] API Google Calendar activée dans Google Cloud Console +- [ ] Client ID et Client Secret enregistrés dans NoteFlow +- [ ] Application redémarrée après modification du `.env` +- [ ] Attendu 5-10 minutes après modification dans Google Cloud Console + +## Besoin d'aide ? + +Si le problème persiste : +1. Vérifiez les logs de l'application pour des messages d'erreur détaillés +2. Assurez-vous que votre navigateur accepte les cookies tiers +3. Essayez en navigation privée pour éliminer les problèmes de cache +4. Vérifiez que l'API Google Calendar est bien activée dans votre projet Google Cloud diff --git a/routes/calendar.routes.js b/routes/calendar.routes.js index c3bacdf..4956ec8 100644 --- a/routes/calendar.routes.js +++ b/routes/calendar.routes.js @@ -14,8 +14,9 @@ const SCOPES = ['https://www.googleapis.com/auth/calendar.readonly']; /** * Créer un client OAuth2 + * @param {string} [customRedirectUri] - URI de redirection personnalisée (optionnel) */ -async function getOAuth2Client() { +async function getOAuth2Client(customRedirectUri = null) { const clientId = await getOne("SELECT value FROM settings WHERE key = 'google_client_id'"); const clientSecret = await getOne("SELECT value FROM settings WHERE key = 'google_client_secret'"); @@ -23,7 +24,9 @@ async function getOAuth2Client() { throw new Error('Client ID et Client Secret non configurés'); } - const redirectUri = `${process.env.APP_URL || 'http://localhost:2222'}/api/calendar/oauth-callback`; + // Utiliser l'URI personnalisée si fournie, sinon utiliser APP_URL ou localhost + const redirectUri = customRedirectUri || + `${process.env.APP_URL || 'http://localhost:2222'}/api/calendar/oauth-callback`; return new google.auth.OAuth2( clientId.value, @@ -38,12 +41,14 @@ async function getOAuth2Client() { */ router.get('/auth-url', requireAdmin, async (req, res) => { try { - const oauth2Client = await getOAuth2Client(); + // Permettre de passer une URL de redirection personnalisée via query param + const customRedirectUri = req.query.redirect_uri; + const oauth2Client = await getOAuth2Client(customRedirectUri); const authUrl = oauth2Client.generateAuthUrl({ access_type: 'offline', scope: SCOPES, - prompt: 'consent', // Force le prompt pour obtenir refresh_token + prompt: 'select_account consent', // Force le choix du compte ET le prompt pour obtenir refresh_token state: req.user.id.toString() // Pour identifier l'utilisateur au retour }); diff --git a/src/pages/Index.tsx b/src/pages/Index.tsx index ba62da3..7b894b7 100644 --- a/src/pages/Index.tsx +++ b/src/pages/Index.tsx @@ -1375,9 +1375,21 @@ const Index = () => { Google Cloud Console {' '}et activez l'API Google Calendar. -
- URI de redirection autorisée: {window.location.origin}/api/calendar/oauth-callback

+
+

+ ⚠️ IMPORTANT : URI de redirection autorisée +

+

+ Ajoutez cette URL exacte dans la console Google Cloud (OAuth 2.0 Client IDs → URIs de redirection autorisées) : +

+ + {window.location.origin}/api/calendar/oauth-callback + +

+ 💡 Si vous utilisez un domaine différent, créez un fichier .env avec APP_URL=https://votre-domaine.com +

+