项目背景
前后端分离项目,前端采用elmadmin,后端为springcloud架构,多个微服务统一项目配置gateway网关,网关地址192.168.64.4:8000。
- 网关将各个微服务接口统一加上/api/services前缀;
- 前端配置代理,将网关接口统一加上/api前缀;
后端代理
- 去除前端url中的/api;
- 通过nginx访问网关地址;
# 1、登录接口配置,登录前端访问接口/api/center/login,后台真实接口/center/login
location /api/center/ {
proxy_pass http://192.168.64.4:8000/center/;
}
# 2、geteway网关统一配置了/api/services/。前端访问地址(加了代理,url多一个api) /api/api/services/
location /api/api/services/ {
proxy_pass http://192.168.64.4:8000/api/services/;
}
前端代理
- 前端dist压缩包解压后放到/usr/share/nginx/html/dist路径下
- 通过nginx访问静态文件
# 前端页面配置 ,前端dist解压包放到/usr/share/nginx/html路径下
location ^~ / {
proxy_set_header HOST $host;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# 加这个是支持history的路由模式
try_files $uri $uri/ /index.html;
root /usr/share/nginx/html/dist;
index index.html;
}
nginx.conf文件
全文件,可直接拷贝修改使用
user nginx;
worker_processes 2;
error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid;
events {
worker_connections 2048;
}
http {
include /etc/nginx/mime.types;
default_type application/octet-stream;
client_max_body_size 1024M;
client_body_buffer_size 6M;
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';
access_log /var/log/nginx/access.log main;
sendfile on;
#tcp_nopush on;
keepalive_timeout 65;
#gzip on;
server {
listen 80; # 侦听80端口,如果强制所有的访问都必须是HTTPs的,这行需要注销掉
server_name localhost;
client_max_body_size 30240m;
proxy_intercept_errors on;
fastcgi_intercept_errors on;
# 后端微服务接口配置:
# 1、登录接口配置,登录前端访问接口/api/center/login,后台真实接口/center/login
location /api/center/ {
proxy_pass http://192.168.64.4:8000/center/;
}
# 2、geteway网关统一配置了/api/services/。前端访问地址(加了代理,url多一个api) /api/api/services/
location /api/api/services/ {
proxy_pass http://192.168.64.4:8000/api/services/;
}
# 前端页面配置 ,前端dist解压包放到/usr/share/nginx/html路径下
location ^~ / {
proxy_set_header HOST $host;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
# 加这个是支持history的路由模式
try_files $uri $uri/ /index.html;
root /usr/share/nginx/html/dist;
index index.html;
}
}
}