将 vue 项目打包后放入 node 服务端的静态资源中访问，要如何配置 history 模式？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 1685 天前的主题，其中的信息可能已经有所发展或是发生改变。

一个项目下同时包括 web （ web 页面），admin （后台管理系统），server （ node 服务器）。

将 web 项目和 admin 项目打包后放入 node 服务端的静态资源中访问。 web 项目对应的是 /路由下的静态资源，admin 项目对应的是 /admin 路由下的静态资源。

nginx 中的配置是这样的，实际上运行的是 node 服务端。

location / {
    proxy_pass http://127.0.0.1:3000;
    include nginxconfig.io/proxy.conf;
}

我在 server 中使用了官方推荐的 connect-history-api-fallback 中间件，来做

server/index.js

如下，其中 history 为 connect-history-api-fallback 中间件

app.use('/admin', history(), express.static(__dirname + '/admin')) // admin 编译后静态文件托管
app.use('/', history(), express.static(__dirname + '/web')) // web 编译后静态文件托管

这时候使用 history 模式访问 web 的路由（/下的路由）没用问题，访问后台管理系统（/admin 路由）返回 index.html 和 js 都是 /路由下的？？？导致一直白屏

求教这是哪里不对呢

第 1 条附言 · 2020-03-25 18:44:13 +08:00

返回后页面上有 index.html，也加载了路由组件的 js 和 css，但是就是白屏，查看返回显示就是

We're sorry but admin doesn't work properly without JavaScript enabled. Please enable it to continue.

第 2 条附言 · 2020-03-25 19:02:34 +08:00

放弃使用connect-history-api-fallback中间件了。。。

现在的问题是当访问/admin路由的时候，一直给我返回的是/路由的首页。。。

nginx里还是上面那样配置的

admin

History

静态

Web

6 条回复 • 2020-03-26 18:25:32 +08:00