web-dev-qa-db-fra.com

Pourquoi le serveur ignore-t-il les modifications des fichiers de code alors que le cache est désactivé?

Je teste un code html/js sur mon hôte local (Windows 7, Chrome v79.0.3945.130 (64 bits)) et environ 50% des changements de code temporel ne sont pas reflétés dans le navigateur (Je le vois avec Dev Tools/Sources).
Il existe une tonne de conseils sur Internet, mais aucun ne semble fonctionner:

  • Faites un clic droit sur le rechargement et choisissez "Cache vide et rechargement dur" - n'aide pas dans 30% des cas.
  • Désactivez le cache dans l'onglet Réseau des outils de développement Chrome Dev - n'aide pas.
  • Ajouter <meta http-equiv="Cache-control" content="no-cache"> dans l'en-tête - n'aide pas.
  • Remplacer <script src="common.js"></script> par <script src="common.js?blabla"></script> - aide dans 60% des cas, mais vous devez le faire après chaque changement est une énorme corvée. De plus, cela ne fonctionne pas avec les modifications html.
  • Copiez un fichier dans un nouveau fichier (comme index.html vers index2.html) et remplacez le nom de fichier dans le code - ça marche toujours, mais c'est une corvée encore plus grande.

Le même problème exactement présent lorsque je valide le code dans github.io

S'il vous plaît, aidez-moi à faire en sorte que le site reflète immédiatement les changements de code.

Edit: j'ai créé un fichier index3.html et n'y ai mis que "hello world". Ouvert le fichier dans le navigateur. Changé en "hello world2" - le navigateur a mis à jour le contenu. Changé en "hello world3" - le navigateur montrait toujours "hello world2" même après plusieurs rechargements et "Cache vide et rechargement dur". J'ai changé pour "hello world4" - le navigateur montrait toujours "hello world2". En 4 heures, je suis passé à "hello world5" - le navigateur affiche toujours "hello world2". Ce fichier que j'ai édité avec le bloc-notes de base.

Edit2: Les gens demandent toujours quel serveur j'utilise. Cela ressemble à une partie du problème. Malheureusement, je ne sais pas et je ne sais pas non plus exactement ce que je dois faire pour le vérifier. Voici tout ce que j'ai découvert jusqu'à présent:

  • J'ai inetpub/wwwroot répertoire dans lequel je place les fichiers html et js, puis j'ouvre index.html dans un navigateur à http://localhost/.
  • Mon panneau Réseau dans Devs Tools ressemble à ceci: lien image .
  • La configuration du serveur était très rapide et ne nécessitait aucun logiciel supplémentaire à installer. C'est à dire. Je n'utilise pas node.js.
  • Il y a iisstart.htm à inetpub/wwwroot et quand j'ouvre http://localhost/iisstart.htm il indique IIS7.
javascripthtmlserverbrowser-cache
14
klm123

Utiliser un paramètre est la bonne façon! Ici, vous pouvez ajouter un numéro de version que vous modifiez uniquement lors de modifications importantes manuellement et pour le débogage, vous pouvez le définir sur Date.time () donc dans votre balise <head>, cela force toutes les versions mises en cache à être écrasées car le paramètre est toujours un nouveau une:

< script type="text/javascript"> 
    var script = document.createElement('script'); 
    var version = Date.time();
    script.src = "common.js?v="+version; 
    document.head.appendChild(script) 
< /script>

J'espère que cela t'aides!

6
lehm.ro

Dans le serveur Windows IIS7 fonctionnant sous Windows 7, pour empêcher la mise en cache de votre contenu, vous devez apporter quelques modifications à l'un de vos fichiers de configuration appelé web.config. Les fichiers de configuration pour IIS 7 et versions ultérieures sont situés dans %WinDir%\System32\Inetsrv\Config folder où %WinDir% est le dossier dans lequel vous avez installé Windows (généralement C:/Windows).

