Initial commit: Family Planner application
Complete family planning application with: - React frontend with TypeScript - Node.js/Express backend with TypeScript - Python ingestion service for document processing - Planning ingestion service with LLM integration - Shared UI components and type definitions - OAuth integration for calendar synchronization - Comprehensive documentation 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
221
docs/archive/QUICK_START_OAUTH.md
Normal file
221
docs/archive/QUICK_START_OAUTH.md
Normal file
@@ -0,0 +1,221 @@
|
||||
# 🚀 Quick Start - Connexion Google Calendar
|
||||
|
||||
## ⚡ Démarrage rapide (5 minutes)
|
||||
|
||||
### 1️⃣ Ajouter votre email en utilisateur de test ⚠️ OBLIGATOIRE
|
||||
|
||||
Sans cette étape, vous verrez "Access blocked".
|
||||
|
||||
**Étapes** :
|
||||
1. Ouvrez https://console.cloud.google.com/
|
||||
2. Sélectionnez le projet **familyplanner-474915**
|
||||
3. Menu **APIs & Services** → **OAuth consent screen**
|
||||
4. Section **Test users** → Cliquez **ADD USERS**
|
||||
5. Tapez : `phil.heyraud@gmail.com`
|
||||
6. Cliquez **SAVE**
|
||||
|
||||
✅ **Fait ? Passez à l'étape 2**
|
||||
|
||||
---
|
||||
|
||||
### 2️⃣ Vérifier que le backend tourne
|
||||
|
||||
Le backend devrait déjà être démarré. Vérifiez dans votre terminal :
|
||||
|
||||
```
|
||||
Server ready on port 5000
|
||||
```
|
||||
|
||||
✅ **Si vous voyez ça, passez à l'étape 3**
|
||||
|
||||
❌ **Si non**, démarrez-le :
|
||||
```bash
|
||||
cd backend
|
||||
npm run dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### 3️⃣ Démarrer le frontend
|
||||
|
||||
Ouvrez un **nouveau terminal** :
|
||||
|
||||
```bash
|
||||
cd frontend
|
||||
npm run dev
|
||||
```
|
||||
|
||||
Vous devriez voir :
|
||||
```
|
||||
Local: http://localhost:5174/
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### 4️⃣ Tester la connexion Google
|
||||
|
||||
1. **Ouvrez** : http://localhost:5174
|
||||
2. **Allez** dans **Paramètres** ou **Profil**
|
||||
3. **Cherchez** la section **"Agendas connectés"**
|
||||
4. **Cliquez** sur **"Continuer avec Google"**
|
||||
|
||||
**Ce qui va se passer** :
|
||||
- 🌐 Redirection vers `accounts.google.com`
|
||||
- 🔐 Page de connexion Google (si pas déjà connecté)
|
||||
- ✅ Page de consentement : "Family Planner souhaite accéder à votre agenda"
|
||||
- ✅ Cliquez sur **"Autoriser"**
|
||||
- 🔄 Retour vers l'application
|
||||
- 🎉 Calendrier connecté !
|
||||
|
||||
---
|
||||
|
||||
## 🎯 Test rapide de l'URL OAuth (optionnel)
|
||||
|
||||
Avant de tester via l'interface, vous pouvez tester l'URL OAuth directement :
|
||||
|
||||
**Copiez cette URL dans votre navigateur** :
|
||||
|
||||
```
|
||||
https://accounts.google.com/o/oauth2/v2/auth?client_id=645971045469-1f9kliea9lqhutjeicim377fui2kdhc8.apps.googleusercontent.com&redirect_uri=http://localhost:5000/api/calendar/oauth/callback&response_type=code&scope=https://www.googleapis.com/auth/calendar.readonly%20https://www.googleapis.com/auth/calendar.events&state=test-123&access_type=offline&prompt=consent
|
||||
```
|
||||
|
||||
**Résultat attendu** :
|
||||
- ✅ Page de consentement Google
|
||||
- ✅ Demande d'accès au calendrier
|
||||
|
||||
**Si erreur "Access blocked"** :
|
||||
- ❌ Vous avez oublié d'ajouter votre email en utilisateur de test
|
||||
- → Retournez à l'étape 1
|
||||
|
||||
---
|
||||
|
||||
## 🔍 Vérification des logs
|
||||
|
||||
### Backend (terminal 1)
|
||||
|
||||
Vous devriez voir lors de la connexion :
|
||||
```
|
||||
POST /api/calendar/google/oauth/start 200
|
||||
POST /api/calendar/oauth/complete 200
|
||||
```
|
||||
|
||||
### Frontend (DevTools - F12)
|
||||
|
||||
Console navigateur, vous devriez voir :
|
||||
```
|
||||
OAuth flow started
|
||||
Redirecting to Google...
|
||||
OAuth complete: success
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## ❌ Problèmes courants
|
||||
|
||||
### "Access blocked: This app's request is invalid"
|
||||
|
||||
**❌ Cause** : Email pas en utilisateur de test
|
||||
**✅ Solution** : Étape 1 ci-dessus
|
||||
|
||||
---
|
||||
|
||||
### "redirect_uri_mismatch"
|
||||
|
||||
**❌ Cause** : URI de redirection incorrecte
|
||||
**✅ Solution** : Vérifiez dans Google Cloud Console → Credentials
|
||||
|
||||
URIs autorisées doivent être **exactement** :
|
||||
```
|
||||
http://localhost:5000/api/calendar/oauth/callback
|
||||
http://localhost:5174/calendar/oauth/callback
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### "invalid_client"
|
||||
|
||||
**❌ Cause** : Client ID ou Secret incorrect
|
||||
**✅ Solution** : Vérifiez `backend/.env`
|
||||
|
||||
```env
|
||||
GOOGLE_CLIENT_ID=645971045469-1f9kliea9lqhutjeicim377fui2kdhc8.apps.googleusercontent.com
|
||||
GOOGLE_CLIENT_SECRET=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
|
||||
```
|
||||
|
||||
Puis **redémarrez le backend** :
|
||||
```bash
|
||||
# Arrêtez avec Ctrl+C
|
||||
npm run dev
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### Backend ne démarre pas
|
||||
|
||||
**❌ Erreur** : `Cannot find module 'calendar'`
|
||||
**✅ Solution** : Le fichier `calendar.ts` existe bien ici :
|
||||
```
|
||||
family-planner/backend/src/routes/calendar.ts
|
||||
```
|
||||
|
||||
Si absent, dites-le moi, je le recrée.
|
||||
|
||||
---
|
||||
|
||||
## 📊 État actuel de l'implémentation
|
||||
|
||||
| Fonctionnalité | Statut |
|
||||
|----------------|--------|
|
||||
| URL OAuth complète | ✅ Fait |
|
||||
| Redirection vers Google | ✅ Fait |
|
||||
| Page de consentement | ✅ Fait |
|
||||
| Retour avec code d'autorisation | ✅ Fait |
|
||||
| Échange code → access token | ⏳ À faire |
|
||||
| Stockage sécurisé tokens | ⏳ À faire |
|
||||
| Récupération événements | ⏳ À faire |
|
||||
| Synchronisation calendrier | ⏳ À faire |
|
||||
|
||||
---
|
||||
|
||||
## 🎉 Vous avez testé avec succès ?
|
||||
|
||||
**Prochaines étapes** :
|
||||
|
||||
1. **Implémenter l'échange du code OAuth**
|
||||
→ Voir `OAUTH_CONFIGURATION_COMPLETE.md` section 2
|
||||
|
||||
2. **Récupérer les événements du calendrier**
|
||||
→ Voir `OAUTH_CONFIGURATION_COMPLETE.md` section 4
|
||||
|
||||
3. **Sécuriser le stockage des tokens**
|
||||
→ Voir `ANALYSE_CODE_CALENDAR.md` section Sécurité
|
||||
|
||||
---
|
||||
|
||||
## 📁 Documents utiles
|
||||
|
||||
| Fichier | Pour quoi ? |
|
||||
|---------|-------------|
|
||||
| `README_OAUTH_GOOGLE.md` | Résumé complet de la config |
|
||||
| `OAUTH_CONFIGURATION_COMPLETE.md` | Détails + prochaines étapes |
|
||||
| `OAUTH_SETUP.md` | Guide configuration Google/Azure |
|
||||
| `ANALYSE_CODE_CALENDAR.md` | Analyse sécurité/qualité code |
|
||||
| `QUICK_START_OAUTH.md` | Ce fichier (démarrage rapide) |
|
||||
|
||||
---
|
||||
|
||||
## 🆘 Besoin d'aide ?
|
||||
|
||||
**Testez d'abord** :
|
||||
1. ✅ Backend sur http://localhost:5000
|
||||
2. ✅ Frontend sur http://localhost:5174
|
||||
3. ✅ URL OAuth manuellement (ci-dessus)
|
||||
|
||||
**Si toujours bloqué** :
|
||||
- Regardez les logs backend (terminal 1)
|
||||
- Ouvrez DevTools (F12) → Console (frontend)
|
||||
- Vérifiez que votre email est bien en utilisateur de test
|
||||
|
||||
---
|
||||
|
||||
**Bon courage ! 🚀**
|
||||
Reference in New Issue
Block a user