搜索
首页运维Nginxnginx接口反向代理配置介绍

nginx接口反向代理配置介绍

青灯夜游
青灯夜游
Jun 16, 2020 am 09:10 AM
nginx

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 vs. apache终极摊牌：nginx vs. apacheApr 18, 2025 am 12:02 AM

NGINX适合处理高并发请求，Apache适合需要复杂配置和功能扩展的场景。1.NGINX采用事件驱动、非阻塞架构，适用于高并发环境。2.Apache采用进程或线程模型，提供丰富的模块生态系统，适合复杂配置需求。

nginx行动：示例和现实应用程序nginx行动：示例和现实应用程序Apr 17, 2025 am 12:18 AM

NGINX可用于提升网站性能、安全性和可扩展性。1)作为反向代理和负载均衡器，NGINX可优化后端服务和分担流量。2)通过事件驱动和异步架构，NGINX高效处理高并发连接。3)配置文件允许灵活定义规则，如静态文件服务和负载均衡。4)优化建议包括启用Gzip压缩、使用缓存和调整worker进程。

NGINX单元：支持不同的编程语言NGINX单元：支持不同的编程语言Apr 16, 2025 am 12:15 AM

NGINXUnit支持多种编程语言，通过模块化设计实现。1.加载语言模块：根据配置文件加载相应模块。2.应用启动：调用语言运行时执行应用代码。3.请求处理：将请求转发给应用实例。4.响应返回：将处理后的响应返回给客户端。

在Nginx和Apache之间进行选择：适合您的需求在Nginx和Apache之间进行选择：适合您的需求Apr 15, 2025 am 12:04 AM

NGINX和Apache各有优劣，适合不同场景。1.NGINX适合高并发和低资源消耗场景。2.Apache适合需要复杂配置和丰富模块的场景。通过比较它们的核心特性、性能差异和最佳实践，可以帮助你选择最适合需求的服务器软件。

nginx怎么启动nginx怎么启动Apr 14, 2025 pm 01:06 PM

问题：如何启动 Nginx？答案：安装 Nginx启动 Nginx验证 Nginx 是否已启动探索其他启动选项自动启动 Nginx

怎么查看nginx是否启动怎么查看nginx是否启动Apr 14, 2025 pm 01:03 PM

确认 Nginx 是否启动的方法：1. 使用命令行：systemctl status nginx（Linux/Unix）、netstat -ano | findstr 80（Windows）；2. 检查端口 80 是否开放；3. 查看系统日志中 Nginx 启动消息；4. 使用第三方工具，如 Nagios、Zabbix、Icinga。

nginx怎么关闭nginx怎么关闭Apr 14, 2025 pm 01:00 PM

要关闭 Nginx 服务，请按以下步骤操作：确定安装类型：Red Hat/CentOS（systemctl status nginx）或 Debian/Ubuntu（service nginx status）停止服务：Red Hat/CentOS（systemctl stop nginx）或 Debian/Ubuntu（service nginx stop）禁用自动启动（可选）：Red Hat/CentOS（systemctl disable nginx）或 Debian/Ubuntu（syst

nginx在windows中怎么配置nginx在windows中怎么配置Apr 14, 2025 pm 12:57 PM

如何在 Windows 中配置 Nginx？安装 Nginx 并创建虚拟主机配置。修改主配置文件并包含虚拟主机配置。启动或重新加载 Nginx。测试配置并查看网站。选择性启用 SSL 并配置 SSL 证书。选择性设置防火墙允许 80 和 443 端口流量。

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.能量晶体解释及其做什么（黄色晶体）
1 个月前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
1 个月前By尊渡假赌尊渡假赌尊渡假赌
刺客信条阴影：贝壳谜语解决方案
3 周前ByDDD
Windows 11 KB5054979中的新功能以及如何解决更新问题
2 周前ByDDD
威尔R.E.P.O.有交叉游戏吗？
1 个月前By尊渡假赌尊渡假赌尊渡假赌
显示更多

热工具

MinGW - 适用于 Windows 的极简 GNU

MinGW - 适用于 Windows 的极简 GNU

这个项目正在迁移到osdn.net/projects/mingw的过程中，你可以继续在那里关注我们。MinGW：GNU编译器集合（GCC）的本地Windows移植版本，可自由分发的导入库和用于构建本地Windows应用程序的头文件；包括对MSVC运行时的扩展，以支持C99功能。MinGW的所有软件都可以在64位Windows平台上运行。

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

WebStorm Mac版

WebStorm Mac版

好用的JavaScript开发工具

ZendStudio 13.5.1 Mac

ZendStudio 13.5.1 Mac

功能强大的PHP集成开发环境

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

显示更多

热门话题

gmail邮箱登陆入口在哪里
7554
15
CakePHP 教程
1382
52
steam的账户名称是什么格式
83
11
win11激活密钥永久
59
19
NYT连接提示和答案
28
96
显示更多