原理：

正向代理：正向代理代理的是客戶端。比如我們無法直接在瀏覽器上訪問YouTube，但我們開個加速器，就可以訪問了，此時這個加速器就是正向代理服務(wù)器。這個加速器能訪問YouTube，加速器接收到我們的請求后，把請求轉(zhuǎn)發(fā)到Y(jié)ouTube，YouTube返回資源給加速器，加速器再返回資源給我們，這就是正向代理。

正向代理最大的特點是服務(wù)器只清楚請求來自哪個代理服務(wù)器，而不清楚來自哪個具體的客戶端，正向代理模式屏蔽或者隱藏了真實客戶端信息。

反向代理：反向代理代理的是服務(wù)器。還是上面的例子，YouTube的每日訪問量很大，如果只用一臺服務(wù)器處理所有請求很容易崩潰，于是會采用分布式部署，有多臺服務(wù)器處理請求?？蛻舭l(fā)送請求，DNS服務(wù)器把域名解析到nginx服務(wù)器上，nginx服務(wù)器按照一定規(guī)則把請求分發(fā)到不同的服務(wù)器上進行處理，這時nginx代理的就是YouTube服務(wù)器。

nginx隱藏了服務(wù)器的信息。

問題：

nginx.conf配置文件內(nèi)容：

server {
    listen       8092;     #這里把8092改成你的服務(wù)在docker容器內(nèi)運行的端口號
    server_name  localhost;   #這里把localhost改成你的服務(wù)器的IP地址

    location /admin/ {    #這里的admin是重點，看下面分析
      proxy_pass http://localhost:56000;   #這里把localhost改成后端服務(wù)器的IP地址，把56000改成后端服務(wù)的端口號
    }

	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 / 的內(nèi)容要放在location /admin/ 內(nèi)容的后面，這是配置優(yōu)先級的問題，location /是通用配置，location /admin/是精準(zhǔn)配置，精準(zhǔn)配置的優(yōu)先級要高于通用配置，如果通用配置放在精準(zhǔn)配置前面，有可能發(fā)生請求被通用配置匹配，執(zhí)行不到后面的精準(zhǔn)配置，會發(fā)生代理無效前后端連接不上的問題。

2、精準(zhǔn)配置中的路徑問題。首先，檢查前端代碼中有無進行下面這段配置的行為，如果有，那上面配置文件中的admin就要改成設(shè)置的api（或是你設(shè)置的其他值）；如果前端中沒有進行這樣的配置，就檢查后端所有的接口路徑是否都有統(tǒng)一的前綴，如果有，就把上面的admin改成你統(tǒng)一的前綴，如果沒有，就在手動在前端配置前綴或者在后端接口上配置前綴。不然，無法進行匹配，請求就無法轉(zhuǎn)發(fā)到后端接口，前后端就連接不上。

// 創(chuàng)建axios實例
const service = axios.create({
  baseURL: "/api", // 我們配置的代理路徑，得和等下nginx配置的后端服務(wù)路徑匹配
  // baseURL: "process.env.BASE_URL", 
  timeout: 60 * 1000 // 請求超時時間
})

附：檢查nginx的錯誤日志，基本常見的有以下幾種原因造成的

1.反向代理會根據(jù)轉(zhuǎn)發(fā)數(shù)據(jù)大小，若過大會自動使用upstream

2.代理的時候若不想請求頭發(fā)生變化可以做如下設(shè)置

proxy_set_header Host $host:$server_port;

$host 就是server_name

$server_port 就是server中配置的端口

3.運行nginx的用戶沒有權(quán)限

可修改nginx.conf的執(zhí)行用戶為root，或是賦予當(dāng)前執(zhí)行用戶相應(yīng)權(quán)限。

總結(jié) 

到此這篇關(guān)于nginx反向代理失效前端無法獲取后端的數(shù)據(jù)解決的文章就介紹到這了,更多相關(guān)nginx反向代理失效內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論