Comment mettre en cache des ressources statiques à l'aide de la mise en cache HTTP dans Nginx

Comment mettre en cache des ressources statiques à l'aide de la mise en cache HTTP dans Nginx
Être un Nginx Administrateur, vous recherchez toujours de nouvelles méthodes pour améliorer les performances de vos serveurs Web. Cette recherche vous mènera dans une variété de voies, et à la fin, vous serez confus de choisir entre le nombre sans fin de solutions.

Habilitant ressources statiques ou Cache de contenu est une méthode possible pour Nginx optimisation. Chaque fois qu'un navigateur visite un site Web, Nginx décharge la mise en cache de fichiers particuliers tels que les actifs d'images statiques au navigateur Web individuel au lieu de servir chaque fichier. En conséquence, vos sites Web alimentés par Nginx se chargent plus rapidement dans le navigateur.

Dans cet article, vous apprendrez Comment mettre en cache des ressources statiques à l'aide de la mise en cache HTTP dans Nginx. Avant de vous déplacer vers la procédure de mise en cache de contenu statique, comprenez d'abord le concept de base du contenu statique et comment le contenu statique est mis en cache dans Nginx.

Qu'est-ce que le contenu statique

Tout fichier stocké sur un serveur et est servi aux utilisateurs à chaque fois, de la même manière, est connu sous le nom de contenu statique. La fonctionnalité de contenu statique est similaire à un journal. Au fur et à mesure que le journal est publié, tous ceux qui prennent une copie verront les mêmes histoires et photographies toute la journée, quels que soient les nouveaux événements pendant la journée.

Le contenu de la majorité du site Web est basé sur des fichiers statiques pré-formés. Il est peu probable que ces fichiers statiques changent avec le temps et pour les autres utilisateurs également. Par rapport aux fichiers dynamiques générés «à la volée» en fonction des informations de base de données, les fichiers statiques sont les candidats par défaut pour la mise en cache. Des exemples de contenu statique sont les images, la musique, le javascript, les films et les fichiers CSS.

Comment mettre en cache des ressources statiques dans nginx

La méthode typique de la mise en cache Web est d'enregistrer une copie du fichier statique dans un cache. Ce processus permet au contenu statique de se rapprocher de l'utilisateur du site Web et de livrer les ressources statiques plus rapidement la prochaine fois. Le contenu ou les ressources statiques peuvent être mis en cache par les réseaux de livraison de contenu (CDN) et les navigateurs pendant un temps prédéterminé et ont servi aux utilisateurs tant que cette ressource statique est demandée. Comme le contenu statique ne change pas avec le temps, les utilisateurs peuvent recevoir les mêmes fichiers plusieurs fois.

Quels sont les en-têtes de cache HTTP dans nginx

Pour définir des durées de cache et indiquer le contenu Web cacheable, les développeurs Web utilisent En-têtes de cache HTTP. Vous pouvez personnaliser votre stratégie de mise en cache en utilisant différents en-têtes de cache, qui garantissent la fraîcheur de votre contenu ou des ressources statique.

Par exemple, "Cache-Control: Max-Age = 3600"Déclare que le fichier particulier ne peut être mis en cache que une heure après qu'il doit être rechargé à partir de la source. Le marquage séparément du taguage ou du groupe de fichiers peut prendre du temps. En mettant en œuvre des méthodes cognitives capables de remplacer l'en-tête de cache, les CDN modernes vous permettent d'éviter cette pratique.

Maintenant, nous allons vous montrer comment activer la mise en cache statique en utilisant la mise en cache HTTP dans Nginx. Si votre site Web comprend de nombreuses ressources ou contenus statiques, la méthode fournie vous aidera à accélérer le chargement des pages Web. Pour suivre la méthode ci-dessous, vous devriez faire installer et activer Nginx sur votre système.

Comment activer la mise en cache des ressources statiques à l'aide de la mise en cache HTTP dans Nginx

Premièrement, appuyez sur "Ctrl + alt + t”Pour ouvrir le terminal. Après cela, exécutez la commande ci-dessous pour ouvrir le fichier de configuration Nginx dans votre éditeur Nano:

$ sudo nano / etc / nginx / nginx.confli

Nous activons la mise en cache statique dans le fichier nginx par défaut. Si vous avez plusieurs hôtes et sites virtuels, vous devez ajouter les paramètres suivants dans chaque fichier de configuration:

Ajoutez les lignes suivantes pour mettre en cache les ressources statiques telles que les fichiers CSS, les images, les icônes, les fichiers JavaScript:

Emplacement ~ * \.(CSS | gif | jpg | js | png | ico | otf | sng | xls | doc | exe | jpeg | tgx) $
Access_log off;
expire max;

Nous avons ajouté le "Access_log off«Pour désactiver l'accès à se déconnecter de ne pas avoir atteint la limite d'E / S. Tandis que le "expire"L'en-tête comprend les informations liées à la disponibilité du contenu mis en cache dans votre cache de navigateur. "expire" est un En-tête HTTP qui peut être placé dans les blocs présents dans le fichier de configuration tel que le serveur, http , et le emplacement bloc. Habituellement, le «expire”L'en-tête HTTP est ajouté dans le bloc de localisation pour mettre en cache les fichiers statiques:

Maintenant, appuyez sur "Ctrl + o«Pour enregistrer les modifications que nous avons apportées dans le fichier de configuration Nginx:

Exécuter le "nginx«Commande avec le«-t”Option pour tester le Nginx Fichier de configuration et sa syntaxe:

$ sudo nginx -t

Maintenant, redémarrez le nginx en tapant la commande ci-dessous dans votre terminal:

$ sudo systemctl redémarrer nginx

Comment tester la mise en cache des ressources statiques à l'aide de l'en-tête HTTP en direct dans Nginx

Pour votre site Web en cours d'exécution sur un Nginx serveur Web, vous pouvez ajouter l'extension en direct HTTP en direct dans votre navigateur pour tester le processus de mise en cache.

Par exemple, nous ajoutons l'en-tête HTTP en direct à notre navigateur Firefox en cliquant sur le "Ajouter à Firefox" bouton:

Autoriser l'en-tête HTTP en direct pour accéder au site Web et aux données liées au navigateur:

Ensuite, ouvrez votre site Web pour lequel vous avez activé la mise en cache de contenu statique dans son fichier de configuration, et vous verrez que HTTP En-tête affiche toutes les informations liées aux ressources de cache:

Vous pouvez également appuyer sur "Ctrl + shift + i”Pour ouvrir les outils du développeur. Charge votre site Web à quelques reprises, et vous remarquerez que la vitesse de chargement Web est bien améliorée car la plupart des ressources sont mises en cache lors de la première charge de la page Web:

Conclusion

Sur un site Web, le contenu statique est un type de contenu qui ne change pas entre les pages Web. Si votre site Web comprend des ressources ou du contenu statiques, vous pouvez améliorer ses performances en permettant la mise en cache, qui stocke le contenu statique pour un accès plus rapide dans le navigateur. Dans cet article, nous avons expliqué ce contenu statique est, Comment fonctionne la mise en cache statique dans Nginx, et tu peux Cache Ressources ou contenu statiques à l'aide de la mise en cache HTTP dans Nginx. De plus, nous avons également démontré comment pour tester la mise en cache des ressources statiques à l'aide de l'en-tête http en direct.