这是一个创建于 321 天前的主题，其中的信息可能已经有所发展或是发生改变。
后端，只用过最早 page.html 那种方式，现在的页面基本都是路由，比如 ip:8080/page
最近在配置 nginx ，以前的页面是 ip:8080/page ，
现在需要几个前端统一走一个端口，比如 80,
按想法就应该是在 80 服务下再配一个 web1 → ip:8080 ，
这样 ip:80/web1/page 就可以指向 ip:8080/page 了，后来发现这样只是能获取 html ，但不能获得 js 等资源。
js 资源显示的是 ip:80/page.js 。这样肯定是找不到的。
以前一直是知道这么不能弄，但不清楚为什么。
这次就特来请教下路由问题，另外就是问问如果不改前端路由，能否只从 nginx 实现这样的转发。
最近在配置 nginx ，以前的页面是 ip:8080/page ，
现在需要几个前端统一走一个端口，比如 80,
按想法就应该是在 80 服务下再配一个 web1 → ip:8080 ，
这样 ip:80/web1/page 就可以指向 ip:8080/page 了，后来发现这样只是能获取 html ，但不能获得 js 等资源。
js 资源显示的是 ip:80/page.js 。这样肯定是找不到的。
以前一直是知道这么不能弄，但不清楚为什么。
这次就特来请教下路由问题，另外就是问问如果不改前端路由，能否只从 nginx 实现这样的转发。
 |
1
yggd 321 天前
前端 build 的时候配置一下 base_url ?
用的什么写的 |
 |
2
niau 321 天前
nginx 的反向代理可以解决你的问题
|
 |
3
EyebrowsWhite 321 天前
前端打包的 html 中可能有类似这种代码
``` <script src="/page.js"><script> ``` 如果只改 nginx 的话， 你需要匹配这个`page.js`然后反代，当然也可以直接匹配所有后缀是`.js` `.css`的静态文件。 即便不改，具体还是要看一下前端的代码 |
 |
4
murmur 321 天前
所以这就是新老项目交接的问题，上了 h5 的 history 模式路由，但是没有对应 nginx 配置
要么就 history 模式，解决一切烦恼，要么静态资源上 cdn ，也没有路径烦扰 |
|
5
murmur 321 天前
更正 history->hash
|
 |
6
mringg 321 天前
1. 改前端项目代码，配置一下资源文件 base/root 的基础路径，一般框架都可以的
2. 配置 nginx ，通过 rewrite 时下不同请求路径，请求不同的资源 |
 |
8
iblessyou OP @EyebrowsWhite 匹配所有 js 等是肯定不行的，
因为现在有多个服务，web1 、web2 ，都是同样配置， 所以仅凭 ip:80/page.js ，并不能识别他是 web1 还是 web2 的 page.js 。 看来还是得前端改路由，统一添加 web1 的头。 @murmur 额，现在就是个后端在请教前端路由是怎么回事呢，你这样我只能不明觉厉啊 🤣 |
|
9
murmur 321 天前
@iblessyou 我这个是一劳永逸的解决问题，hash 模式不需要配置 nginx ，所有浏览器兼容，nginx 配半天配不明白挺糟心的，你让前端切一下路由模式一个配置选项而已。
|
|
11
murmur 321 天前
改了 hash 模式之后，url 就变成了 index.html?#web1/page 因为 js css 都是相对于 index.html 的，后面的只是个书签，所以自然是相同路径，不会有资源找不到的问题
|
|
12
murmur 321 天前
@tool2d 什么手机这么菜，我们的 app 就是用的 history 模式，history.go(-1)各种用也没问题，无论浏览器 h5 调试还是 app 的套壳
|
|
13
murmur 321 天前
更正 history->hash
|
 |
14
zhhbstudio 321 天前
vue 打包后的获取 js 、css 等资源的 url 都是 /asstes/*****，所以所有的资源都是去 ip:80 取的
vue2 的话 vue-cli 打包参考这个 https://cli.vuejs.org/zh/config/#publicpath 设置一个 publicpath 打包后请求资源会到 /{{publicpath}}/assets/**** vue3 的话 vite 打包参考这个 https://cn.vitejs.dev/config/shared-options.html#base 有问题随时回复 |
Select Language