nginx反向代理解決前后端跨域問題

1、代理和跨域

1.1 正向代理

1)用戶希望代理服務(wù)器幫助其和要訪問服務(wù)器之間實(shí)現(xiàn)通信,需要:
a.用戶IP報(bào)文的目的IP=代理服務(wù)器IP;
b.用戶報(bào)文端口號=代理服務(wù)器監(jiān)聽端口號;
c.HTTP消息里的URL要提供服務(wù)器的鏈接;
2)代理服務(wù)器可以根據(jù)HTTP消息里的URL提供服務(wù)器的鏈接與服務(wù)器進(jìn)行連接通信;
3)服務(wù)器返回網(wǎng)頁;
4)代理服務(wù)器打包網(wǎng)頁返回給用戶;

1.2 反向代理

??單個(gè)服務(wù)器的處理客戶端(用戶)請求能力是有限的,當(dāng)用戶的請求達(dá)到一定數(shù)量時(shí),會造成服務(wù)器忙,此時(shí)可以使用多個(gè)服務(wù)器共同分擔(dān)這些請求,這些服務(wù)器提供相同的服務(wù),對于客戶端而言,這些沒有任何區(qū)別。
反向代理的實(shí)現(xiàn):
??1)一個(gè)分發(fā)用戶請求的負(fù)載均衡設(shè)備,將用戶請求分發(fā)到空閑的服務(wù)器上;
??2)服務(wù)器返回自己的服務(wù)到負(fù)載均衡設(shè)備;
??3)負(fù)載均衡將服務(wù)器的服務(wù)返回用戶;
注意:客戶端做服務(wù)器域名解析時(shí),返回的IP是負(fù)載均衡的IP,而不是服務(wù)器的IP,當(dāng)新增/移除服務(wù)器時(shí),只需要修改負(fù)載均衡的服務(wù)器列表,而不會影響現(xiàn)有的服務(wù)。

1.3 兩種代理

??代理就是客戶端請求交給服務(wù)器響應(yīng);反向代理就是代理服務(wù)器的響應(yīng)返回給客戶端;即正向代理是代理客戶端,反向代理是代理服務(wù)器;

1.4 跨域

??跨域,指的是瀏覽器不能執(zhí)行其他網(wǎng)站的腳本。它是由瀏覽器的同源策略造成的,是瀏覽器對javascript施加的安全限制。
??所謂同源是指,域名,協(xié)議,端口都相同。瀏覽器執(zhí)行javascript腳本時(shí),會檢查這個(gè)腳本屬于哪個(gè)頁面,如果不是同源頁面,就不會被執(zhí)行。

2、nginx

2.1 nginx介紹

??Nginx在前后端分離框架設(shè)計(jì)中,既可以作為前端的HTTP訪問器,也可以通過簡單配置實(shí)現(xiàn)負(fù)載均衡,還可以通過反向代理配置解決前后端分離的JavaScript跨域問題。
解決方案:
??Nginx服務(wù)器中,監(jiān)聽同一個(gè)域名和端口,不同路徑轉(zhuǎn)發(fā)到客戶端和服務(wù)器,把不同端口和域名的限制通過反向代理,來解決跨域問題。

2.2 nginx安裝和配置

2.2.1 編輯nginx.conf文件

??進(jìn)入/etc/nginx目錄,編輯nginx.conf文件;將http 域內(nèi)的整個(gè)server{}內(nèi)容清除,找到include /etc/nginx/conf.d/*.conf;這行,如果沒有,添加到http {} 的關(guān)閉括號前一行,刪除或注釋掉其他的 include *.conf行。

nginx.conf配置文件

2.2.2 創(chuàng)建workload_server.conf

??在nginx.conf中已經(jīng)添加:include /etc/nginx/conf.d/*.conf;,所以先去/etc/nginx/conf.d目錄,清空所有的內(nèi)容,然后在該目錄下創(chuàng)建workload_server.conf文件;

image

2.3 部署反向代理

upstream cas_server_http {
        #ip_hash;
        server ip1 weight=1;
        #jvm_route $cookie_JSESSIONID|sessionid reverse;
}
upstream server_app1{
        #ip_hash;
        server ip2 weight=1;
}
upstream server_app2{
        least_conn;
        server ip3 weight=1;
}
server {
        listen 8190 default_server;
        listen [::]:8190 default_server;
        server_name _;
        location / {
                root /var/www/html;
                # root /usr/share/nginx/html;
                index index.html index.htm index.nginx-debian.html;
                try_files $uri $uri/ =404;
        }
        # apiApp
        location /api1/ {
                proxy_pass http://server_app1/api1/;
                proxy_set_header Host $http_host;
        }
        # apiService
        location /api2/ {
                proxy_pass http://server_app2/api2/;
                proxy_set_header Host $http_host;
        }
        # apiCas
        location /cas/ {
                proxy_pass http://cas_server_http/cas/;
                proxy_set_header Host $host;
                proxy_cookie_path /cas/ /;
                proxy_pass_header Set-Cookie;
                            }
}

2.4 nginx操作

2.4.1 啟動nginx

nginx

2.4.2 停止nginx

nginx -s stop

2.4.3 查看nginx進(jìn)程

ps -ef | grep nginx

2.4.4 修改nginx.conf后重啟nginx

nginx -s reload

3、問題

3.1 端口被占用

nginx端口被占用

解決方案:


查看nginx的進(jìn)程
查看進(jìn)程是否被殺死

3.2 403 forbidden

分析:

當(dāng)訪問該地址的時(shí)候,nginx 會按照 index.html,index.htm ,index.php 的先后順序在根目錄中查找文件。如果這三個(gè)文件都不存在,那么nginx就會返回。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 上一篇《WEB請求處理一:瀏覽器請求發(fā)起處理》,我們講述了瀏覽器端請求發(fā)起過程,通過DNS域名解析服務(wù)器IP,并建...
    七寸知架構(gòu)閱讀 81,729評論 21 356
  • Spring Cloud為開發(fā)人員提供了快速構(gòu)建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務(wù)發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,506評論 19 139
  • 《老男孩Linux運(yùn)維》Nginx Documentation 集群簡介 集群就是指一組(若干)相互獨(dú)立的計(jì)算機(jī),...
    Zhang21閱讀 3,508評論 0 51
  • 借助Nginx搭建反向代理服務(wù)器 【大型網(wǎng)站技術(shù)實(shí)踐】初級篇:借助Nginx搭建反向代理服務(wù)器 一、反向代理:We...
    全能程序猿閱讀 16,601評論 1 19
  • 基本類型 go的基本類型有: boolstringint int8 int16 int32 int64uint u...
    江河弦音閱讀 208評論 0 0

友情鏈接更多精彩內(nèi)容