nginx通过location配置代理的原理和实现方式
nginx通过location配置代理的原理和方式，是我们作为运维人员需要熟知的内容，前后端服务通过nginx作为桥梁互通访问，今天我们分享一下具体使用场景。
一、场景一：单一网络环境
1、互联网环境
1）不用nginx负载
通过VsCode、Hbuilder、WebStorm 等前端开发工具 ，本地启动启动前端代码，启动后用默认ip（localhost（127.0.0.1））、端口号8080或者是随机生成的，前端页面打开后，直接调用后端接口，接口的ip地址可以直接写在代码里，自动触发直接访问后端服务。前端代码一般会使用相对路径或者没有完整写出 IP 和端口的接口地址，比如：
axios.get('/api/user') 这种情况下：前端系统会根据你当前运行的环境来推断请求的地址。如果你是通过 HBuilder 启动本地开发环境（如使用 HBuilderX 直接启动或者 npm run dev ），它会根据默认的开发服务器（通常是 localhost 或 127.0.0.1）来拼接出完整的请求 URL。请求会默认发送到：
http://localhost:8080/api/user
（假设你的本地服务器是在 8080 端口上运行的）。这个过程本质上是因为浏览器或应用会将请求的路径补充为完整的 URL，基于当前运行环境的 IP 和端口来自动推导。
假如：你在代码中明确指定了完整的后端接口地址，例如：
axios.get('http://192.168.1.100:3000/api/user')此时，无论你是在本地开发还是部署到服务器，前端代码都会按照这个地址去发送请求。此时，前端不会再使用默认的地址和端口，因为你已经显式提供了完整的域名/IP 和端口。这意味着，在这种情况下，系统不会再进行自动拼接，并且请求会直接发送到你指定的后端地址，而不会涉及默认的本地地址。
2）使用nginx代理前端代码
此环境中把前端代码打包后放到nginx负载包下面的html文件夹下面，nginx.conf 配置文件中简单的配置一下代理地址。
server {
listen 8081;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html/build-f/build/web; #效果
index index.html index.htm;
}
}前端代码通过nginx，后端代码直接在浏览器请求了，不经过nginx负载了。
3）使用nginx代理前后端代码
如果后端的API接口也要通过nginx代理，那么需要额外添加配置
server {
listen 8081;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html/build-jt-f/build-jt/web; #效果
index index.html index.htm;
}
# 后台请求接口转发到接口地址
location /nandao/url1Server {
#add_header 'Access-Control-Allow-Origin' '*';
#add_header 'Access-Control-Allow-Methods' 'POST,GET,OPTIONS';
proxy_pass http://localhost:8888/;
rewrite ^/nandao/url1Server/(.*) /$1 break;
}
}这样配置之后的运行逻辑如下：
- 浏览器上显示的请求地址如下：
http://localhost:8081/nandao/url1Server/basin/selectCity?code=010
- 经过nginx后实际请求后端接口的全路径如下：
http://localhost:8888/basin/selectCity?code=010
即：http://localhost:8081 换成 http://localhost:8888，然后 /nandao/url1Server/ 字符串去掉！
2、局域网环境
全局域网环境和互联网环境类似，不牵涉到网络问题，思路是一致的。
二、场景二：多种网络环境
1、页面端互联网访问局域网
前后端服务均部署到局域网，现在要配置通过互联网域名访问局域网的应用。
一般有以下几个方案：配置NAT和端口映射（一般通过路由器）、配置反向代理（使用Nginx或其他代理服务器）、使用VPN（虚拟专用网络）、通过公网IP直接访问（如果有公网IP）。
此处我们分析常用的nginx反向代理：在公网可访问的服务器上部署 Nginx，配置反向代理，将用户请求转发到局域网内的应用。
假设你已经将公网域名 yourdomain.com 解析到 Nginx 服务器上，Nginx 配置文件如下：
server {
listen 80;
server_name yourdomain.com;
#http://yourdomain.com 转发到 http://192.168.1.100:8080
location / {
proxy_pass http://192.168.1.100:8080; # 将请求转发到内网应用
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
#http://yourdomain.com/nandao 转发到 http://192.168.1.100:8080/nandao
location /nandao {
proxy_pass http://192.168.1.100:8080; # 将请求转发到内网应用
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
}
#http://yourdomain.com/nandao 转发到 http://192.168.1.100:8080
location /nandao {
proxy_pass http://192.168.1.100:8080; # 将请求转发到内网应用
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
rewrite ^/nandao/(.*) /$1 break;
}
}注意：http://192.168.1.100:8080 此地址在改服务器上可以 telnet 通。（服务器有内网、外网、浮动ip的区别）
2、API接口代理转发
接着上面的流程：转发到 nginx后 192.168.1.100:8080 ，前端页面和后端接口
server {
listen 8080;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
root html/build-jt-f/build-jt/web; #效果
index index.html index.htm;
}
# 后台请求接口转发到接口地址
location /nandao/url1Server {
#add_header 'Access-Control-Allow-Origin' '*';
#add_header 'Access-Control-Allow-Methods' 'POST,GET,OPTIONS';
proxy_pass http://localhost:8888/;#或者是其他ip,其他此服务器里可以ping 通
rewrite ^/nandao/url1Server/(.*) /$1 break;
}
}三、匹配规则
默认匹配：
server {
listen 8081;
server_name localhost;
location / {
root html/build-jt-f/build-jt/web;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
}
#页面访问地址http://localhost:8081/nandao/没有/nandao/ 模块配置时，请求会默认匹配 location /，Nginx 会将 /nandao/ 转发到 html/build-jt-f/build-jt/web/nandao/ 目录下查找静态文件。
server {
listen 8081;
server_name localhost;
location / {
alias html/build-jt-f/build-jt/web;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
}如果是alias 参数：
- 使用
alias指令时，Nginx 会将请求路径中的/nandao/前缀替换为alias指定的路径。 - 指定了静态文件的实际目录，
/nandao/前缀被移除，路径变为html/build-jt-f/build-jt/web/。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
goaccess 工具提供快速、多样的HTTP状态统计，可以令管理员不再纠结于统计各类数据，和繁杂的指令以及一大堆管道/正则表达式说再见，今天通过本文给大家介绍goaccess 分析nginx 日志的方法，需要的朋友一起看看吧2021-07-07
本文主要介绍了nginx Rewrite重写地址的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-07-07
在现代Web架构中,Nginx作为高性能的反向代理服务器,早已成为互联网基础设施的重要组成部分,本篇博客将从零开始,带你一步步在Linux系统上搭建一个完整的 Nginx 反向代理环境,并结合Java后端服务进行实际演示,需要的朋友可以参考下2026-04-04
这篇文章主要介绍了nginx 负载均衡的三种参数设置,需要的朋友可以参考下2017-07-07
详解nginx 的 default_server 定义及匹配规则
这篇文章主要介绍了详解nginx 的 default_server 定义及匹配规则，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-08-08
Nginx作为最流行的Web服务器之一,其灵活的日志配置能力允许我们根据需求定制日志格式,本文将详细介绍如何配置Nginx以JSON格式记录访问日志,这种结构化日志格式特别适合ELK等日志分析系统处理,感兴趣的朋友一起看看吧2025-03-03
下面小编就为大家分享一篇基于Nginx 反向代理获取真实IP的问题详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-01-01
这篇文章主要介绍了nginx中使用lua脚本的方法,本文介绍通过第三方模块lua-nginx-module实现lua脚本在nginx的调用,并附一个配置例子,需要的朋友可以参考下2014-07-07
想让Nginx支持中文文件名首先得让你的系统有中语语言包,设置前可以执行：locale 看一下，如果显示是en_US.UTF-8，即是正常，不用按下面的步骤设置2013-06-06
本文主要介绍了Keepalived+Nginx双机配置小结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2025-03-03
最新评论