nginx反向代理失效前端无法获取后端的数据解决办法

原理：

正向代理：正向代理代理的是客户端。比如我们无法直接在浏览器上访问YouTube，但我们开个加速器，就可以访问了，此时这个加速器就是正向代理服务器。这个加速器能访问YouTube，加速器接收到我们的请求后，把请求转发到YouTube，YouTube返回资源给加速器，加速器再返回资源给我们，这就是正向代理。

正向代理最大的特点是服务器只清楚请求来自哪个代理服务器，而不清楚来自哪个具体的客户端，正向代理模式屏蔽或者隐藏了真实客户端信息。

反向代理：反向代理代理的是服务器。还是上面的例子，YouTube的每日访问量很大，如果只用一台服务器处理所有请求很容易崩溃，于是会采用分布式部署，有多台服务器处理请求。客户发送请求，DNS服务器把域名解析到nginx服务器上，nginx服务器按照一定规则把请求分发到不同的服务器上进行处理，这时nginx代理的就是YouTube服务器。

nginx隐藏了服务器的信息。

问题：

nginx.conf配置文件内容：

server {
    listen       8092;     #这里把8092改成你的服务在docker容器内运行的端口号
    server_name  localhost;   #这里把localhost改成你的服务器的IP地址

    location /admin/ {    #这里的admin是重点，看下面分析
      proxy_pass http://localhost:56000;   #这里把localhost改成后端服务器的IP地址，把56000改成后端服务的端口号
    }

	location / {
	        root   /usr/share/nginx/html;
	        index  index.html;
	        try_files $uri $uri/ /index.html;
	}
 
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

注意：

1、location / 的内容要放在location /admin/ 内容的后面，这是配置优先级的问题，location /是通用配置，location /admin/是精准配置，精准配置的优先级要高于通用配置，如果通用配置放在精准配置前面，有可能发生请求被通用配置匹配，执行不到后面的精准配置，会发生代理无效前后端连接不上的问题。

2、精准配置中的路径问题。首先，检查前端代码中有无进行下面这段配置的行为，如果有，那上面配置文件中的admin就要改成设置的api（或是你设置的其他值）；如果前端中没有进行这样的配置，就检查后端所有的接口路径是否都有统一的前缀，如果有，就把上面的admin改成你统一的前缀，如果没有，就在手动在前端配置前缀或者在后端接口上配置前缀。不然，无法进行匹配，请求就无法转发到后端接口，前后端就连接不上。

// 创建axios实例
const service = axios.create({
  baseURL: "/api", // 我们配置的代理路径，得和等下nginx配置的后端服务路径匹配
  // baseURL: "process.env.BASE_URL", 
  timeout: 60 * 1000 // 请求超时时间
})

附：检查nginx的错误日志，基本常见的有以下几种原因造成的

1.反向代理会根据转发数据大小，若过大会自动使用upstream

2.代理的时候若不想请求头发生变化可以做如下设置

proxy_set_header Host $host:$server_port;

$host 就是server_name

$server_port 就是server中配置的端口

3.运行nginx的用户没有权限

可修改nginx.conf的执行用户为root，或是赋予当前执行用户相应权限。

总结 

到此这篇关于nginx反向代理失效前端无法获取后端的数据解决的文章就介绍到这了,更多相关nginx反向代理失效内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！

最新评论