搜尋
首頁運維Nginxnginx介面反向代理設定介紹

nginx介面反向代理設定介紹

作为前端开发,每次调试接口,把代码发到测试服务器,是很费时费事的一件事情。
为了提高效率,想到了nginx反向代理来解决这一问题。

接口地址:
test.com

访问地址:
localhost

最核心的问题就是,登录时,无法写入cookie的问题,为了解决这个问题,走了不少弯路。

worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile      on;
    keepalive_timeout 10;
    server {
        listen  80;
        server_name  localhost;
        
        location =/ {
            add_header X-Frame-Options SAMEORIGIN;
            root        D:/workspace/;
            index index.html;
        }

        location ~* \.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ {
            charset     utf-8;
            root        D:/workspace/;
            expires     3d;
        }
        
        location = /socket/v2 {
            proxy_pass   http://test.com;
            proxy_redirect off;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_set_header Host test.com;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_connect_timeout 30;
            proxy_send_timeout 30;
            proxy_read_timeout 60;
            proxy_buffer_size 256k;
            proxy_buffers 4 256k;
        }
        
        location / {
            proxy_pass   http://test.com;
            proxy_set_header Cookie $http_cookie;
            proxy_cookie_domain test.com localhost;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host test.com;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
        }
    }
}

核心代码在三行代码上:
proxy_set_header Cookie $http_cookie;
proxy_cookie_domain test.com localhost;
proxy_set_header Host test.com;

具体解释我也是一知半解:
第一个是携带cookie,
第二个设置cookie 的 domain
第三个 设置真实的host

重要提示:以上3个的顺序不要颠倒,否则代理失败,我也不知道为什么。

如何在手机上调试呢?

手机上不可能直接访问localhost,可以把手机和电脑连接到同一个网段,使用电脑的ip进行访问。

但是这里只代理了localhost,并没有代理电脑的ip

所以,需要把是上面的server{...}拷贝一份,只需要把里面的localhost全部改成你的电脑ip就可以了,最终代码:

worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile      on;
    keepalive_timeout 10;
    server {
        listen  80;
        server_name  localhost;
        
        location =/ {
            add_header X-Frame-Options SAMEORIGIN;
            root        D:/workspace/;
            index index.html;
        }

        location ~* \.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ {
            charset     utf-8;
            root        D:/workspace/;
            expires     3d;
        }
        
        location = /socket/v2 {
            proxy_pass   http://test.com;
            proxy_redirect off;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_set_header Host test.com;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_connect_timeout 30;
            proxy_send_timeout 30;
            proxy_read_timeout 60;
            proxy_buffer_size 256k;
            proxy_buffers 4 256k;
        }
        
        location / {
            proxy_pass   http://test.com;
            proxy_set_header Cookie $http_cookie;
            proxy_cookie_domain test.com localhost;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host test.com;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
        }
    }
    server {
        listen  8080;
        server_name  xx.xx.xx.xx;
        
        location =/ {
            add_header X-Frame-Options SAMEORIGIN;
            root        D:/workspace/;
            index index.html;
        }

        location ~* \.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ {
            charset     utf-8;
            root        D:/workspace/;
            expires     3d;
        }
        
        location = /socket/v2 {
            proxy_pass   http://test.com;
            proxy_redirect off;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_set_header Host test.com;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_connect_timeout 30;
            proxy_send_timeout 30;
            proxy_read_timeout 60;
            proxy_buffer_size 256k;
            proxy_buffers 4 256k;
        }
        
        location / {
            proxy_pass   http://test.com;
            proxy_set_header Cookie $http_cookie;
            proxy_cookie_domain test.com xx.xx.xx.xx;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host test.com;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
        }
    }
}

访问方法:

http://xx.xx.xx.xx:8080 即可

如果是打包工具生成增这个配置的话,可以用nodejs动态获取你电脑的ip

function  getIPAdress() {      
    var  interfaces  =  require('os').networkInterfaces();      
    for (var  devName  in  interfaces) {            
        var  iface  =  interfaces[devName];            
        for (var  i = 0; i < iface.length; i++) {                 
            var  alias  =  iface[i];                 
            if (alias.family  ===  &#39;IPv4&#39;  &&  alias.address  !==  &#39;127.0.0.1&#39;  &&  !alias.internal) {                       
                return  alias.address;
            }            
        }      
    }  
}

所以,这里贴出来一个动态生成nginx.config的工具

