阅读 203

微信公众号本地调试开发

前因说明

公众号开发时由于微信限制:"用户在网页授权页同意授权给公众号后,微信会将授权数据传给一个回调页面回调页面需在此域名下,以确保安全可靠"。如下图所示,只有进行在网页授权域名下的域名才能进行授权或调用其他微信SDK的方法。但域名是打包发布后才会使用的,这对于调试来说极其不友好,意味着你要调试必须每次发布代码以后才能进行。本文就前端时时本地开发调试讲一下方法。

方法介绍

我知道 两种方法。

  1. 将公众号后台配置的域名,本地访问时解析到本地。
  2. 配置一个redirect_uri在公用方法,这个方法要先发布上线。进行授权页访问时存在2个redirect_uri。第一个个redirect_uri到后台配置的域名。在通过前面提到的公用方法个redirect_uri到本地IP.

本文主讲第一种方法,步骤大纲:

  • 域名解析到本地
  • nginx端口转发(可省略此步骤)

域名解析到本地

微信后台配置的域名(这里我配置的是www.test.cn)在本地访问时解析到本地。其实很简单,修改hosts文件(不会的参考这里)即可,如图所示:

这时我们可以测试一下是否有效,访问www.test.cn:8080等价于访问127.0.0.1:8080。有效在进行下一步。

端口转发

前面提到可省略此步骤,此时进行调试访问www.test.cn:8080,即hosts文件中配置的域名加本地开发端口即可。

做端口转发则在调试时就不需要端口了,访问www.test.cn即可。通过nginx配置如下图。因为网页默认是80端口,通过Nginx做端口转发本地调试端口

    server {
            listen       80;
            server_name  localhost;
    
            #charset koi8-r;
    
            #access_log  logs/host.access.log  main;
    
            location / {
                root   html;
                index  index.html index.htm;
                proxy_pass http://127.0.0.1:8080;
            }
    }
复制代码

特殊注意点

如果是用到本文中的方法一修改hosts文件来进行调试,可能会遇到一个障碍。如果你的前端域名接口域名一样的话,那此时接口肯定访问报错了,因为接口访问也都解析访问你本地服务了。

解决办法: 将后台接口域名用IP+端口的方式访问即可。

小结

上面提到的2个方法都很简单。其中方法一简单高效,但团队开发时每个人都要做一遍配置。方法二本文并没有详细讲解,但确是一劳永逸的方法,正所谓前人裁树后人乘凉,缺点是本地调试时会多一次跳转。

马上就要失业了,有成都大佬招人么?

关注下面的标签,发现更多相似文章
评论