Was ist der Unterschied zwischen Verlauf und Hash in Vue?

Unterschiede: 1. Die Hash-Route hat ein „#“ in der URL in der Adressleiste, die Verlaufsroute jedoch nicht. 2. Wenn Sie einen Aktualisierungsvorgang durch Drücken der Eingabetaste durchführen, wird die Hash-Route auf die entsprechende Seite geladen Adressleiste, während die Verlaufsroute im Allgemeinen 404-Fehler 3 anzeigt. Hash unterstützt einige Browser niedrigerer Versionen, der Verlauf jedoch nicht.

Die Betriebsumgebung dieses Artikels: Windows 10-System, Vue Version 2.9.6, DELL G3-Computer.

Was ist der Unterschied zwischen Verlauf und Hash in Vue?

• 1 Die Hash-Route hat # in der Adressleisten-URL und wird mit window.location.hash gelesen. Die Verlaufsroute wird nicht besser aussehen

• 2 Wenn wir zum Aktualisieren die Eingabetaste drücken, wird die Hash-Route auf die Seite geladen, die der Adressleiste entspricht, während die Verlaufsroute normalerweise einen 404-Fehler meldet (Aktualisierung ist eine Netzwerkanforderung). , und es gibt keine Back-End-Vorbereitung, es wird ein Fehler gemeldet).

• 3. Hash-Routing unterstützt Browser niedrigerer Versionen, während History-Routing eine neue API in HTML5 ist.

• 4.hash zeichnet sich dadurch aus, dass es zwar in der URL erscheint, aber nicht in der http-Anfrage enthalten ist, also keine Auswirkung auf das Backend hat, sodass durch eine Änderung des Hashs die Seite nicht neu geladen wird, was auch so ist eine einzelne Seite. Unverzichtbar für die Anwendung.

• 5.history verwendet den Verlaufsstapel des Browsers. Später wurden in HTML5 die Methoden pushState() und replaceState() hinzugefügt, die die Möglichkeit bieten, Verlaufsdatensätze zu ändern. Bei Änderungen sendet der Browser jedoch nicht sofort eine Anfrage an das Backend, obwohl die aktuelle URL geändert wird.

• 6. Dieser Verlaufsmodus erfordert Hintergrundkonfigurationsunterstützung. Beispiel: Wenn wir zur Homepage des Projekts gehen, ist alles normal und kann aufgerufen werden, aber wenn wir die Seite aktualisieren oder direkt auf den Pfad zugreifen, wird 404 zurückgegeben. Das liegt daran, dass im Verlaufsmodus nur window.history angezeigt wird Wird dynamisch über js betrieben. Um den Pfad in der Adressleiste des Browsers zu ändern, wird keine http-Anfrage initiiert. Wenn ich diese Adresse jedoch direkt in den Browser eingebe, muss ich eine http-Anfrage an den Server initiieren, dieses Ziel ist jedoch nicht vorhanden Server, also wird 404 zurückgegeben

Zusammenfassung

Natürlich ist die Geschichte nicht in allem gut. Obwohl SPA im Browser einfach zu verwenden ist, besteht der Unterschied zwischen beiden darin, dass Sie tatsächlich eine HTTP-Anfrage an das Backend über die URL initiieren müssen. Insbesondere, wenn der Benutzer die URL manuell eingibt und die Eingabetaste drückt oder den Browser aktualisiert (neu startet).

1: Im Hash-Modus wird nur der Inhalt vor dem Hash-Symbol in die Anfrage aufgenommen, z. B. http://www.abc.com. Daher gilt für das Backend, auch wenn keine vollständige Abdeckung des Routings erreicht wird. Es wird kein 404-Fehler zurückgegeben.

2: Im Verlaufsmodus muss die URL des Front-Ends mit der URL übereinstimmen, die tatsächlich die Anfrage an das Back-End initiiert. Wie zum Beispiel http://www.abc.com/book/id. Wenn im Backend die Routing-Verarbeitung für /book/id fehlt, wird ein 404-Fehler zurückgegeben

Problemlösung:

Lösung für einen 404-Fehler: Viele online eingeführte Methoden funktionieren nicht. Installieren Sie das URL-Rewriting-Modul, konfigurieren Sie die Rewriting-Regeln und verweisen Sie auf index.html. Oder platzieren Sie die durch das URL-Rewriting generierte Datei web.config direkt im Stammverzeichnis der Website.

【Verwandte Empfehlung: „vue.js Tutorial“】

Das obige ist der detaillierte Inhalt vonWas ist der Unterschied zwischen Verlauf und Hash in Vue?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!