鍍金池/ 問答/網(wǎng)絡(luò)安全  HTML/ history api刷新的一個小疑問

history api刷新的一個小疑問

圖片描述

因為是想自己根據(jù)history-api做一個簡單的demo,如圖所示,就是第一次進來和點擊各種導(dǎo)航的時候會正確顯示,但是一旦點擊刷新按鈕就會提示找不到這個頁面。不知道有沒有人知道怎么避免這個問題。

我知道為什么會這樣,但是我不知道怎么解決。
我試過用'#',但是用#的話我覺得沒把history-api用正確。

回答
編輯回答
淺淺

你知道為什么會這樣,所以你應(yīng)該只到用#是沒用的。
這是因為url為路由,刷新頁面時瀏覽器通過這個Url到后端拿資源拿不到。所以解決問題的方法放在后端,增加請求攔截。

在后端如何解決,簡單說個例子吧。

假如入你的路由url為http://127.0.0.1/demo1/about,瀏覽器刷新時,后端進入請求攔截,攔截確認是history模式,然后將request的url重定向/,而后返回。
瀏覽器從/請求頁面,然后頁面中的js發(fā)現(xiàn)url匹配路由/demo1/about,而后js渲染頁面。

可以參考Vue-router里的 connect-history-api-fallback 中間件實現(xiàn)。

2018年2月17日 19:25