connect-history-api-fallback中間件解決history路由模式瀏覽器刷新404問題

現象:Angular、Vue和React項目SPA應用如果路由模式爲history,部署到服務器後,點擊瀏覽器刷新按鈕會出現404。
404.png
原因:當路由模式爲history的時候,服務器端會根據瀏覽器中的請求地址去匹配資源,此時服務器端沒有對應的接口地址,因此返回404.
解決辦法:使用connect-history-api-fallback中間件

安裝connect-history-api-fallback中間件
npm install --save connect-history-api-fallback
在app.js文件中增加以下代碼
const history = require('connect-history-api-fallback')
app.use('/', history());
重新啓動服務
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章