# 🔧 Résolution du Problème d'Authentification en Production

## 📋 Diagnostic

### Problème Identifié
L'erreur `Authentication credentials were not provided` survient en production car :

1. **Incompatibilité de domaine pour les cookies** :
   - Frontend : `https://amifond.vercel.app` 
   - Backend : `https://amifond-api.awounfouet.com`
   - Cookies configurés avec : `domain=".awounfouet.com"`

2. **Les cookies ne peuvent pas être partagés entre domaines différents** :
   - Les cookies définis pour `.awounfouet.com` ne sont **jamais** envoyés aux requêtes provenant de `*.vercel.app`
   - C'est une restriction de sécurité du navigateur

### Pourquoi ça marche en localhost ?
En développement (`DEBUG=True`), les cookies sont configurés avec :
- `domain=None` (cookies locaux)
- `samesite="Lax"` (plus permissif)
- Les requêtes viennent du même domaine (`localhost`)

## ✅ Solutions Appliquées

### 1. Modification des Cookies (Backend)

**Fichier modifié :** `/backend/apps/authentication/api/views.py`

```python
# AVANT (❌ Ne fonctionne pas cross-domain)
domain=PRODUCTION_COOKIE_DOMAIN if not settings.DEBUG else None  # ".awounfouet.com" en prod

# APRÈS (✅ Fonctionne cross-domain)
domain=None  # Pas de domaine spécifique, permet cross-origin avec SameSite=None
```

**Explication :** 
- Avec `domain=None`, le cookie est défini pour le domaine exact du backend (`amifond-api.awounfouet.com`)
- Avec `samesite="None"` et `secure=True`, le navigateur envoie le cookie même en cross-origin
- Le frontend doit utiliser `withCredentials: true` (déjà configuré dans `api-client.ts`)

### 2. Configuration CORS Améliorée (Backend)

**Fichier modifié :** `/backend/config/settings.py`

```python
# Headers CORS autorisés
CORS_ALLOW_HEADERS = [
    'accept',
    'accept-encoding',
    'authorization',
    'content-type',
    'dnt',
    'origin',
    'user-agent',
    'x-csrftoken',
    'x-requested-with',
    'cache-control',
]

# CSRF Trusted Origins
CSRF_TRUSTED_ORIGINS = CORS_ALLOWED_ORIGINS.copy() if CORS_ALLOWED_ORIGINS_ENV else [
    "http://localhost:3000",
    "http://127.0.0.1:3000",
    "http://localhost:3003",
]
```

### 3. Variables d'Environnement (Backend)

**Fichier :** `/backend/.env`

```bash
# ✅ Configuration CORS
FRONTEND_URL=https://amifond.vercel.app
CORS_ALLOWED_ORIGINS=http://localhost:3000,http://127.0.0.1:3000,http://localhost:3003,https://amifond.vercel.app
```

## 🚀 Déploiement en Production

### Étapes à Suivre

1. **Commiter les changements :**
   ```bash
   cd /Users/awf/Projects/clients/amifond/backend
   git add .
   git commit -m "fix: Résolution problème cookies cross-domain en production"
   git push
   ```

2. **Redéployer le backend sur votre serveur de production**

3. **Vérifier les variables d'environnement en production :**
   - `CORS_ALLOWED_ORIGINS` doit contenir `https://amifond.vercel.app`
   - `FRONTEND_URL=https://amifond.vercel.app`
   - `DEBUG=False` (important pour activer `secure=True` sur les cookies)

4. **Tester après le déploiement :**
   - Vider le cache du navigateur
   - Se connecter depuis `https://amifond.vercel.app`
   - Vérifier dans DevTools > Application > Cookies que :
     - `access_token` et `refresh_token` existent
     - `SameSite=None` et `Secure=true`
     - `Domain=amifond-api.awounfouet.com`

## 🔍 Comment Vérifier que ça Fonctionne

### 1. Vérifier les Cookies dans le Navigateur

