Wie erzwinge ich, dass der Chrome Script-Debugger Javascript neu lädt?
Ich mag die Möglichkeit, Javascript im Chrome-Debugger zu bearbeiten. Ich finde jedoch, dass es wirklich problematisch sein kann, den Debugger dazu zu bringen, das JavaScript erneut vom Server abzurufen.
Manchmal muss ich so weit gehen, dass ich nur den Debugger schließe und den Frame neu lade. Das klappt aber auch - manchmal (ein dI kann nicht festlegen, unter welchen Bedingungen dies auftritt) muss ich meinen temporären Internetcache leeren. Manchmal schwöre ich, dass ich Chrome vollständig schließen muss, dann den Cache leeren und dann die Seite laden muss, bevor der Debugger schließlich das aktuellste Skript anzeigt.
(Hinweis: Das Script wird vom Webserver nicht zwischengespeichert.)
Ich habe mich gefragt, ob jemand eine schnelle und einfache Möglichkeit hatte, dem Debugger zu sagen, er solle sein Javascript ungültig machen und alles auf Seite neu laden?
Deaktivieren Sie während der Entwicklung Ihres Skripts den Chrome-Cache.
Wenn Sie die Seite neu laden, sollte das JavaScript jetzt aktualisiert werden.
Chrome um 2011
Chrome um 2018
Sie können auch auf der Registerkarte Netzwerk darauf zugreifen:
Das oben abgebildete Kontextmenü kann durch Klicken mit Rechtsklick/Drücken und Halten der Schaltfläche "Neu laden" aufgerufen werden, während Chrome Dev Tools geöffnet wird .
Leerer Cache und festes Nachladen funktionieren für mich am besten.
Ein weiterer Vorteil: Diese Option lässt alle anderen geöffneten Registerkarten und Websitedaten unberührt. Es wird nur die aktuelle Seite neu geladen und gelöscht.
Sie können eine bestimmte Datei jederzeit löschen, indem Sie folgende Schritte ausführen:
- Öffnen DevTools
- Klicken Sie auf die Registerkarte Quellen
- Finden Sie Ihr Skript/Bild/Ihre Datei
- Überprüfen Sie im rechten Fensterbereich, ob Ihre Datei auf dem neuesten Stand ist
Wenn nicht:
- Klicken Sie mit der rechten Maustaste auf die Ressource im linken Bereich und wählen Sie "Link in neuem Tab öffnen".
- Erzwingen Sie ein Neuladen der Ressource mit den oben genannten Methoden. (Siehe @Bishoy Hannas Beispiel)
Dies ist sehr praktisch, wenn Sie Ressourcen haben, die sich in Frames befinden und CTRL+F5 keine Aktualisierung erzwingt.
Shift+F5 Leert schnell den Cache.
Für Google Chrome ist es nicht Ctrl+F5. Es ist Shift+F5 um den aktuellen Cache zu löschen! Für mich geht das !
Hier ist eine Verknüpfung zu DevTools:
- F12 Chrome DevTools öffnen
- F1 um die DevTools-Einstellungen zu öffnen
- Überprüfen Sie Cache deaktivieren (während DevTools geöffnet ist) wie unten gezeigt:
Hinweis: Aktualisiert nach dem Kommentar von Dimi. Sie neigen dazu, es zu verschieben, also lass es mich wissen oder aktualisiere den Beitrag, wenn du bemerkst, dass er sich geändert hat.
Unter Windows Ctrl+Shift+r würde zwingen, das Skript in Chrom neu zu laden.
Wenn Sie in den Developer Tools lokale Änderungen an einem Javascript vornehmen, müssen Sie diese Änderungen deaktivieren, bevor Sie die Seite erneut laden.
Klicken Sie auf der Registerkarte Quellen mit geöffnetem Skript mit der rechten Maustaste in Ihr Skript, und klicken Sie im Kontextmenü auf die Option "Lokale Änderungen". Daraufhin wird die Liste der Skripts angezeigt, an denen Sie Änderungen gespeichert haben. Wenn Sie es in diesem Fenster sehen, behalten Developer Tools Ihre lokale Kopie immer bei, anstatt sie vom Server zu aktualisieren. Klicken Sie auf die Schaltfläche "Wiederherstellen", aktualisieren Sie dann erneut, und Sie sollten die neue Kopie erhalten.
Es scheint, als würde der Chrome-Debugger Quelldateien in den Arbeitsspeicher laden und sie trotz Browser-Cache-Updates nicht loslassen, d. H. Er hat einen eigenen Cache, abgesehen von dem Browser-Cache, der nicht synchron ist. Dies ist zumindest der Fall, wenn Sie mit Quelldateien arbeiten (ich debugiere TypeScript-Quellen). Nachdem Sie den Browser-Cache erfolgreich aktualisiert und durch direktes Durchsuchen der Quelldatei überprüft haben, laden Sie die aktualisierte Datei herunter. Sobald Sie die Datei jedoch erneut im Debugger öffnen, wird die alte Datei unabhängig von der Version aus dem normalen Browser-Cache zurückgegeben. Sehr nervig.
Ich würde das als Fehler in Chrom betrachten. Ich verwende Version 46.0.2490.71 m.
Das einzige, was hilft, ist, Chrom neu zu starten (alle Chrome-Browser schließen).
Wenn Sie einen lokalen Server unter Apache ausführen, erhalten Sie das Aussehen von Zwischenspeicherungsproblemen. Dies passierte mir, als ich einen Apache-Server unter Vagrant (in Virtualbox) hatte.
Fügen Sie einfach die folgenden Zeilen zu Ihrer Konfigurationsdatei hinzu (/etc/httpd/conf/httpd.conf oder gleichwertig):
#Disable image serving for network mounted drive
EnableSendfile off
Beachten Sie, dass es sich lohnt, die Konfigurationsdatei zu durchsuchen, um zu sehen, ob EnableSendfile an anderer Stelle auf on gesetzt ist.
Meiner Meinung nach ist es am einfachsten, in einer "privaten Browsersitzung" von Chrome zu arbeiten, um sicherzustellen, dass Ihre Javascript-Dateien nicht aus dem Cache stammen.
Es gibt auch zwei (schnelle) Problemumgehungen:
- Verwenden Sie den Inkognito-Modus während des Debugging, schließen Sie das Fenster und öffnen Sie es erneut.
- Löschen Sie Ihren Browserverlauf
Durch das Deaktivieren von Haltepunkten wurde das neue Skript für mich geladen.
Wenn die Dateien, die Sie laden, zwischengespeichert werden und die von Ihnen vorgenommenen Änderungen nicht im Code angezeigt werden, gibt es zwei Möglichkeiten, wie Sie damit umgehen können
Löschen Sie den Cache, wie es allen gesagt wurde
Wenn Sie Cache wünschen und nur die Dateien neu geladen werden müssen, können Sie auf die Registerkarte Netzwerk des Entwicklertools gehen und löschen, was geladen wurde. Das nächste Mal wird es nicht aus dem Cache geladen. Sie haben Ihre letzten Änderungen.