function buildNginxConfig(config) {
    function  getIPAdress() {      
        var  interfaces  =  require(&#39;os&#39;).networkInterfaces();      
        for (var  devName  in  interfaces) {            
            var  iface  =  interfaces[devName];            
            for (var  i = 0; i < iface.length; i++) {                 
                var  alias  =  iface[i];                 
                if (alias.family  ===  &#39;IPv4&#39;  &&  alias.address  !==  &#39;127.0.0.1&#39;  &&  !alias.internal) {                       
                    return  alias.address;                 
                }            
            }      
        }  
    }
    var cwd = process.cwd().replace(/\\/g, &#39;/&#39;) + &#39;/app&#39;;
    var protocol = /https|443/.test(config.ip) ? &#39;https&#39; : &#39;http&#39;;
    var servers = [{
        browserIp: &#39;localhost&#39;,
        port: 80,
        root: cwd,
        serverIp: config.ip,
        protocol: protocol,
    }, {
        browserIp: getIPAdress(),
        port: 8080,
        root: cwd,
        serverIp: config.ip,
        protocol: protocol,
    }].map(function(item) {
        return `
    server {
        listen  ${item.port};
        server_name  ${item.browserIp};
        
        location =/ {
            add_header X-Frame-Options SAMEORIGIN;
            root        ${item.root};
            index index.html;
        }
        location ~* \\.(html|htm|gif|jpg|jpeg|bmp|png|ico|txt|js|css|swf|woff|woff2|ttf|json|svg|cur|vue|otf|eot)$ {
            charset     utf-8;
            root        ${item.root};
            expires     3d;
        }
        
        location = /socket/v2 {
            proxy_pass   ${item.protocol}://${item.serverIp};
            proxy_redirect off;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_set_header Host ${item.serverIp};
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_connect_timeout 30;
            proxy_send_timeout 30;
            proxy_read_timeout 60;
            proxy_buffer_size 256k;
            proxy_buffers 4 256k;
        }
        
        location / {
            proxy_pass   ${item.protocol}://${item.serverIp};
            proxy_set_header Cookie $http_cookie;
            proxy_cookie_domain ${item.serverIp} ${item.browserIp};
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_set_header Host ${item.serverIp};
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header REMOTE-HOST $remote_addr;
        }
    }`;
    }).join(&#39;\n&#39;);
    var str = `worker_processes  1;
events {
    worker_connections  1024;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile      on;
    keepalive_timeout 10;
    ${servers}
}`;
    return str;
}
exports = module.exports = buildNginxConfig;

有了这个万能反向代理,可以随心所欲的玩转任何网站接口了

推荐教程:nginx教程

以上是nginx介面反向代理設定介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
NGINX SSL/TLS配置:使用HTTPS確保您的網站NGINX SSL/TLS配置:使用HTTPS確保您的網站Apr 10, 2025 am 09:38 AM

通過Nginx配置SSL/TLS來確保網站安全,需要以下步驟:1.創建基本配置,指定SSL證書和私鑰;2.優化配置,啟用HTTP/2和OCSPStapling;3.調試常見錯誤,如證書路徑和加密套件問題;4.應用性能優化建議,如使用Let'sEncrypt和會話復用。

NGINX面試問題:ACE您的DevOps/System Admin面試NGINX面試問題:ACE您的DevOps/System Admin面試Apr 09, 2025 am 12:14 AM

Nginx是高性能的HTTP和反向代理服務器,擅長處理高並發連接。 1)基本配置:監聽端口並提供靜態文件服務。 2)高級配置:實現反向代理和負載均衡。 3)調試技巧:檢查錯誤日誌和測試配置文件。 4)性能優化:啟用Gzip壓縮和調整緩存策略。

NGINX緩存技術:改善網站性能NGINX緩存技術:改善網站性能Apr 08, 2025 am 12:18 AM

Nginx缓存可以通过以下步骤显著提升网站性能:1)定义缓存区和设置缓存路径;2)配置缓存有效期;3)根据不同内容设置不同的缓存策略;4)优化缓存存储和负载均衡;5)监控和调试缓存效果。通过这些方法,Nginx缓存能减少后端服务器压力,提升响应速度和用户体验。

帶Docker的NGINX:部署和縮放容器化應用程序帶Docker的NGINX:部署和縮放容器化應用程序Apr 07, 2025 am 12:08 AM

使用DockerCompose可以簡化Nginx的部署和管理,通過DockerSwarm或Kubernetes進行擴展是常見的做法。 1)使用DockerCompose定義和運行Nginx容器,2)通過DockerSwarm或Kubernetes實現集群管理和自動擴展。

高級NGINX配置:掌握服務器塊和反向代理高級NGINX配置:掌握服務器塊和反向代理Apr 06, 2025 am 12:05 AM

Nginx的高級配置可以通過服務器塊和反向代理實現:1.服務器塊允許在一個實例中運行多個網站,每個塊獨立配置。 2.反向代理將請求轉發到後端服務器,實現負載均衡和緩存加速。

NGINX性能調整:針對速度和低潛伏期進行優化NGINX性能調整:針對速度和低潛伏期進行優化Apr 05, 2025 am 12:08 AM

Nginx性能調優可以通過調整worker進程數、連接池大小、啟用Gzip壓縮和HTTP/2協議、使用緩存和負載均衡來實現。 1.調整worker進程數和連接池大小:worker_processesauto;events{worker_connections1024;}。 2.啟用Gzip壓縮和HTTP/2協議:http{gzipon;server{listen443sslhttp2;}}。 3.使用緩存優化:http{proxy_cache_path/path/to/cachelevels=1:2k

NGINX安全性硬化:保護您的Web服務器免受攻擊NGINX安全性硬化:保護您的Web服務器免受攻擊Apr 04, 2025 am 12:06 AM

Nginx安全強化可以通過以下步驟實現:1)確保所有流量通過HTTPS傳輸,2)配置HTTP頭增強通信安全性,3)設置SSL/TLS加密數據傳輸,4)實施訪問控制和速率限制防範惡意流量,5)使用ngx_http_secure_link_module模塊防範SQL注入攻擊,這些措施能有效提升Nginx服務器的安全性。

NGINX負載平衡:配置高可用性和可擴展性NGINX負載平衡:配置高可用性和可擴展性Apr 03, 2025 am 12:12 AM

Nginx通過配置負載均衡可以實現高可用性和可擴展性。 1)定義上游服務器組,2)選擇合適的負載均衡算法如輪詢、加權輪詢、最少連接或IP哈希,3)優化配置並監控調整服務器權重,以確保最佳性能和穩定性。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
3 週前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
3 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

SecLists

SecLists

SecLists是最終安全測試人員的伙伴。它是一個包含各種類型清單的集合,這些清單在安全評估過程中經常使用,而且都在一個地方。 SecLists透過方便地提供安全測試人員可能需要的所有列表,幫助提高安全測試的效率和生產力。清單類型包括使用者名稱、密碼、URL、模糊測試有效載荷、敏感資料模式、Web shell等等。測試人員只需將此儲存庫拉到新的測試機上,他就可以存取所需的每種類型的清單。

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用