history與hash的區別

history與hash的區別

---

路過的朋友，能夠點個贊，關注一下~~~

前言

在vue-router中，對路由器的配置有兩種模式，hash模式和history模式，

最直觀的區別就是在url中hash 帶了一個很醜的 # ，而history是沒有#的。vue默認使用hash。

mode："hash" mode："history"

hash

即：地址欄 URL 中的 # 符號，好比這個 URL：www.aaa.com/#/hello，has… 的值爲 #/hello。

它的特色在於：hash 雖然出如今 URL 中，但不會被包括在 HTTP 請求中，對後端徹底沒有影響，所以改變 hash 不會從新加載頁面。

history

history利用了 HTML5中新增的 pushState() 和 replaceState() 方法。（須要特定瀏覽器支持）

這兩個方法應用於瀏覽器的歷史記錄棧，在當前已有的 back、forward、go 的基礎之上，它們提供了對歷史記錄進行修改的功能。只是當它們執行修改時，雖然改變了當前的 URL，但瀏覽器不會當即向後端發送請求。

總結

1. 經過history中，丟掉了#，可是：不怕前進，不怕後退，就怕刷新，刷新是實實在在地去請求服務器的。

2. 在hash模式下，前端路由修改的是#中的信息，而瀏覽器請求時不會將 # 後面的數據發送到後臺，因此沒有問題。可是在history下，你能夠自由的修改path，當刷新時，若是服務器中沒有相應的響應或者資源，則會刷新出來404頁面。