vue代理模式 nginx配置

30次阅读

共计 951 个字符,预计需要花费 3 分钟才能阅读完成。

前言
前端使用 vue.js 开发, 后端使用 tornado 框架提供 restful API, vue.js 使用代理; 如 当前端 js 请求 http://192.168.9.62:9000/api/orders 时候后端通过 nginx 配置去请求 http://192.168.9.62:9000/v1/orders
需求
nginx 需要将前端 js 请求 http://192.168.9.62:9000/api/orders 转发 http://192.168.9.62:9000/v1/orders
nginx 配置
upstream svrs {
# 负载均衡的 servers
server 127.0.0.1:8001;
server 127.0.0.1:8002;
server 127.0.0.1:8003;
server 127.0.0.1:8004;
server 127.0.0.1:8005;
server 127.0.0.1:8006;
server 127.0.0.1:8007;
server 127.0.0.1:8008;
server 127.0.0.1:8009;
server 127.0.0.1:8010;
}

server {
listen 9000;
server_name _;

location /v1 {
# 直接访问 http://192.168.9.62:9000/v1/orders 的配置
proxy_pass_header Server;
proxy_redirect off;
proxy_set_header Host $http_host;
proxy_set_header x-forwarded-for $remote_addr;
proxy_set_header X-Real-IP $remote_addr;
proxy_read_timeout 120;
proxy_pass http://svrs;
}

location /api {
# 访问 http://192.168.9.62:9000/api/orders 的配置
# 重写 api/ –> v1/
rewrite ^.+api/?(.*)$ /v1/$1 break;
# 后端的 API 服务器
proxy_pass http://svrs;
}

location / {
# 前端打包的静态文件
root /home/xx/xx_web;
index index.html;
}
}

正文完
 0