Forcer l'actualisation du navigateur : invalidation du cache pour CSS et JavaScript

Lors du développement de sites Web, il est frustrant de rencontrer des problèmes de mise en cache du navigateur qui empêchent les mises à jour immédiates. se reflétant sur l’écran. Cela peut entraîner de la confusion et une perte de temps. Heureusement, il existe des méthodes pour forcer l'actualisation du navigateur et garantir que le code modifié est appliqué rapidement.

Solution générale

La solution la plus efficace est une actualisation matérielle du navigateur, obtenue en appuyant sur Ctrl Shift R ou Cmd Shift R sur un Mac. Cela contourne le contenu mis en cache et récupère de nouvelles données du serveur.

PHP

Pour les sites Web basés sur PHP, un script PHP peut être modifié pour désactiver la mise en cache. Cela peut être fait en définissant l'en-tête d'expiration sur une date passée, marquant ainsi le contenu comme expiré :

header("Expires: Tue, 01 Jan 2000 00:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

Chrome

Google Chrome propose une option dans ses outils de développement pour désactiver la mise en cache. Pour y accéder, appuyez sur F12, cliquez sur l'icône d'engrenage et sélectionnez "Désactiver le cache" dans la boîte de dialogue des paramètres.

Firefox

Dans Firefox , saisissez about:config dans la barre d'URL et localisez la préférence intitulée network.http.use-cache. Définissez cette valeur sur false pour désactiver la mise en cache du navigateur.