首頁 > 軟體

Nginx解決history模式下頁面重新整理404問題範例

2022-10-10 14:00:19

前置知識

  • 單頁應用(SPA - single page application)
    只在第一次載入頁面時,返回唯一的html頁面和它的公共靜態資源,後續的頁面跳轉都不會從伺服器端拿html檔案。(hash和history路由實現瀏覽器url變化而不重新整理頁面)
  • hash路由
    例子:www.baidu.com/#/home, 原本hash是用來結合錨點實現頁面試圖的控制,當#後面的值發生改變時不會重新請求頁面,主要通過window的onhashchange方法來實現。
  • history路由
    相比於hash路由,最直觀的變化就是路由中沒有#,通過呼叫window.history物件上的一系列方法來實現頁面的無重新整理跳轉(pushState、replaceState)。

history模式下,因為url改變了,此時如果手動重新整理頁面,瀏覽器認為是請求一個新的頁面(發起新的Http請求),而新的頁面是不存在的(後端未設定的話),導致404。

先簡述一下在瀏覽器上輸入IP或域名後發生的事情(有點面試題的味道了嗷


IT145.com E-mail:sddin#qq.com