UrlRewriter-Caching-Probleme und eine Reihe damit verbundener Untersuchungen

UrlRewriter-Caching-Probleme und eine Reihe damit verbundener Untersuchungen

Beim Entwickeln einer Website-Funktion kann der Sitzungscache nicht rechtzeitig geleert werden. Eine Reihe von Erkundungen begann.

Ich habe einige gute Artikel gefunden.

Erstens der Unterschied zwischen F5 und STRG+F5

Der Unterschied zwischen F5 und STRG+F5 (für Faule: F5 liest zuerst den Cache, liest aber innerhalb des Frameworks nur den lokalen Cache. STRG+F5 initiiert eine neue Anfrage und überspringt den Cache)

Hintergrund

Die Website unseres Unternehmens hat eine Framework-Struktur mit mehreren Iframes auf einer Seite. Aus diesem Grund kommt jedes Mal, wenn ich die geänderte JS-Datei vertrauensvoll an SVN übermittle, kurz darauf ein Backend-Programmierer zu mir und fragt: Warum meldet JS immer noch einen Fehler? Ich habe bereits STRG+F5 gedrückt. Haben Sie es richtig übermittelt? Mir bleibt nichts anderes übrig, als zu seinem Platz zu gehen und die Maus zu nehmen, um zu operieren: Rechtsklick -> aktueller Frame -> neuen Frame in neuem Tab öffnen -> STRG+F5 -> zum ursprünglichen Tab wechseln -> F5. Nach dieser Operation hat es endlich funktioniert. Das Gleiche ist schon oft passiert. Dies beweist auch, dass viele Programmierer den Cache-Mechanismus des Browsers immer noch nicht gut genug verstehen.

Grundlagen

Die Hauptursache des Problems ist, dass in Firefox STRG+F5 den Cache der Frame-Seite nicht leeren kann. Dies umfasst die Frame-Seite selbst und alle darin eingebetteten Elemente (.js, .css, .jpg usw.). Der eigentliche Titel dieses Artikels lautet daher „So überspringen Sie die Cache-Aktualisierung der Seite im Frame in Firefox“. Zunächst möchte ich über die relevanten Grundkenntnisse sprechen.

1. Cache lesen

Webentwickler sagen oft: Wenn ein Cache vorhanden ist, drücken Sie STRG+F5. Oder: Wenn ein Cache vorhanden ist, löschen Sie ihn mit STRG+UMSCHALT+ENTF. Wissen Sie, auf wie viele Arten ein Browser Cache-Dateien lesen kann? Basierend darauf, ob eine HTTP-Anforderung gesendet wird, gibt es meiner Meinung nach zwei Möglichkeiten:

1. Der Browser stellt anhand der vom Server zurückgegebenen Ablaufzeit fest, dass die Datei nicht abgelaufen ist. Daher liest er die Cache-Datei direkt aus dem Cache-Ordner und zeigt die Webseite ohne Netzwerkverbindung an.

2. Der Browser sendet eine HTTP-Anforderung, und der Anforderungsheader enthält die Felder „If-Modified-Since“ und „If-None-Match“. Lassen Sie den Server entscheiden, ob die zwischengespeicherte Datei gelesen werden soll. Wenn der Server eine 304-Antwort ohne Antwortentität zurückgibt, bedeutet dies, dass der Server davon ausgeht, dass die Datei nicht geändert wurde. Die entsprechende Datei im Cache kann verwendet werden, und der Browser liest den Cache zu diesem Zeitpunkt. (Wenn Sie HTTP nicht verstehen, können Sie eine Kopie des „HTTP Authoritative Guide“ kaufen, um es zu lesen. Oder lesen Sie direkt RFC2616.)

Die erste Möglichkeit zum Lesen des Caches nenne ich „No Request Read Cache“ und die zweite „No Modification Read Cache“.

2. Aktualisierungsmethode

Die Aktualisierungsmethode bezieht sich hier auf die Art und Weise, wie eine Webseite neu geladen werden kann. Ich unterteile sie grob in drei Typen, basierend auf der Leistung:

