nginx本地代理调试微信登录(window版本)

NO.1
开发场景

需要在手机上调试微信登录,需要查看本地代码console等日志信息

回调地址为线上公众号,所以需要把该域名代理到本地启动的项目,便于排查

NO.2
稳定版nginx

当前的nginx稳定版为1.18.0(window版)

参考之间的文章

<<window前端设置nginx反向代理>>

NO.3
启动nginx

下载之后解压缩,然后启动默认的nginx

这次换一种启动方式

使用终端在有nginx.exe的目录下输入命令

start nginx

这种启动方式,可以随时关掉,不用像之前的./nginx.exe一样,卡在终端动不了

NO.4
检测nginx

打开网页http://localhost:80

可以看到nginx的默认页面,由此可以看到nginx成功运行

这一点很重要,不熟悉操作的,不要一上来就改配置,出了问题不好排查

NO.5
修改端口

默认配置设置的为80

可以改为其他的端口试一试,域名仍是localhost不变

nginx.conf文件下,listen改为9000

listen       9000;
server_name  localhost;

NO.6
重启nginx

终端输入

nginx -s reload

但是重启不一定生效,因为在window上的进程还可以保持之前的

NO.7
关闭nginx

终端输入

taskkill /f /t /im nginx.exe

使用这个命令,才能真正完成的干掉nginx

然后重新 start nginx 启动

NO.8
测试端口

这个时候可以看到端口为9000,访问正常

NO.9
修改域名

输入想要修改的域名,如test123.com

启动前看看,这个域名本身无法访问

listen       9000;
server_name  test123.com;

NO.10
域名有坑

这里配置了test123.com的域名

杀掉nginx进程和重启N遍,还是没有生效,甚至只保持loacalhost生效

原因是一定要记得配置hosts文件,一定不要忘了.

NO.11
配置host

这里我使用的是switchHost软件

把要访问的域名通过host先映射到本地,然后就可以设置nginx配置了

其实host文件本身就可以代理域名,但是碰上端口转发,本地html等文件代理,二级url代理,就需要nginx了

NO.12
网站url和API同域名

如果网站url和api的域名相同,那么还需要做不同代理

访问站点的时候就访问代理的地址,访问api的时候就访问api的ip

# 代理域名
location / {
    proxy_set_header host $host;
    proxy_pass   http://127.0.0.1:3000;
}

# 代理api
location /api {
    proxy_set_header host $host;
    proxy_pass   http://192.168.1.250;
}

NO.13
总结

window版本nginx有两个坑

  1. 修改nginx配置后再次启动不生效(因为有冗余进程,除非杀掉之前的)

  2. 修改端口生效,修改域名不生效(域名的代理需要host来配合)

之所以需要window本地代理nginx,是因为可以模拟排查线上等问题,定位需要域名支持的相关问题等.

如微信登录,移动端真机调试等等等