{"componentChunkName":"component---src-templates-blog-post-js","path":"/how-to-create-a-reverse-proxy-for-wechat-dev/","result":{"data":{"site":{"siteMetadata":{"title":"星雨之夜"}},"markdownRemark":{"id":"7662d312-1daf-5c4e-9d1a-30727cdd918f","excerpt":"假定你已经在微信公众号配置好相应的域名，比如 。 修改 macOS 下：，添加一条记录： 修改 配置 添加一个配置文件： 其他的 或其他参数可以按照规则自行添加。完成之后重新加载： 删除微信开发者工具 HSTS 缓存 如果后台服务开启了 ，并且在工具里面打开过上述域名的话，之后都会强制跳转到 https…","html":"

假定你已经在微信公众号配置好相应的域名，比如 www.example.com。

\n

修改 hosts

\n

macOS 下：sudo vim /etc/hosts，添加一条记录：

\n
127.0.0.1 www.example.com
\n

修改 nginx 配置

\n

添加一个配置文件：

\n
server {\n    listen 80;\n    server_name www.example.com;\n\n    location / {\n        proxy_pass http://127.0.0.1:8080;\n    }\n}
\n

其他的 location 或其他参数可以按照规则自行添加。完成之后重新加载：

\n
nginx -s reload
\n

删除微信开发者工具 HSTS 缓存

\n

如果后台服务开启了 HSTS，并且在工具里面打开过上述域名的话，之后都会强制跳转到 https 站点，导致我们无法直接访问 http 站点，这时我们删除：

\n
rm -rf $HOME/Library/Application\\ Support/微信web开发者工具
\n

然后重启开发者工具即可。

\n

在开发者工具里访问 http://www.example.com，它就是跑在本地 8080 端口上的应用。于是接下来就可以进行无痕微信开发啦。

","frontmatter":{"title":"如何为微信开发建立本地反向代理","date":"2018 年 10 月 11 日","description":"本文介绍如何运用 hosts 和 nginx 建立本地反向代理，包括但不限于简化微信开发流程。"}}},"pageContext":{"slug":"/how-to-create-a-reverse-proxy-for-wechat-dev/","previous":{"fields":{"slug":"/kill-process-by-name/"},"frontmatter":{"title":"按应用名字杀进程的 fish shell 脚本"}},"next":{"fields":{"slug":"/simplified-installation-steps-for-archlinux/"},"frontmatter":{"title":"Arch Linux 的简化版安装步骤整理"}}}}}