前提:现在有3个前端项目,分别是80端口,8001端口,8002端口,现在要部署到线上试运行,但是线上只能开放80端口,现在就需要配置nginx,使用nginx进行访问转发。操作如下:
- 打包前修改前端代码,添加公共前缀,需要修改2个文件
(1)vue3的vite.config.js【vue2应该是vue.config.js】
(2)router/index.js【修改路由文件】
- 修改nginx配置文件
之前版本的nginx配置文件:
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location / {
root /usr/share/nginx/html/ruoyi-ui/dist;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
location /prod-api/{
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://ruoyi-gateway:8080/;
}
# 避免actuator暴露
if ($request_uri ~ "/actuator") {
return 403;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
server {
listen 8001;
server_name AAA;
location / {
root /usr/share/nginx/html/AAA/dist;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
server {
listen 8002;
server_name BBB;
location / {
root /usr/share/nginx/html/BBB/dist;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}
修改后的nginx配置文件:
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location / {
root /usr/share/nginx/html/ruoyi-ui/dist;
try_files $uri $uri/ /index.html;
index index.html index.htm;
}
location /AAA {
alias /usr/share/nginx/html/AAA/dist;
try_files $uri $uri/ /AAA/index.html;
index index.html index.htm;
}
location /BBB {
alias /usr/share/nginx/html/BBB/dist;
try_files $uri $uri/ /BBB/index.html;
index index.html index.htm;
}
location /prod-api/{
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://ruoyi-gateway:8080/;
}
# 避免actuator暴露
if ($request_uri ~ "/actuator") {
return 403;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}
天下文章一大抄,求求你们写点自己的东西吧,这么点东西,我一个后端找半天,抄来抄去的。。