Comment vider le cache des fichiers statiques Laravel (méthode détaillée)

Lors du développement d'un site Web ou d'une application à l'aide de Laravel, les fichiers statiques sont souvent utilisés pour améliorer les performances et l'expérience utilisateur du site Web. Ces fichiers statiques incluent généralement du CSS, du JavaScript, des images, des polices, etc. Cependant, au cours du processus de développement, nous rencontrons souvent des situations dans lesquelles le navigateur utilise toujours le fichier original mis en cache après avoir modifié le fichier statique, ce qui entraîne des problèmes avec le site Web. Ainsi, dans cet article, nous parlerons des méthodes de suppression du cache pour les fichiers statiques Laravel afin que vous puissiez voir l'effet immédiatement après la modification des fichiers statiques.

Principe

Tout d’abord, voyons comment les navigateurs mettent en cache les fichiers statiques. Le navigateur crée un identifiant (ETag) pour la demande de fichier statique, puis enregistre cet identifiant dans le cache avec le fichier statique. Chaque fois que le navigateur demande à nouveau le même fichier, il envoie au serveur un identifiant pour le fichier et utilise cet identifiant pour valider le cache. Si les identifiants correspondent, le navigateur extraira le fichier du cache.

Bien que la mise en cache du navigateur soit effectuée localement sur l'ordinateur de l'utilisateur, dans une application Laravel, nous pouvons interférer avec la mise en cache du navigateur en modifiant l'URL des fichiers statiques ou en ajoutant d'autres paramètres de requête. Cela signifie que chaque fois qu'un fichier statique est modifié, nous pouvons modifier son URL ou ajouter des paramètres de requête pour garantir que le navigateur obtienne le nouveau fichier au lieu d'utiliser l'ancien fichier mis en cache.

Ensuite, nous verrons comment y parvenir.

Méthode de suppression du cache des fichiers statiques Laravel

Méthode 1 : modifier manuellement l'URL ou ajouter des paramètres de requête

La modification manuelle de l'URL du fichier statique ou l'ajout de paramètres de requête est une méthode simple de suppression du cache. Par exemple, lors du référencement d'un fichier CSS, nous pouvons changer son URL en :

<link rel="stylesheet" href="style.css?v=1">

Cela indiquera au navigateur d'ajouter ?v=1 comme paramètre de requête lors de la demande du fichier. Si nous voulons mettre à jour le fichier, nous pouvons changer le paramètre de requête en ?v=2 ou toute autre valeur. Chaque fois qu'un fichier est modifié, l'URL doit être mise à jour ou de nouveaux paramètres de requête ajoutés. ?v=1 作为查询参数。如果我们想更新文件，可以将查询参数更改为 ?v=2 或任何其他值。每次修改文件时，都需要更新 URL 或添加新的查询参数。

尽管这种方法相对简单，但需要手动更新每个文件的 URL 或添加查询参数，非常费时费力。

方法二：使用 Mix 和版本控制

Laravel Mix 是 Laravel 的一个前端构建工具，它允许您使用许多流行的前端工具来编译、压缩和打包 CSS、JavaScript、图片和字体等文件。Mix 可以帮助您自动生成静态文件 URL，并在每次构建时更改版本号，以确保浏览器获取最新的文件。

要使用 Mix，我们需要先安装 Laravel Mix：

npm install laravel-mix --save-dev

然后，在 webpack.mix.js 文件中定义静态文件和版本：

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css')
   .version();

运行 npm run dev 或 npm run prod 可以生成具有版本号的文件。例如，如果我们编译 app.css 文件，它将生成 app.css?id=48d24b 文件，其中 48d24b 是文件的哈希值。每次修改文件时，Laravel Mix 将使用新的哈希值生成新的版本。

要在 HTML 文件中使用 Mix 生成的静态文件 URL，可以使用以下代码：

<link rel="stylesheet" href="{{ mix(&#39;css/app.css&#39;) }}">

这会自动将文件名转换为带有版本号的文件名。例如，如果我们运行 npm run prod，则上面的代码将生成以下结果：

<link rel="stylesheet" href="/css/app.css?id=48d24b">

