微信公众号本地调试

1.先下载微信开发工具，选择微信公众号开发

2.去微信公众平台申请一个接口测试号，后端的代码里appid 使用测试号的

3.将局域网网映射成外网（花生壳之类），然后在测试号里找到网页账号这里，点击修改，将外网地址填入授权回调页面域名（去掉http:）

 2.然后我们去微信公众平台申请一个微信公众号测试号，并点击下面的网页授权获取用户基本信息，填入花生壳映射的域名ruyiruyi.free.idcfengye.com，不用填前面的http,然后用微信扫描测试二维码。id为

隧道id	隧道名称	隧道协议	本地端口	服务器类型	到期日期	赠送域名	状态	操作
18c52589e5967983

3.我们打开微信开发工具，选择公众号，在地址栏里输入：然后就可以获取到code,拿code去请求后台换取用户信息

    

https://open.weixin.qq.com/connect/oauth2/authorize?appid=测试账号的appid&redirect_uri=转码后的url&response_type=code&scope=snsapi_base&state=123#wechat_redirect



https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxb41bc3da0585513f&redirect_uri=http%3a%2f%2fruyiruyi.free.idcfengye.com&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect

4. 授权登录之后的回跳页面是由后台设置，会在回跳页面上带上code，将vue的xxx.com/#/home打乱，变成xxx.com/?code=xxxx&state=xxx#/home,导致支付时候一直提示页面未注册。目前的解决方法是将地址重新拼接一遍，但是进入页面时会刷新两遍。

 var hashIndex = href.indexOf('#/');
                        var url = href.substring(0, hashIndex); //vue自动在末尾加了 #/ 符号，截取去掉
                        var jingPosit = url.indexOf("home/") + 5; //获取域名结束的位置
                        var urlLeft = url.substring(0, jingPosit); //url左侧部分
                        var urlRight = url.substring(jingPosit, url.length); //url右侧部分
                        window.location.replace(urlLeft + "#" + this.$route.path);

(最后发现是配置问题，只要在支付里配置到com/即可。)

5.每次通过菜单页进入之后，APP的mounted都会执行一次，每次也会重新返回code.

6.调试时后台的appid需要改成测试号的appid。