# Guide - Gestion du Cache Browser (Asset Versioning)

## 🎯 Problème

Les navigateurs des utilisateurs mettent en cache les fichiers CSS/JS. Quand vous modifiez le code JavaScript ou CSS, les utilisateurs continuent à voir l'ancienne version jusqu'à ce qu'ils vident leur cache manuellement.

## 💡 Solution : Asset Versioning

Ajouter un paramètre de version (`?v=20251112121830`) aux URLs des assets pour forcer le rechargement.

### Exemple

**Avant** (cache persistant)
```blade
<script src="{{ url('./js/filter.min.js') }}"></script>
```

**Après** (cache contrôlé)
```blade
<script src="{{ url('./js/filter.min.js') }}?v={{ env('ASSET_VERSION') }}"></script>
                                           ↑
                                   Version timestamp
```

Quand la version change, les navigateurs téléchargent automatiquement la nouvelle version.

## 📝 Configuration Actuelle

### Variable d'environnement (.env)

```env
# Asset versioning for cache busting
ASSET_VERSION=20251112121830
```

**Format** : `YYYYMMDDHHmmss` (année, mois, jour, heure, minute, seconde)

### Fichiers utilisant le versioning

| Fichier Blade | Assets versionnés |
|---------------|-------------------|
| `list.blade.php` | `list.css`, `filter.min.js` |
| `single.blade.php` | `single.css`, `single.min.js` |
| `home.blade.php` | `index.css`, `index.min.js` |
| `contact.blade.php` | `contact.css`, `contact.min.js` |
| `maison.blade.php` | `maison.css`, `service.min.js` |
| `expatries.blade.php` | `expatries.css` |
| `about_us.blade.php` | `about.css` |
| `valuationThankyou.blade.php` | `thankyou_valuation.css` |

## 🚀 Comment Mettre à Jour la Version

### Option 1 : Manuellement (Rapide)

```bash
# 1. Modifier la version dans .env
nano .env

# Changer:
ASSET_VERSION=20251112121830
# En:
ASSET_VERSION=20251112123000  # Nouvelle timestamp

# 2. Vider le cache Laravel
php artisan config:clear
php artisan cache:clear
php artisan view:clear
```

### Option 2 : Script Automatique (Recommandé)

Créer un alias dans votre shell :

```bash
# Ajouter dans ~/.bashrc ou ~/.bash_aliases
alias bump-assets='cd /var/www/html && sed -i "s/ASSET_VERSION=.*/ASSET_VERSION=$(date +%Y%m%d%H%M%S)/" .env && php artisan config:clear && php artisan cache:clear && php artisan view:clear && echo "✅ Asset version updated to $(grep ASSET_VERSION .env | cut -d= -f2)"'
```

Puis utiliser :
```bash
bump-assets
```

### Option 3 : Intégré dans le Déploiement

Le fichier `deploy.sh` gère déjà automatiquement le versioning :

```bash
# Extrait de deploy.sh (lignes 143-170)
CURRENT_VERSION=$(grep "ASSET_VERSION=" .env | cut -d'=' -f2)
NEW_VERSION=$(date +%Y%m%d%H%M%S)
sed -i "s/ASSET_VERSION=$CURRENT_VERSION/ASSET_VERSION=$NEW_VERSION/" .env
```

Donc après chaque déploiement, la version est automatiquement incrémentée ! ✅

## 🔄 Workflow Complet

### Lors du Développement

1. **Modifier le JS/CSS**
   ```bash
   # Exemple: modifier resources/js/pages/jquery.filter.js
   nano resources/js/pages/jquery.filter.js
   ```

2. **Compiler les assets**
   ```bash
   npm run production
   ```

3. **Mettre à jour la version**
   ```bash
   bump-assets
   # OU
   sed -i "s/ASSET_VERSION=.*/ASSET_VERSION=$(date +%Y%m%d%H%M%S)/" .env
   php artisan config:clear && php artisan cache:clear
   ```

4. **Tester dans le navigateur**
   - Ouvrir la page en mode Incognito ou vider le cache (Ctrl+Shift+Delete)
   - Vérifier l'URL du JS : `filter.min.js?v=20251112123000`
   - Vérifier que la modification est visible

5. **Commiter**
   ```bash
   git add public/js/filter.min.js resources/js/pages/jquery.filter.js
   git commit -m "fix: Correction dans filter.min.js"
   git push
   ```

