vue history模式 刷新404 koa 解决办法
2019-06-14 本文已影响0人
带刀打天下
-
为什么会刷新出现404
跳转时其实不是通过请求服务器的,而是通过js操作history的API改变地址完成的。当刷新之后浏览器去请求服务器,而服务器没有这个路由,于是就404。 -
node服务 koa框架下 解决方法
- 使用
koa-connect-history-api-fallback
npm地址 - 安装
npm i koa-connect-history-api-fallback --save
- 使用方法
// 在node 服务文件 app.js 中引入 koa-connect-history-api-fallback // 注意: 该引用须在 const serve = require('koa-static'); 前 const history = require('koa-connect-history-api-fallback'); app.use(history());
- 使用
-
注意事项
- 插件默认会将所有的请求都指向到index.html,这样可能就会导致项目内其他路由也被指向到index.html,导致接口报错。
解决方法:使用koa2-connect-history-api-fallback
npm地址 该插件增加了请求白名单。 - 使用方法
// npm 安装该插件 // npm i koa2-connect-history-api-fallback --save const { historyApiFallback } = require('koa2-connect-history-api-fallback'); app.use(historyApiFallback({ whiteList: ['/api'] }));
- 插件默认会将所有的请求都指向到index.html,这样可能就会导致项目内其他路由也被指向到index.html,导致接口报错。