1. Am häufigsten klicken Sie auf die Schaltfläche „Aktualisieren“ des Browsers oder drücken F5

2. STRG+F5, die Funktion dient zum Überspringen der Cache-Aktualisierung

3. Drücken Sie die Eingabetaste in der Adressleiste des Browsers. Der IE klassifiziert diese Anforderung als „Navigations“-Vorgang.

In Bezug auf das Lesen des Caches weisen alle drei Aktualisierungsmethoden unterschiedliche Ergebnisse auf. Die dritte Methode aktualisiert normalerweise nur die Hauptseitendatei, und alle anderen eingebetteten Dateien werden „ohne Anforderung im Cache gelesen“. Die meisten Entwickler aktualisieren die Seite nicht auf diese Weise, daher wird diese Aktualisierungsmethode in diesem Experiment nicht verglichen.

3. Der Unterschied zwischen F5 und STRG+F5

Der experimentelle Teil dieses Artikels vergleicht nur die beiden Aktualisierungsmethoden F5 und STRG+F5. Hier werden wir darüber sprechen, warum F5 den Cache nicht überspringen kann, letzteres jedoch schon. Die Antwort ist, dass die gesendeten Anforderungsheader unterschiedlich sind. Und es gibt einige Unterschiede in den von verschiedenen Browsern gesendeten Anforderungsheadern.

1. Der Anforderungsheader der durch F5 ausgelösten HTTP-Anforderung enthält normalerweise das Feld If-Modified-Since oder If-None-Match oder beides. Wenn der Server glaubt, dass sich die angeforderte Datei nicht geändert hat, gibt er eine 304-Antwort zurück und der Cache wird nicht übersprungen.

2. Die durch STRG+F5 ausgelöste HTTP-Anforderung enthält nicht die beiden oben genannten Header im Anforderungsheader, sondern die Felder Pragma: no-cache oder Cache-Control: no-cache oder beides. Wenn der Server einen Wert wie no-cache sieht, antwortet er mit der neuesten Datei und überspringt so den Cache.

Experimenteller Vergleich

Der Testtitel lautet: Verwenden Sie F5 und STRG+F5, um die Seite mit dem Iframe zu aktualisieren. Die Leistung der fünf wichtigsten Browser ist unterschiedlich. Dieser Test verwendet Fiddler, um Netzwerkanforderungen zu überwachen, und berücksichtigt nicht die Auswirkungen von Cache-bezogenen HTTP-Antwortheadern.

Der Quellcode der Hauptseite index.html ist

Code kopieren
Der Code lautet wie folgt:

<!DOCTYPE
HTML>
<html>
<Kopf>
<meta charset="utf-8" />
</Kopf>
<Text>
<iframe src="frame.html"></iframe>
<img src="index.jpg" />
<script src="index.js"></script>
</body>
</html>

Der Quellcode der Frameseite frame.html lautet

Code kopieren
Der Code lautet wie folgt:

<!DOCTYPE
HTML>
<html>
<Kopf>
<meta charset="utf-8" />
</Kopf>
<Text>
<img src="Rahmen.jpg" />
<script src="frame.js"></script>
</body>
</html>

1. Internet Explorer 9

Anfragen mit den Seriennummern 1-6 sind F5-Operationen, und Anfragen mit den Seriennummern 7-12 sind STRG+F5-Operationen. Es ist ersichtlich, dass im IE durch die Verwendung von STRG+F5 alle Ressourcendateien der Hauptseite und der Frameseiten den Cache überspringen können.

Firefox 18

Anfragen mit den Seriennummern 1-6 sind F5-Operationen, und Anfragen mit den Seriennummern 7-9 sind STRG+F5-Operationen. Es ist ersichtlich, dass in Firefox STRG+F5 nur dazu führen kann, dass die Hauptseite und ihre Ressourcendateien den Cache überspringen, während die Frame-Seite und ihre Ressourcendateien vollständig „ohne Anfrage aus dem Cache gelesen“ werden.

3. Chrom 22

