FamilyPlanner/docs/archive/OAUTH_SETUP.md

Configuration OAuth pour Google Calendar et Outlook

⚠️ IMPORTANT - Sécurité

AVANT DE COMMENCER : Révoquez immédiatement la clé OpenAI exposée dans le fichier .env :

1. Allez sur https://platform.openai.com/api-keys
2. Révéquez la clé commençant par sk-proj-efaTQ8cicJYU7k8RG...
3. Créez une nouvelle clé
4. Remplacez-la dans le fichier .env

Configuration Google Calendar OAuth

1. Créer un projet Google Cloud

1. Allez sur Google Cloud Console
2. Créez un nouveau projet ou sélectionnez un projet existant
3. Nommez-le "Family Planner" (ou autre nom)

2. Activer l'API Google Calendar

1. Dans le menu, allez dans APIs & Services > Library
2. Cherchez "Google Calendar API"
3. Cliquez sur Enable

3. Créer les identifiants OAuth

1. Allez dans APIs & Services > Credentials
2. Cliquez sur Create Credentials > OAuth client ID
3. Si demandé, configurez l'écran de consentement OAuth :
   • Type d'application : External
   • Nom de l'application : Family Planner
   • Email de support : votre email
   • Scopes : ajoutez https://www.googleapis.com/auth/calendar.readonly et https://www.googleapis.com/auth/calendar.events
   • Domaines autorisés : localhost
   • Sauvegardez
4. Créez l'OAuth client ID :
   • Type d'application : Web application
   • Nom : Family Planner Web
   • URIs de redirection autorisés :
     • http://localhost:5000/api/calendar/oauth/callback
     • http://localhost:5174/calendar/oauth/callback (pour le frontend)
5. Cliquez sur Create
6. Copiez le Client ID et le Client Secret

4. Configurer le .env

Ouvrez backend/.env et remplacez :

GOOGLE_CLIENT_ID=votre_client_id_ici
GOOGLE_CLIENT_SECRET=votre_client_secret_ici

---

Configuration Microsoft Outlook OAuth

1. Créer une application Azure AD

1. Allez sur Azure Portal
2. Recherchez Azure Active Directory
3. Allez dans App registrations > New registration
4. Nommez l'application : Family Planner
5. Type de compte : Accounts in any organizational directory and personal Microsoft accounts
6. URI de redirection :
   • Type : Web
   • URI : http://localhost:5000/api/calendar/oauth/callback
7. Cliquez sur Register

2. Configurer les permissions

1. Dans votre application, allez dans API permissions
2. Cliquez sur Add a permission > Microsoft Graph
3. Sélectionnez Delegated permissions
4. Ajoutez :
   • Calendars.Read
   • Calendars.ReadWrite
   • offline_access
5. Cliquez sur Add permissions

3. Créer un client secret

1. Allez dans Certificates & secrets
2. Cliquez sur New client secret
3. Description : Family Planner Secret
4. Expiration : 24 mois (ou selon votre préférence)
5. Cliquez sur Add
6. Copiez immédiatement la valeur (vous ne pourrez plus la voir)

4. Récupérer le Client ID

1. Retournez à Overview
2. Copiez l'Application (client) ID

5. Configurer le .env

Ouvrez backend/.env et remplacez :

OUTLOOK_CLIENT_ID=votre_application_client_id_ici
OUTLOOK_CLIENT_SECRET=votre_client_secret_ici

---

Vérification de la configuration

Après avoir configuré les deux providers :

1. Redémarrez le backend :

   cd backend
   npm run dev
   

2. Vérifiez les logs pour vous assurer qu'il n'y a pas d'erreur

3. Testez la connexion OAuth :

   • Ouvrez l'application frontend
   • Allez dans les paramètres du calendrier
   • Cliquez sur "Continuer avec Google" ou "Continuer avec Outlook"
   • Vous devriez être redirigé vers la page de consentement OAuth

---

Résolution des problèmes courants

Erreur "redirect_uri_mismatch"

• Vérifiez que l'URI de redirection dans votre console Google/Azure correspond exactement à celle dans le .env
• N'oubliez pas le protocole http:// et le port :5000

Erreur "invalid_client"

• Vérifiez que le Client ID et le Client Secret sont corrects
• Assurez-vous qu'il n'y a pas d'espaces avant/après les valeurs dans le .env

Erreur "access_denied"

• L'utilisateur a refusé les permissions
• Vérifiez que les scopes demandés sont bien configurés dans la console

L'erreur "Required parameter is missing: response_type"

• Cette erreur est maintenant corrigée avec la nouvelle version du fichier calendar.ts
• L'URL OAuth contient maintenant tous les paramètres requis : response_type=code

---

Mode développement (sans OAuth réel)

Si vous voulez tester sans configurer OAuth pour l'instant, vous pouvez utiliser l'endpoint de connexion par identifiants (mock) :

curl -X POST http://localhost:5000/api/calendar/google/credentials \
  -H "Content-Type: application/json" \
  -d '{
    "profileId": "test-profile",
    "email": "test@gmail.com",
    "password": "fake-password",
    "label": "Test Google Calendar"
  }'

Cette méthode crée une connexion factice pour tester l'interface sans vraie authentification OAuth.

---

Prochaines étapes

Une fois OAuth configuré, vous devrez :

1. Implémenter l'échange du code d'autorisation contre un access token
2. Stocker les tokens de manière sécurisée (chiffrement)
3. Implémenter le refresh token pour maintenir l'accès
4. Récupérer les événements du calendrier via l'API Google/Microsoft
5. Synchroniser les événements avec votre base de données

Référez-vous à l'architecture PRONOTE pour un exemple de gestion sécurisée des tokens.