### En Production

Le script `deploy.sh` gère tout automatiquement :

```bash
./deploy.sh
# ↓
# 1. Pull du code
# 2. Compile les assets (npm run production)
# 3. Incrémente ASSET_VERSION automatiquement
# 4. Vide les caches Laravel
# ↓
# ✅ Les utilisateurs reçoivent la nouvelle version immédiatement
```

## 📊 Vérification

### Vérifier la version actuelle

```bash
grep ASSET_VERSION .env
# Output: ASSET_VERSION=20251112121830
```

### Vérifier que la version est utilisée

```bash
# Dans le navigateur, inspecter la page
# Chercher les balises <script> et <link>
# Exemple:
# <script src="https://staging.expertissimmo.eu/js/filter.min.js?v=20251112121830"></script>
```

### Tester le cache busting

```bash
# Avant changement
curl -I "https://staging.expertissimmo.eu/js/filter.min.js?v=20251112121830"
# HTTP/1.1 200 OK
# ETag: "5f8a2b3c"

# Après changement de version
curl -I "https://staging.expertissimmo.eu/js/filter.min.js?v=20251112123000"
# HTTP/1.1 200 OK (nouveau fichier téléchargé)
```

## ⚠️ Important

### NE PAS commiter le .env

Le fichier `.env` est dans `.gitignore` et ne doit **jamais** être commité car il contient :
- Des tokens API sensibles
- Des mots de passe de base de données
- Des clés de chiffrement

**Chaque environnement a son propre .env** :
- **Staging** : `/var/www/html/.env` sur le serveur staging
- **Production** : `/var/www/html/.env` sur le serveur production
- **Local** : `.env` sur votre machine de développement

### Synchronisation des Versions

Après un déploiement, vérifier que la version a bien été mise à jour :

```bash
# SSH sur le serveur
ssh user@staging.expertissimmo.eu

# Vérifier la version
cd /var/www/html
grep ASSET_VERSION .env

# Si besoin, mettre à jour manuellement
bump-assets
```

## 🎨 Personnalisation

### Changer le Format de Version

Si vous préférez un format différent :

**Version sémantique** (ex: 1.2.3)
```bash
ASSET_VERSION=1.2.3
```

**Version commit hash** (ex: abc1234)
```bash
ASSET_VERSION=$(git rev-parse --short HEAD)
```

**Version timestamp Unix** (ex: 1699804800)
```bash
ASSET_VERSION=$(date +%s)
```

### Ajouter des Assets Non Versionnés

Si vous ajoutez un nouveau fichier JS/CSS, n'oubliez pas d'ajouter le versioning :

```blade
<!-- AVANT (pas de versioning) -->
<script src="{{ url('./js/nouveau-fichier.js') }}"></script>

<!-- APRÈS (avec versioning) ✅ -->
<script src="{{ url('./js/nouveau-fichier.js') }}?v={{ env('ASSET_VERSION') }}"></script>
```

## 📚 Ressources

- [Laravel Cache Busting](https://laravel.com/docs/10.x/mix#versioning-and-cache-busting)
- [Browser Caching Best Practices](https://developer.mozilla.org/en-US/docs/Web/HTTP/Caching)
- [HTTP Cache Headers](https://web.dev/http-cache/)

## 🔍 Debugging

### Problème : Les changements ne s'affichent pas

**Solutions** :
1. Vérifier que `ASSET_VERSION` a changé dans `.env`
2. Vider les caches Laravel : `php artisan config:clear && php artisan cache:clear`
3. Recompiler les assets : `npm run production`
4. Tester en mode Incognito
5. Vérifier l'URL du fichier JS dans le code source de la page

### Problème : Les fichiers compilés sont corrompus

```bash
# Nettoyer et recompiler
rm -rf node_modules public/js/* public/css/*
npm install
npm run production
```

### Problème : Le cache du serveur Nginx/Apache

Si vous avez un cache serveur (Nginx FastCGI, Varnish, etc.) :

```bash
# Nginx
sudo nginx -s reload
sudo systemctl restart nginx

# Vider le cache applicatif si présent
redis-cli FLUSHALL  # Si Redis cache
```

---

**Date de création** : 2025-11-12  
**Dernière mise à jour** : 2025-11-12  
**Version** : 1.0