Anfragen mit den Nummern 1-5 sind F5-Operationen und Anfragen mit den Nummern 7-9 sind STRG+F5-Operationen. Es ist ersichtlich, dass in Chrome, ähnlich wie in Firefox, STRG+F5 nur dazu führen kann, dass die Hauptseite und ihre Ressourcendateien den Cache überspringen, während die Frame-Seite und ihre Ressourcendateien vollständig „ohne Anforderung aus dem Cache gelesen“ werden. Das Merkwürdige ist, dass, wenn STRG+F5 einmal auf der aktuellen Seite gedrückt wird, bei jedem Drücken von F5 auf der Seite ein Pragma: no-cache-Anforderungsheader zur HTTP-Anforderung der Hauptseite hinzugefügt wird, d. h. der Browser merkt sich dies. Dies ist bei der Anfrage mit der Nummer 1 der Fall. Noch merkwürdiger ist, dass bei der F5-Operation frame.html immer „ohne Anforderung aus dem Cache gelesen“ wird, was sich von anderen Browsern unterscheidet. Noch problematischer ist, dass Chrome die Frame-Seite nicht mit der rechten Taste aufrufen kann.

Oper 12.50

Anfragen mit den Nummern 1-6 sind F5-Operationen und Anfragen mit den Nummern 7-12 sind STRG+F5-Operationen. Es ist ersichtlich, dass die Leistung unter Opera noch unterschiedlicher ist. Selbst wenn nur F5 gedrückt wird, hat die Anfrage für die Hauptseite (Nummer 1) auch den Pragma: no-cache-Anfrageheader. Unter STRG+F5 überspringen alle Ressourcendateien den Cache, mit Ausnahme der Frame-Seite selbst (Nummer 8). Dies ist näher am IE.

Safari

Anfragen mit den Nummern 1-5 sind F5-Operationen. Safari unterstützt STRG+F5 nicht. Ähnlich wie bei Opera bewirkt F5, dass die Anfrage für die Hauptseite (Nummer 1) den Anfrageheader Pragma: no-cache enthält. Da das Überspringen des Caches nicht unterstützt wird, unabhängig davon, ob es sich um eine Frameseite handelt oder nicht, können Sie in Safari den Cache nur durch Klicken auf das Menü leeren.

Lösung

Laut dem obigen Vergleich funktioniert nur der IE-Browser wie gewünscht. Hier ist die Lösung für Firefox.

1. Installieren Sie die Erweiterung
//img.jbzj.com/file_images/article/201301/2013124142805092/ReloadPassCache_jb51.rar
2. UC-Skript installieren
//img.jbzj.com/file_images/article/201301/2013124142805092/ReloadPassCache.uc.js

UC-Skript wird von professionellen Firefox-Spielern verwendet. Hier werde ich darüber sprechen, wie ich diese Funktion implementiert habe. Wer Interesse daran hat, Firefox-Skript zu spielen, kann einen Blick darauf werfen. Wenn Sie es wirklich nicht verstehen, können Sie es überspringen.

Code kopieren
Der Code lautet wie folgt:

//Keydown-Ereignis im Hauptfenster des Browsers binden
Standort
== "chrome://browser/content/browser.xul" &&
addEventListener("Taste gedrückt",
Funktion (Ereignis)
{
//Wenn STRG+F5 gedrückt wird
wenn (Ereignis.welches
=== 116 && Ereignis.Strg-Taste) {
// Verhindert Sprudeln und Standardvorgänge, hauptsächlich um die Standardaktualisierungsaktion zu verhindern. Andernfalls wird es zweimal aktualisiert
event.preventDefault();
event.stopPropagation();
(Funktion (Inhalt)
{
// Binden Sie das DOMContentLoaded-Ereignis an das aktuelle Tag und aktualisieren Sie jeden Frame, nachdem das DOM der Hauptseite geladen wurde.
gBrowser.mCurrentBrowser.addEventListener("DOMContentLoaded",
Funktion selbst()
{
//DOMContentLoaded-Ereignis aufheben
this.removeEventListener("DOMContentLoaded",
selbst, falsch);
//Alle Frames durchlaufen und aktualisieren
Array.prototype.slice.call(Inhalt.Frames).fürEach(Funktion (win)
{
// Cache-Aktualisierung überspringen
win.location.reload(true);
})
},
FALSCH);
// Beginnen Sie mit der Aktualisierung der Hauptseite
Inhalt.Standort.neu laden(true);
})(Inhalt)
}
// Erfassungsmodus, lösen Sie die Ereignisverarbeitungsfunktion zum ersten Mal aus.
},
WAHR)

