Blog

Cache busting avec CakePHP

Durant le développement, ou lors des mises en ligne de vos applications il est courant de rencontrer des problèmes de gestion du cache du navigateur.

Il existe plusieurs solutions pour mettre en cache vos assets. Avec Apache par exemple, vous pouvez utiliser les fichiers .htaccess pour déterminer la durée de mise en cache pour chaque type de fichiers, utiliser les ETag, ou en utilisant le cache-control.

Bien sûr en contre partie le vidage du cache des navigateurs est plus difficile à obtenir lors des modifications des fichiers.
Il existe une solution (parmi d’autres) pour éviter ce désagrément, on va donc utiliser une méthode que l’on appelle « cache busting » (ou vidage de cache)  et qui permet de vider du cache un fichier modifié tout en laissant le reste du cache intact. Et c’est là que le timestamp sur les assets rentre en jeu..

En effet en suffixant le fichier avec un timestamp de la dernière modification, le navigateur verra le fichier avec un timestamp différent comme un nouveau fichier.

Après cette petite introduction, je vais vous montrer comment CakePHP va nous permettre facilement de mettre en place cette solution.

La classe Helper de CakePHP contient une méthode publique qui permet devinez quoi ? de timestamper un asset !

En effet l’api de CakePHP nous dit à propos de Helper::assetTimestamp() :

 

Adds a timestamp to a file based resource based on the value of Asset.timestamp in Configure.

 

Donc il suffit d’écrire de dé-commenter une ligne pour appliquer le suffixe à tous nos assets (css/js/image), car le HtmlHelper étend de la class Helper, et utilise la méthode assetUrl(), qui elle même utilise la méthode assetTimestamp(). Si vous n’avez pas suivi la dernière phrase, pour faire simple si vous incluez vos assets via le HtmlHelper, le « suffixage » de vos fichiers se fera à partir du moment où vous dé-commentez la ligne ci-dessous (L~185) dans core.php
Configure::write('Asset.timestamp', true);
Par défaut « Asset.timestamp » à pour valeur true, ce qui aura pour effet que le suffixage ne se fera uniquement lorsque la valeur de debug est supérieur à 0, avouez que c’est ennuyeux lorsque vous déployez un fichier .css, ou .js modifié et que la modification n’est visible qu’après un vidage de cache du navigateur (ce que font rarement les visiteurs d’un site).

Heureusement les développeurs de CakePHP ont pensé à tout, ainsi en passant la clé « force » à Asset.timestamp, vous aurez également l’ajout du timestamp  en debug 0, et ainsi envolés les soucis de gestion de cache navigateurs.