通过使用 Laravel Mix，我们无需手动更改文件的 URL 或添加查询参数。Laravel Mix 将自动为我们生成新的版本号，并更改静态文件的 URL。

方法三：使用缓存清除中间件

Laravel 缓存清除中间件允许我们在每次请求时清除浏览器缓存。要使用缓存清除中间件，我们可以在 app/Http/Middleware/CacheControl.php 中创建以下代码：

<?php

namespace App\Http\Middleware;

use Closure;

class CacheControl
{
    public function handle($request, Closure $next)
    {
        $response = $next($request);

        $response->header('Cache-Control', 'nocache, no-store, max-age=0, must-revalidate');
        $response->header('Pragma', 'no-cache');
        $response->header('Expires', 'Fri, 01 Jan 1990 00:00:00 GMT');

        return $response;
    }
}

然后，在 app/Http/Kernel.php

Bien que cette méthode soit relativement simple, elle nécessite de mettre à jour manuellement l'URL de chaque fichier ou d'ajouter des paramètres de requête, ce qui est très chronophage et laborieux.

Méthode 2 : Utilisation du mixage et du contrôle de version

Laravel Mix est un outil de construction frontal pour Laravel, qui vous permet d'utiliser de nombreux outils frontaux populaires pour compiler, compresser et empaqueter des fichiers tels que CSS, JavaScript. , images et polices. Mix peut vous aider à générer automatiquement des URL de fichiers statiques et à modifier le numéro de version à chaque version pour garantir que le navigateur obtient les derniers fichiers.

Pour utiliser Mix, nous devons d'abord installer Laravel Mix :

protected $middleware = [
    // ...
    \App\Http\Middleware\CacheControl::class,
];

Ensuite, définissez les fichiers statiques et les versions dans le fichier webpack.mix.js : 🎜rrreee🎜Exécutez npm run dev ou npm run prod peut générer un fichier avec un numéro de version. Par exemple, si nous compilons le fichier app.css, il générera le fichier app.css?id=48d24b, où 48d24b est le hachage de la valeur du fichier. Chaque fois qu'un fichier est modifié, Laravel Mix générera une nouvelle version avec une nouvelle valeur de hachage. 🎜🎜Pour utiliser les URL de fichiers statiques générés par Mix dans des fichiers HTML, vous pouvez utiliser le code suivant : 🎜rrreee🎜Cela convertira automatiquement le nom de fichier en un nom de fichier avec un numéro de version. Par exemple, si nous exécutons npm run prod, le code ci-dessus générera les résultats suivants : 🎜rrreee🎜En utilisant Laravel Mix, nous n'avons pas besoin de modifier manuellement l'URL du fichier ou d'ajouter une requête paramètres. Laravel Mix générera automatiquement un nouveau numéro de version pour nous et modifiera l'URL des fichiers statiques. 🎜🎜Méthode 3 : Utiliser le middleware de suppression du cache🎜🎜Le middleware de suppression du cache Laravel nous permet de vider le cache du navigateur à chaque demande. Pour utiliser le middleware de contournement de cache, nous pouvons créer le code suivant dans app/Http/Middleware/CacheControl.php : 🎜rrreee🎜Ensuite, dans app/Http/Kernel.php Enregistrez le middleware dans : 🎜rrreee🎜Désormais, chaque fois que le navigateur demandera un fichier statique, il enverra une nouvelle requête au serveur au lieu d'utiliser le cache, garantissant ainsi que nous obtiendrons toujours le dernier fichier. 🎜🎜Résumé🎜🎜En modifiant manuellement l'URL des fichiers statiques ou en ajoutant des paramètres de requête, en utilisant Laravel Mix ou en utilisant un middleware de suppression du cache, nous pouvons effacer efficacement les fichiers de cache dans les applications Laravel et garantir que les utilisateurs voient toujours le contenu le plus récent. 🎜🎜 Essayez différentes méthodes et choisissez celle qui correspond le mieux à vos besoins pour gérer la suppression du cache des fichiers statiques. Quelle que soit la méthode que vous utilisez, vous devez toujours être conscient de l’impact de la mise en cache pour garantir que votre site Web conserve toujours de bonnes performances et une bonne expérience utilisateur. 🎜

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!