Comment forcer le débogueur de script Chrome à recharger le javascript?

J’aime vraiment la possibilité de modifier javascript dans le débogueur de chrome, mais je trouve que le débogueur peut récupérer le code JavaScript du serveur.

Parfois, je dois aller aussi loin que fermer le débogueur et recharger le cadre fonctionne correctement – mais d’autres fois (un dI ne peut pas déterminer dans quelles conditions cela se produit) je dois effacer mon cache Internet temporaire. Parfois, je jure que je dois fermer complètement le chrome, puis effacer le cache puis charger la page avant que le débogueur ne montre le script le plus récent.

(NB: il n’y a pas de mise en cache du script par le serveur Web)

Je me demandais si quelqu’un connaissait un moyen rapide et facile de dire au débogueur d’invalider tous ses javascript et de tout récupérer à nouveau sur la page de rechargement?

Pendant que vous développez votre script, essayez de désactiver le cache Chrome.

Lorsque vous rechargez la page, le JavaScript devrait maintenant être actualisé.


Chrome vers 2011

Ouvrir les paramètresDésactiver le cache


Chrome vers 2018

Ouvrir les paramètres Désactiver le cache

Vous pouvez également y accéder sur l’onglet réseau:

Onglet Réseau

entrer la description de l'image ici

C’est la meilleure façon de vivre … Attention, la fenêtre de l’inspecteur doit restr ouverte pour voir ce menu contextuel tout en maintenant le bouton d’actualisation BTW: j’utilise généralement le cache vide et le rechargement dur

Il a un autre avantage, il garde tous les autres sites Web sauvegardés, juste recharger et effacer celui-ci seulement.

Vous pouvez toujours effacer un fichier spécifique en procédant comme suit:

  1. Ouvrir les outils de développement
  2. Cliquez sur l’onglet Sources
  3. Trouvez votre script / image / fichier
  4. Vérifiez le panneau de droite pour voir si votre fichier est à jour

Si non:

  1. Cliquez avec le bouton droit sur la ressource dans le panneau de gauche et choisissez «Ouvrir le lien dans un nouvel onglet».
  2. Forcer un rechargement de la ressource avec CTRL+F5 (mac: Command-Shift-R )

C’est très pratique si vous avez des ressources dans des frameworks et que CTRL+F5 ne les actualise pas forcément.

Maj + F5 efface rapidement le cache.

Pour Google chrome, ce n’est pas Ctrl + F5 . C’est Shift + F5 pour effacer le cache actuel! Ça marche pour moi !

Voici un raccourci vers DevTools:

  1. F12 pour ouvrir Chrome DevTools
  2. F1 pour ouvrir les parameters de DevTools
  3. Cochez Désactiver le cache (pendant que DevTools est ouvert) comme indiqué ci-dessous:

entrer la description de l'image ici

Note: Mis à jour pour le commentaire de Dimi. Ils ont tendance à le déplacer alors laissez-moi savoir ou mettre à jour le post si vous remarquez que cela a changé.

Si vous apportez des modifications locales à un javascript dans les outils de développement, vous devez vous assurer de désactiver ces modifications avant de recharger la page.

Dans l’onglet Sources, avec votre script ouvert, cliquez avec le bouton droit dans votre script et cliquez sur l’option “Modifications locales” dans le menu contextuel. Cela fait apparaître la liste des scripts pour lesquels vous avez enregistré des modifications. Si vous le voyez dans cette fenêtre, Developer Tools conservera toujours votre copie locale au lieu de l’actualiser à partir du serveur. Cliquez sur le bouton “Annuler”, puis actualisez à nouveau et vous devriez obtenir la nouvelle copie.

Sous Windows, Ctrl + Shift + r forcerait le rechargement du script en chrome.

Il semble que le débogueur Chrome charge les fichiers sources en mémoire et ne les lâche pas malgré les mises à jour du cache du navigateur, c’est-à-dire qu’il dispose de son propre cache en dehors du cache du navigateur qui n’est pas synchronisé. Au moins, c’est le cas lorsque vous travaillez avec des fichiers mappés à la source (je débogage des sources typescriptes). Après avoir actualisé le cache du navigateur et validé que vous naviguez directement dans le fichier source, vous téléchargez le fichier mis à jour, mais dès que vous rouvrez le fichier dans le débogueur, il restitue l’ancien fichier, quelle que soit la version du cache ordinaire du navigateur. Très énervant en effet.

Je considère cela comme un bug dans le chrome. J’utilise la version version 46.0.2490.71 m.

La seule chose qui aide, c’est de redémarrer chrome (fermez tous les navigateurs Chrome).

Si les fichiers que vous chargez sont mis en cache et si les modifications que vous avez apscopes ne sont pas reflétées dans le code, il existe deux manières de gérer ce problème.

  1. Effacer le cache comme tout le monde l’a dit

  2. Si vous voulez Cache et que seuls les fichiers doivent être rechargés, vous pouvez aller dans l’onglet réseau de l’outil de développement et effacer tout ce qui a été chargé. la prochaine fois, il ne le chargera pas depuis le cache. vous aurez vos dernières modifications.

Si vous utilisez un serveur local sur Apache, vous pouvez obtenir des problèmes de mise en cache. Cela m’est arrivé lorsque j’avais un serveur Apache sous Vagrant (dans virtualbox).

Ajoutez simplement les lignes suivantes à votre fichier de configuration ( /etc/httpd/conf/httpd.conf ou équivalent):

 #Disable image serving for network mounted drive EnableSendfile off 

Notez qu’il est utile de rechercher dans le fichier de configuration si EnableSendfile est défini ailleurs.

Il existe également 2 solutions de contournement (rapides):

  1. Utilisez le mode incognito avec le débogage, fermez la fenêtre et rouvrez-le.
  2. Supprimer votre historique de navigation

La désactivation des points d’arrêt a provoqué le chargement du nouveau script.

À mon avis, il est plus facile de travailler dans une session de navigation privée de chrome, pour s’assurer que vos fichiers javascript ne proviennent pas du cache.

Vous pouvez également utiliser cette extension Chrome pour basculer rapidement entre l’utilisation ou non du cache: https://chrome.google.com/webstore/detail/cache-killer/jpfbieopdmepaolggioebjmedmclkbap