本地啟動(dòng)了一個(gè)前后端分離的WEB應(yīng)用,端口為:3000,可以通過(guò)http://127.0.0.1:3000訪問(wèn)前端頁(yè)面,頁(yè)面中有些Ajax請(qǐng)求的地址為http://127.0.0.1:3000/api/getList,一般情況下肯定是404或者請(qǐng)求失敗,如下圖:

這種后端服務(wù)的接口存放在于其他的服務(wù)器中,比如在公司內(nèi)網(wǎng)可以通過(guò)http://172.30.1.123:8081/api/getList訪問(wèn)到測(cè)試環(huán)境中的服務(wù)接口。

這種情況的請(qǐng)求就涉及到端口不一樣的跨域了,那么我們可以利用Nginx代理請(qǐng)求。

Nginx代理配置參考

首先找到Nginx配置文件:

Windows下路徑就是你安裝Nginx目錄下找,比如我的放在C盤(pán)根目錄,那就是:c:\\\\nginx\\\\conf\\\\nginx.conf
Mac系統(tǒng)配置文件路徑在: /usr/local/etc/nginx/nginx.conf, Finder下通過(guò)Shift Command G,輸入/usr/local/etc/nginx/進(jìn)入該目錄。

在Nginx配置文件中添加如下配置:

server {
 listen 80;
 server_name 127.0.0.1;

 location / {
 proxy_pass http://127.0.0.1:3000;
 }

 location ~ /api/ {
 proxy_pass http://172.30.1.123:8081;
 }
}

上面的配置的可以理解為:

監(jiān)聽(tīng)80端口(Nginx默認(rèn)啟動(dòng)了80端口),將http://127.0.0.1的所有請(qǐng)求服務(wù)轉(zhuǎn)發(fā)到127.0.0.1端口為3000;
將http://127.0.0.1/api/或者h(yuǎn)ttp://127.0.0.1/api/getList請(qǐng)求轉(zhuǎn)發(fā)到http://172.30.1.123:8081

完成

經(jīng)過(guò)上面的配置我們可以直接通過(guò)http://127.0.0.1訪問(wèn)我們的WEB應(yīng)用(如果采用IP訪問(wèn)),而相關(guān)的API請(qǐng)求也會(huì)根據(jù)我們的Nginx配置進(jìn)行相應(yīng)的請(qǐng)求,瀏覽器端看到的/api/getList請(qǐng)求的是127.0.0.1端口為80的端口,但是實(shí)際上這個(gè)請(qǐng)求已經(jīng)被我們的Nginx轉(zhuǎn)發(fā)指向http://172.30.1.123:8081/api/getList

優(yōu)化:

基本的代理功能就像上面如此簡(jiǎn)單的配置即可。

但是,當(dāng)我們需要獲取真實(shí)IP的業(yè)務(wù)時(shí),還需要添加關(guān)于真實(shí)IP的配置,如下:

server {
 listen 80;
 server_name 127.0.0.1;

 location / {
 proxy_pass http://127.0.0.1:3000;
 proxy_set_header Host $host:80;
 proxy_set_header X-Real-IP $remote_addr;
 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
 }

 location ~ /api/ {
 proxy_pass http://172.30.1.123:8081;
 proxy_set_header Host $host:80;
 proxy_set_header X-Real-IP $remote_addr;
 proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
 }
}

proxy_set_header這個(gè)配置是改變HTTP的請(qǐng)求頭,而Host是請(qǐng)求的主機(jī)名,X-Real-IP是請(qǐng)求的真實(shí)IP,X-Forwarded-For表示請(qǐng)求是由誰(shuí)發(fā)起的。

因?yàn)槲覀兊腘ginx在這里屬于代理服務(wù)器,通過(guò)proxy_set_header配置這些信息目的是讓服務(wù)端獲取到真實(shí)的請(qǐng)求頭。

友情提示:

Nginx每一條配置語(yǔ)句后面都必須要加分好; 否則會(huì)報(bào)配置錯(cuò)誤,自己還一臉懵逼。

拓展

綁定host

如果你覺(jué)得輸入IP訪問(wèn)不爽那你可以自己修改host,推薦host修改神器:SwitchHosts。

host修改參考:

127.0.0.1 www.domain.com  #改成你需要的任何域名

如果綁定了host,在Nginx配置中當(dāng)然也可以直接配置你指定的域名,譬如:

server {
 listen 80;
 server_name www.domain.com; #這里將IP改成你的域名
 #...
}

修改host后你可以直接通過(guò)你的域名訪問(wèn),如:http://www.domain.com