Nach der Installation dieser Erweiterung kann durch Drücken von STRG+F5 die Cache-Aktualisierung aller Frameseiten übersprungen werden, genau wie beim IE. Für mehrschichtige Frames (Frames innerhalb von Frames) gilt diese Erweiterung nicht. Ich denke, Programmierer werden nicht so viel Pech haben.

URL-Reriter

Was ist pseudostatisch? 1. Es dient zur Konvertierung der dynamischen Seite in

Aussehen

Es ist eine statische Seite

Warum pseudostatisch verwenden? 1. Der Browser enthält das Band nicht? ' URL 2. Nachdem eine Seite geöffnet wurde (die URL ist exakt dieselbe), geht das erneute Öffnen sehr schnell. Da die Seitenkonvertierung im Speicher erfolgt, wird die Seite beim erneuten Öffnen nicht erneut konvertiert, sondern direkt aus dem Speicher gelesen. Da die URL bei jedem Seitenwechsel geändert wird, sollten Sie selbst über den Speicherverbrauch nachdenken. . 3. Es beansprucht weniger Cup-Ressourcen (siehe vorheriger Punkt). 4. Es sieht einheitlicher aus und kann die für die Entwicklung verwendete Sprache verbergen. Unter welchen Umständen sollte pseudostatisch verwendet werden? 1. Nur kleine Websites und Websites, die besonders auf die Einbindung von Browsern Wert legen, verwenden es (der Inhalt ändert sich nicht häufig, aber Sie hoffen, dass andere ihn über Suchmaschinen finden können). 2. Portal-Websites können selektiv verwendet werden, und Communities können ohne es verwendet werden.

<<:  Detaillierte Erläuterung des Docker-Arbeitsmodus und -Prinzips

>>:  Deaktivierte Werte, die nicht eingegeben werden können, können nicht an die Aktionsebene übergeben werden

Artikel empfehlen

Detaillierte Erläuterung der ECharts-Mausereignisverarbeitungsmethode

Ein Ereignis ist eine vom Benutzer oder dem Brows...

Docker-Cross-Server-Kommunikations-Overlay-Lösung (Teil 1) Consul-Einzelinstanz

Inhaltsverzeichnis Szenario Aufgabe Idee analysie...

Beispielanalyse der Verwendung von GROUP_CONCAT in MySQL

Dieser Artikel beschreibt anhand eines Beispiels ...

Zusammenfassung mehrerer Situationen, in denen MySQL-Indizes fehlschlagen

1. Indizes speichern keine Nullwerte Genauer gesa...

Tutorial zur Installation von MySQL8 unter Linux CentOS7

1. Installation der RPM-Version Überprüfen Sie, o...

So verwenden Sie React zur Implementierung einer Bilderkennungs-App

Lassen Sie mich Ihnen zuerst das Effektbild zeige...

MySQL-Lerndatenbankbetrieb DML ausführliche Erklärung für Anfänger

Inhaltsverzeichnis 1. Anweisung einfügen 1.1 Einf...

MySQL-Implementierung für pessimistisches und optimistisches Sperren

Inhaltsverzeichnis Vorwort Tatsächlicher Kampf 1....

Zusammenfassung der Wissenspunkte zum MySQL ALTER-Befehl

Wenn wir den Tabellennamen ändern oder die Tabell...

Implementierungscode für die Dateimontage von DockerToolBox

Wenn Sie Docker verwenden, stellen Sie möglicherw...

Grundlegende Verwendung des Befehls wget unter Linux

Inhaltsverzeichnis Vorwort 1. Laden Sie eine einz...