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());
重新启动服务
阅读 1.4k

推荐阅读