1. Ouvrir DevTools (F12)
2. Aller dans **Application** > **Cookies**
3. Sélectionner `https://amifond-api.awounfouet.com`
4. Vérifier que vous voyez :
   ```
   Name: access_token
   Value: eyJ... (votre token)
   Domain: amifond-api.awounfouet.com
   Path: /
   Expires: (date future)
   HttpOnly: ✓
   Secure: ✓
   SameSite: None
   ```

### 2. Vérifier les Requêtes dans Network

1. Ouvrir DevTools > **Network**
2. Se connecter
3. Observer la requête vers `/api/auth/jwt/create/`
4. Dans l'onglet **Response Headers**, vérifier :
   ```
   Access-Control-Allow-Credentials: true
   Access-Control-Allow-Origin: https://amifond.vercel.app
   Set-Cookie: access_token=...; Domain=amifond-api.awounfouet.com; HttpOnly; Secure; SameSite=None
   ```
5. Dans les requêtes suivantes (ex: `/api/auth/users/me/`), vérifier que les **Request Headers** contiennent :
   ```
   Cookie: access_token=...; refresh_token=...
   ```

### 3. Tester avec curl (depuis le terminal)

```bash
# Test de login
curl -X POST https://amifond-api.awounfouet.com/api/auth/jwt/create/ \
  -H "Content-Type: application/json" \
  -H "Origin: https://amifond.vercel.app" \
  -d '{"email":"votre@email.com","password":"votrepassword"}' \
  -c cookies.txt -v

# Test avec le cookie
curl -X GET https://amifond-api.awounfouet.com/api/auth/users/me/ \
  -H "Origin: https://amifond.vercel.app" \
  -b cookies.txt -v
```

## 🐛 Dépannage

### Erreur "Authentication credentials were not provided"

**Causes possibles :**
1. Les cookies ne sont pas définis (vérifier dans DevTools > Application > Cookies)
2. Les cookies ne sont pas envoyés (vérifier dans DevTools > Network > Request Headers)
3. CORS bloque les cookies (vérifier les erreurs CORS dans la console)

**Solutions :**
1. Vider le cache et les cookies du navigateur
2. Vérifier que `withCredentials: true` est bien dans `api-client.ts` (✅ déjà fait)
3. Vérifier les variables d'environnement du backend en production
4. S'assurer que `DEBUG=False` en production

### Les cookies ne sont pas envoyés

**Vérifier :**
1. Le frontend utilise HTTPS (`https://amifond.vercel.app`) ✅
2. Le backend utilise HTTPS (`https://amifond-api.awounfouet.com`) ✅
3. `CORS_ALLOW_CREDENTIALS = True` dans settings.py ✅
4. `withCredentials: true` dans Axios ✅
5. Les cookies ont `Secure=true` et `SameSite=None` ✅

## 📚 Références

- [MDN - SameSite Cookies](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie/SameSite)
- [Django CORS Headers](https://github.com/adamchainz/django-cors-headers)
- [Axios - withCredentials](https://axios-http.com/docs/req_config)

## 📝 Résumé des Fichiers Modifiés

1. `/backend/apps/authentication/api/views.py` - Cookies avec `domain=None`
2. `/backend/config/settings.py` - Headers CORS et CSRF_TRUSTED_ORIGINS
3. `/backend/.env` - Variables CORS (déjà bien configurées)

## ✅ Checklist de Vérification

- [x] Cookies configurés avec `domain=None` en production
- [x] `samesite="None"` et `secure=True` sur les cookies
- [x] `CORS_ALLOW_CREDENTIALS = True` 
- [x] `CORS_ALLOWED_ORIGINS` contient l'URL du frontend Vercel
- [x] `CSRF_TRUSTED_ORIGINS` configuré
- [x] `CORS_ALLOW_HEADERS` inclut tous les headers nécessaires
- [x] Frontend utilise `withCredentials: true`
- [ ] Déployer le backend en production
- [ ] Tester l'authentification depuis Vercel