标签（空格分隔）： 前端
前言
微信公众号调试需要域名在 微信管理后台白名单中，因此对于本地调试特别不方便。为了在本地模拟出线上的环境，骗过微信的域名检查，可以通过 host + nginx 反向代理来实现本地调试。
host 文件
修改 host 文件，添加白名单域名的映射，访问域名就是访问本地了
127.0.0.1 www.whitelist.com
nginx 配置
nginx -t 得知本地配置文件位置，修改它
# http 内添加以下内容
server {
listen 80; # 监听本机 80 端口，也就是默认端口
server_name www.whitelist.com; # 监听域名
location / {
# 代理该域名到 8080 端口，就是前端跑起开发环境
proxy_pass http://127.0.0.1:8080;
# 解决 content mismatch
# proxy_buffering off;
}
}
# 如果使用 webpack-dev-server 疯狂报错，可以使用下面解决 ws报错问题
server {
listen 80;
server_name localhost;
location /sockjs-node/ {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $remote_addr;
proxy_pass http://127.0.0.1:8080/sockjs-node/;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}
}
最后 nginx -s reload 或者 nginx
开发者工具问题
开发者工具默认开启 HSTS，就是访问过 https 的网站，是访问不到 http 的，会自动转为 https，而且不能关掉。如果出现该问题可以删掉开发者工具的用户信息，并重启开发者工具。
mac: $HOME/Library/Application\ Support/微信开发者工具
win: C:\Users\xxxxx\AppData\Local\微信开发者工具\User Data
