Comment configurer le cache de négociation du navigateur basé sur nginx

La différence entre le cache fort et le cache négocié

Cache fort : le navigateur accède directement au cache du navigateur sans négocier avec le serveur

#🎜🎜 # Négocier le cache : le navigateur confirmera d'abord la validité de la ressource auprès du serveur avant de décider s'il doit récupérer la ressource du cache ou réobtenir la ressource #

Il existe maintenant un scénario commercial comme celui-ci : le retour. -end les ressources statiques seront mises à jour de temps en temps, et comme le navigateur utilise une mise en cache renforcée par défaut, les ressources obsolètes seront récupérées par défaut dans le cache du navigateur.

Nous espérons maintenant que le navigateur confirmera avec le backend si la ressource est mise à jour à chaque fois qu'il obtient la ressource. Nous devons configurer le navigateur pour qu'il utilise le cache de négociation Donc. comment le backend détermine-t-il la ressource ? A-t-elle été mise à jour ? À ce stade, les en-têtes de réponse etag et last-modified seront utilisés.

Chaque fois qu'une demande de ressource statique est reçue, le backend mettra l'heure de la dernière modification (dernière modification) de la ressource et l'étiquette calculée en fonction du contenu de la ressource dans l'en-tête de réponse au l'extrémité avant.

Une fois que le front-end a reçu la réponse, il met en cache ces deux éléments, puis la prochaine fois qu'il demande la même ressource, il met le contenu de ces deux éléments dans if-modified-since et if -aucun élément correspondant dans l'en-tête de la demande.

Une fois que le serveur aura reçu ces deux éléments, il les comparera avec l'etag et la dernière modification actuellement générés par la ressource. Si les deux sont cohérents, cela signifie que la ressource n'a pas été mise à jour, et le. le serveur renverra une réponse vide 304 ; Sinon, cela signifie que la ressource a été mise à jour et le serveur renverra le contenu complet de la ressource ? C'est en fait très simple. Utilisez simplement nginx comme serveur pour les ressources statiques et ajoutez cache-control:no-cache à l'en-tête de réponse.

Implémentons-le étape par étape

1. Utilisez nginx comme serveur pour les ressources statiques

Dans la configuration de nginx, les ressources statiques seront be La requête est mappée sur le chemin disque de la ressource

http {
  server {
  listen 80;
  ...
  location /picture/ {
    alias d:/luozixi/tcp_test/picture/;
    # alias是重定义路径
    # 比如访问127.0.0.1/picture/1_new.gif，则会映射为访问d:/luozixi/tcp_test/picture/1_new.gif
    # web应用根本不会收到请求，picture的请求都被nginx处理了
    # alias是替换，root是拼接
    autoindex on;
    # 访问127.0.0.1/picture/，会得到目录的索引界面
    }
  }
}

2. Rechargez la configuration nginx

nginx -s reload

3. À ce moment, nginx l'ajoutera automatiquement à la réponse en-tête lors de la demande de ressources statiques Ajoutez etag et last-modified

　

　 4. Mais j'ai ensuite découvert que si cache-contrl: no-cache n'était pas configuré, le navigateur Lors de la demande de cette ressource, la demande ne sera pas envoyée au backend, mais la ressource sera obtenue directement à partir du cache

　5. Configurer dans nginx

location /picture/ { 
  add_header cache-control no-cache;
  alias d:/luozixi/tcp_test/picture/; 
}

6. Effacez le navigateur Lorsque vous lancez une requête pour la première fois après la mise en cache, vous obtiendrez une réponse normale de 200 et l'en-tête de réponse a déjà cache-control: no-cache, indiquant que la mise en cache négociée est utilisée

# 🎜🎜#　7. Une fois la demande réinitialisée, vous constaterez que l'en-tête de la demande contient if-modified-depuis et if-none-match

　

#🎜 🎜#　8. Le serveur (nginx) reçoit Après ces deux éléments, ils seront comparés à l'etag et à la dernière modification actuellement générés par la ressource. Si les deux sont cohérents, cela signifie que la ressource n'a pas été mise à jour, et le serveur. renverra une réponse 304 vide ; sinon, cela signifie que la ressource a été mise à jour et le serveur terminera. Le contenu de la ressource renvoie

De plus, la façon dont le serveur vérifie si-modifié-depuis est simplement une simple comparaison de chaînes. Même si la dernière modification de la ressource est antérieure à si-modifiée-depuis, le serveur considère toujours la ressource mise à jour

　9. Après avoir reçu la réponse 304, le navigateur récupérera. ressources du cache du navigateur. Par conséquent, la vitesse est très rapide.

　-le cache signifie ne pas mettre en cache les ressources expirées. Le cache confirmera le traitement effectif avec le serveur puis traitera les ressources.

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!