關(guān)于location

上面的配置你可能會(huì)對(duì)localtion后面的配置感到疑惑,關(guān)于localtion后面的常用的需求有:

localtion / {
 # 所有請(qǐng)求都匹配以下規(guī)則
 # 因?yàn)樗械牡刂范家?/ 開(kāi)頭,所以這條規(guī)則將匹配到所有請(qǐng)求
 # xxx 你的配置寫(xiě)在這里
}

location = / {
 # 精確匹配 / ,后面帶任何字符串的地址都不符合
}

localtion /api {
 # 匹配任何 /api 開(kāi)頭的URL,包括 /api 后面任意的, 比如 /api/getList
 # 匹配符合以后,還要繼續(xù)往下搜索
 # 只有后面的正則表達(dá)式?jīng)]有匹配到時(shí),這一條才會(huì)采用這一條
}

localtion ~ /api/abc {
 # 匹配任何 /api/abc 開(kāi)頭的URL,包括 /api/abc 后面任意的, 比如 /api/abc/getList
 # 匹配符合以后,還要繼續(xù)往下搜索
 # 只有后面的正則表達(dá)式?jīng)]有匹配到時(shí),這一條才會(huì)采用這一條
}
以/ 通用匹配, 如果沒(méi)有其它匹配,任何請(qǐng)求都會(huì)匹配到
=開(kāi)頭表示精確匹配
如 A 中只匹配根目錄結(jié)尾的請(qǐng)求,后面不能帶任何字符串。
^~ 開(kāi)頭表示uri以某個(gè)常規(guī)字符串開(kāi)頭,不是正則匹配
~ 開(kāi)頭表示區(qū)分大小寫(xiě)的正則匹配;
~* 開(kāi)頭表示不區(qū)分大小寫(xiě)的正則匹配

更多詳細(xì)localtion的正則匹配規(guī)則可參考:nginx配置location總結(jié)及rewrite規(guī)則寫(xiě)法

后記

筆者也是Nginx的初級(jí)使用者,希望通過(guò)通俗易懂的方式記錄這些知識(shí),分享給有需要的人,一起鉆研學(xué)習(xí),如有紕漏,歡迎指正,謝謝!

總結(jié)

以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,謝謝大家對(duì)三五互聯(lián)的支持。

更多關(guān)于云服務(wù)器域名注冊(cè),虛擬主機(jī)的問(wèn)題,請(qǐng)?jiān)L問(wèn)三五互聯(lián)官網(wǎng):m.shinetop.cn

贊(0)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享網(wǎng)絡(luò)內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。郵箱:3140448839@qq.com。本站原創(chuàng)內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明出處:三五互聯(lián)知識(shí)庫(kù) » 通過(guò)Nginx代理轉(zhuǎn)發(fā)配置實(shí)現(xiàn)跨域的方法(API代理轉(zhuǎn)發(fā))

登錄

找回密碼

注冊(cè)

主站蜘蛛池模板: 激情综合色综合久久综合| 饥渴少妇高潮正在播放| 亚洲老女人区一区二视频| 欧美日韩在线亚洲二区综二| 免费看欧美日韩一区二区三区| 亚洲av成人精品日韩一区 | 亚洲色大成网站www看下面| 久久精品国产亚洲AV麻豆长发| 中文人妻无码一区二区三区在线| 国产av国片精品一区二区| 国产女人看国产在线女人| 日韩黄色av一区二区三区 | 91福利视频一区二区| 密山市| 国产成人毛片在线视频| 国产精品高清一区二区三区| 亚洲国产精品午夜福利| 真人性囗交视频| 人妻精品久久无码区| 国产欧美日韩精品丝袜高跟鞋 | 久久精品国产久精国产一老狼| 久久99热只有频精品8| 日日躁夜夜躁狠狠久久av| 亚洲国产欧美在线人成AAAA| 久久亚洲精品中文字幕波多野结衣| 国产精品高清一区二区三区| 久久国产成人午夜av影院| 2020国产欧洲精品网站| 精品亚洲国产成人| 久久99九九精品久久久久蜜桃| 永久免费的av在线电影网| 亚洲天堂亚洲天堂亚洲色图| 国产一卡2卡3卡4卡网站精品| 免费可以在线看a∨网站| 国产精品一区二区小视频| 久久97超碰色中文字幕蜜芽| 人人妻人人澡人人爽曰本| 一级做a爰片久久毛片下载| 国产精品无码v在线观看| 四虎影院176| 亚欧洲乱码视频在线观看|