Créez une copie de sauvegarde de votre web.config fichier avant de le modifier pour pouvoir y revenir si les modifications que vous apportez au fichier le cassent.

Dans votre web.config fichier, ajoutez simplement ce qui suit pour empêcher la mise en cache de votre index.html:

<?xml version="1.0" encoding="UTF-8"?>
<configuration>

  <location path="index.html">
    <system.webServer>
      <httpProtocol>
        <customHeaders>
          <add name="Cache-Control" value="no-cache" />
        </customHeaders>
      </httpProtocol>
    </system.webServer>
  </location>

</configuration>

Vous avez le chemin du fichier pour le web.config fichier d'ici: Windows Doc: référence de configuration

Vous avez la configuration pour le cache ci-dessus à partir d'ici: Comment désactiver la mise en cache du fichier HTML d'application d'une seule page servi via IIS?

3
AndrewL64

J'ai eu le même problème et voici ma liste de contrôle:

  1. Cochez web.config (cache et clientcache, politique de cache du noyau, etc.) ou . Htaccess (Ensemble d'en-tête Cache-Control).
  2. Si vous avez utilisé des langages dynamiques comme ASP, PHP il pourrait y avoir un paramètre de cache interne. Dans un cas, j'ai trouvé <%Response.Expires=1440%> dans de nombreuses lignes de ASP et il surmontait tous les autres paramètres! En php session_cache_expire mai fait de même.
  3. Si vous utilisez IIS alors vérifiez le serveur> en-têtes de réponse HTTP pour vous assurer que la mise en cache n'a rien de la même pour les sites Web individuels répertorié sous le nom du serveur.
  4. vérifier http-equiv="Cache-control" dans les en-têtes html (vous avez réussi ce test!).

Enfin, je dois dire que dans toutes les situations ci-dessus, la vérification Désactiver le cache dans newtwork tab dans Chrome Chrome a toujours fonctionné pour moi pour afficher un nouvelle version des pages mais cela n'est bon qu'à des fins de débogage et les visiteurs ne le feront pas!

1
Ali Sheikhpour

Chrome fait cette chose où, si le fichier n'a pas trop changé, ne sachant pas ce que cela signifie, il utilisera la version de cache "compilée". Pour html, cela signifie arbre de don analysé. Pour le code précompilé JS, etc.

Il existe généralement des moyens de résoudre ce problème, de nombreux frameworks utilisent le hachage à l'intérieur des noms de fichiers, comme: main.md5hash.js, car la modification du nom de fichier invalide tout cache.

Ensuite, vous serez laissé avec éventuellement html pas de mise à jour. Et pour être clair, je ne suis pas sûr, vous pouvez toujours ajouter un commentaire avec un blob aléatoire ... comme une date.

0
Akxe

Sur la base des mises à jour de votre réponse, je dirais que votre problème est dû à IIS v7 qu'il utilise votre PC Mémoire pour mettre en cache pas votre disque dur local c'est pourquoi Hard reload et toutes les autres méthodes semblent ne pas fonctionner correctement.

Je pourrais penser à 3 solutions:

1. Correction de votre IIS: (Non testé en raison du fait que je n'ai pas de PC avec IIS)

  1. Dans le menu Démarrer , cliquez sur Outils d'administration , puis sur Gestionnaire des services Internet (IIS). (voir Images )
  2. Dans l'arborescence du côté gauche , recherchez votre application.
  3. Sélectionnez l'élément de menu Mise en cache de sortie .
  4. Cliquez sur Ajouter une règle de cache puis saisissez le fichier extensions sur lequel vous souhaitez désactiver le cache, c'est-à-dire .aspx, .css, .js etc ... (un à la fois je suppose?)
  5. Maintenant, vous pouvez soit décocher la mise en cache en mode utilisateur ou vérifier empêcher toute mise en cache. Il devrait ressembler à ceci:

enter image description here

Source de la solution - En savoir plus sur Cache IIS 7

2. Utilisation de certaines alternatives à IIS Il y en a plusieurs mais je recommanderais (en fonction de mes expériences) WAMP ou - XAMPP Les deux vous offriront un meilleur "environnement" de développement et les deux prennent en charge Windows 7. De plus, si vous connaissez VS Code vous pouvez simplement utiliser l'extension Live Server .

3. Utilisez le mode Chrome Incognito pendant le développement. (Je ne sais pas si cela fonctionne pour IIS7)

0
awran5

Dans le cas spécifique de l'utilisation de Google Chrome, essayez ceci: Ouvrez Dev Tools -> Go to 'Network' tab. Cochez la case "Désactiver le cache", après cela actualisez la page.

REMARQUE: pour que cela fonctionne à chaque fois, la fenêtre Dev Tools DOIT rester ouverte à tout moment.

enter image description here

Cependant, afin de propager les modifications à vos utilisateurs, sans les obliger à actualiser en dur la page, etc., vous devez ajouter des versions de fichiers à la fin de chaque fichier référencé pour les fichiers qui changent fréquemment (comme vous l'avez souligné). Par exemple:

<link rel="stylesheet" type="text/css" href="https://cdn.sstatic.net/Sites/stackoverflow/primary.css?v=20b379f72a37" >

Le v=20b379f72a37 ajouté à la fin est un hachage de fichier généré automatiquement du contenu du fichier.

0
Martin Shishkov

C'est un long plan - mais quel type d'éditeur/IDE utilisez-vous? En outre, quel type de modifications apportez-vous à votre index.html?

Pourriez-vous fournir des exemples de telles modifications qui ne se reflètent pas lorsque vous enregistrez et essayez de charger le fichier?

Je voudrais essayer de reproduire votre problème. D'après ce que les gens suggèrent, il ne semble pas que le problème soit dans le code lui-même. Je soupçonne que c'est un problème environnemental mais j'aurais besoin de plus d'informations de votre part pour confirmer mes soupçons.

0
foreza

C'est probablement très frustrant et cela ne ressemble pas à ce que vous faites de mal.

Le problème est probable que quelque chose entre votre navigateur et le fichier de script que vous appelez effectue une mise en cache.

Pour déterminer de quoi il s'agit, permettez-moi de vous demander comment vous accédez à l'URL localhost?

Exemples:

file://path/to/file.html
http://localhost/file.html
http://127.0.0.1/file.html
http://[machine's-hostname]/file.html
http://[custom-domain-defined-in-hosts-file]/file.html

Si vous exécutez file://path/to/file.html cela signifie que vous ne parcourez pas un serveur Web/proxy. Si c'est http://[something]/file.html alors vous utilisez une sorte de serveur web et c'est probablement le coupable. Recherchez une sorte de paramètre où vous pouvez désactiver la mise en cache.

Si vous n'utilisez pas de serveur Web et que vous naviguez littéralement directement vers un fichier html local sans serveur Web, je dirais que le navigateur est le coupable. Si tel est le cas, je suggère de désactiver la mise en cache du navigateur comme Martin Shishkov suggéré.

0
Dean Householder

Ce que vous écrivez en méta HTML est une recommandation aux navigateurs, pas une instruction stricte. Si la mise en cache stricte est activée dans le navigateur, cela n'aidera pas.

Les solutions sont bien décrites: https://curtistimson.co.uk/post/front-end-dev/what-is-cache-busting/

Je préfère côté serveur ajouter aux scripts la version avec la date de la dernière mise à jour du fichier lui-même.

<script src="/myScript.js?v=1579780745150"></script>

Où 1579780745150 est l'horodatage Unix met à jour le fichier myScript.js lui-même. Il ne fonctionne qu'avec ses propres fichiers, mais les fichiers externes ne sont pas nécessaires. Le plus souvent dans le nom de fichier est la version.

0
Aleksandr Smityukh