Actualisation forcée des fichiers JavaScript uniquement dans Firefox et Chrome


64

Je souhaite effacer uniquement les fichiers JavaScript de mes navigateurs Web (Firefox et Chrome). Je suis en train de faire du débogage JavaScript, et il est ennuyeux que mon JS ne soit simplement pas mis à jour chaque fois que je modifie mes fichiers JS. La seule chose que je puisse faire maintenant est d'effacer mes cookies, mais cela efface tout mon historique de navigation.

Comment effacer / actualiser les fichiers JavaScript chargés dans mon navigateur sans effacer les autres fichiers?

Réponses:


42

Je le fais moi-même pour le développement. J'utilise Ctrl+ F5. C'est comme un rafraîchissement forcé. Cela actualise la page, y compris le téléchargement de nouveau de tous les fichiers JavaScript ou CSS référencés, même s'ils ont été mis en cache.

Cela n'effacera rien d'autre comme votre historique de navigation.

Toutefois, veuillez noter que même si je sais que cela fonctionne dans Firefox et probablement dans Internet Explorer, je ne suis pas sûr si Ctrl+ F5fonctionne de la même manière dans Chrome.

En outre, iegik dit:

Sur certains navigateurs, vous pouvez utiliser ` Ctrl+ Shift+ Rpour effectuer la même tâche.


Génial! Je change la réponse acceptée en votre réponse car votre solution est plus simple.
Graviton

J'apprécie cela ... Mais notez bien que même si je sais que cela fonctionne dans Firefox, et probablement dans IE, je ne suis pas sûr que CTRL-F5 fonctionne de la même manière dans Chrome.
7wp

2
Même chose avec Chrome 21 beta sur Win7 - l'actualisation de la page avec ctrl-f5 ne demande pas à nouveau le fichier JS (j'utilise Charles pour vérifier deux fois).
Artem Russakovskii

1
effectivement, chrome traite d'abord ctrl + f5 comme un rafraîchissement normal selon la conception, puis les touches ctrl + f5 (plus d'une) dans peu de temps forceront le rechargement de toutes les sources
Zeela

1
Pour Chrome, F12 et cliquez avec le bouton droit sur le bouton de rechargement. superuser.com/questions/220179/…
Cees Timmerman

50

Avec chrome:

À partir de Chrome 15, ouvrez les outils de développement, cliquez sur la roue dentée en bas à gauche de l'écran et cochez la case Désactiver le cache .

Désactiver le cache dans Chrome 15 et plus

Ainsi, vous serez sûr que les ressources seront toujours rechargées à partir du serveur et vous ne devrez pas effacer manuellement le cache, ce qui pourrait également supprimer les données mises en cache pour les sites non liés.


Merci pour le conseil - je viens de vérifier et cette option est également dans Chrome 14.
Keybits

Génie! C'est une bonne trouvaille.
Randomblue

Génial, je cherchais ça.
Artem Russakovskii

... et n'oubliez pas de décocher l'option une fois que vous avez terminé.
Halil Özgür

Sur une seconde prise, il semble que ces options ne sont actives que lorsque devtools est visible: twitter.com/ChromiumDev/status/227356682890670080 (de stackoverflow.com/a/7000899/372654 )
Halil Özgür

8

Je ne suis pas d'accord avec @ 7wp. Étant donné que certains de vos utilisateurs finaux ne connaissent pas la fonction Ctrl+ F5et que certains ne sont même pas conscients des différences entre les navigateurs et même de l'existence d'autres navigateurs (les anciens par exemple), vous devez obliger le navigateur à télécharger une nouvelle copie de les fichiers JS / CSS.

La meilleure solution ici consiste à ajouter l’horodatage à la fin des noms de fichiers .js / .css ou à ajouter la version svn, ce qui est également une excellente idée.

<script src="js/myfile.js?t=<?=time()?>" type="text/javascript"></script>

5

Vous voudrez peut-être essayer de vider votre cache uniquement, et non votre navigation, votre historique, vos cookies, vos mots de passe, vos données de formulaire enregistrées, etc.

Dans Firefox 3.5, accédez à

Outils »Effacer l'historique récent ...

Ensuite, assurez-vous que seul "Cache" est sélectionné avant de sélectionner "Effacer maintenant".

Dans Chrome (je ne sais pas quelle version particulière vous utilisez, car j'utilise les versions de dev), allez à

Icône Clé (Outils) »Options» Onglet Personnel »Effacer les données de navigation ...

Encore une fois, assurez-vous que seulement "Vider le cache" est cochée.

Vous pouvez également essayer d'ouvrir une nouvelle session privée dans Firefox ou une fenêtre de navigation privée dans Chrome. ni ne devriez mettre en cache les fichiers (y compris vos fichiers .JS) que vous avez automatiquement téléchargés et traités lors de la navigation.


Incognito est probablement la voie à suivre pour Chrome.
mardi

1

J'ai utilisé une petite astuce sur un site sur lequel je travaille ... pour les mêmes raisons que vous. Je fais de petites modifications et le code JavaScript est chargé par le code JavaScript et je veux m'assurer que je travaille toujours avec le script actuel (non mis en cache).

Essayez de faire le code JavaScript que vous chargez dans un fichier PHP ... mettez simplement <?php ?>au début et mettez l'extension .php.

var fileref = document.createElement('script');
fileref.setAttribute("type", "text/javascript");

// The Date added to the file doesn't effect the results but
// helps Internet Explorer be sure to refresh the data and
// not use cache

var d = new Date();

var t = d.getTime();

fileref.setAttribute("src", filename + ".php?date=" + t);

fileref.setAttribute("id", filename);

Parce que le nom change, Internet Explorer pense que c'est un nouveau fichier;)


1
N’a pas besoin de changer le nom en '.php'. Si vous mettez 'filename.js? T =' + t le résultat est le même. Vous pouvez le faire avec '.css' aussi. Tous nos systèmes de production utilisent cette astuce pour certifier que les clients utilisent les bons fichiers de contenu.
Leonel Martins

1
A noter que nous avons tendance à utiliser le numéro de révision SVN au lieu de la date / heure. De cette façon, nous bénéficions d'avantages en termes de mise en cache et d'actualisation uniquement lorsque nous validons réellement.
Groo

Merci beaucoup! Cette astuce a totalement glissé dans mon esprit. Je lutte contre ce problème depuis des jours et cela le fera pour moi. Je viens de mettre ceci à la fin de l'URL: "? <? Php echo time ()?>"
thrashr888

1

Dans Chrome, vous pouvez simplement appuyer Ctrlsur le bouton Actualiser et cliquer dessus. J'ai découvert cela par hasard.


Cela actualise complètement la page. Je ne pense pas que cela actualise uniquement le code Javascript.
Ivo Flipse

1

J'ouvre le fichier JavaScript dans un onglet séparé, Shift+ rafraîchir, vérifier que je vois les dernières modifications, puis Shift+ rafraîchir la page réelle (en fait, dans mon cas, le cadre dans un jeu de cadres, ce qui semble aggraver la situation). Cela fonctionne presque tout le temps.


0

Je ne l'ai pas utilisé moi-même, mais le module complémentaire «Bouton de cache vide» de Firefox pourrait être utile. J'ai lu leur documentation, donc je ne suis pas sûr que cela efface aussi votre historique de navigation.


0

Accédez aux paramètres de contenu dans Chrome, désactivez JavaScript et enregistrez.

Ensuite, activez à nouveau JavaScript.


0

Si vous travaillez avec JavaScript et que vous craignez de recharger la page pour refléter les modifications de JavaScript. Essayez d’utiliser le débogueur de Chrome, qui vous permet d’apporter des modifications au (x) fichier (s) JavaScript chargé (s) au moment de l’exécution et de n’utiliser aucun rechargement pour tester les nouvelles fonctions ou les modifications que vous souhaitez tester.


Bienvenue sur Super User! Veuillez relire attentivement la question. Votre réponse ne répond pas à la question initiale.
DavidPostill


0

Ajoutez des fonctions de date dynamiques à la fin de votre fichier JavaScript. Cela forcera le navigateur à charger le fichier JavaScript mis à jour. Cela signifie que, si vous incluez le fichier .js, vous pouvez ajouter .... xyz.js?

< ? php echo date('l jS \of F Y h:i:s A') ? >

Bien sûr, cela pourrait être supprimé une fois votre débogage terminé et prêt à être opérationnel.


Ce n'est pas Javascript.
Natalie Adams
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.