微信开发本地内网调试方法 转

简介

  • 由于微信浏览器中获取用户信息的回调地址必须是已经ICP备案的域名。这样就导致无法本地开发比较麻烦,解决方案为内网穿透,如ngrok(二级域名每次启动会变化)、花生壳(需要支付8元)、NATAPP(和ngrok类似,本文使用)。
  • 本程序基于微信开发者工具完成调试

NATAPP使用

  • 注册NATAPP并实名认证
  • 购买隧道 - 免费隧道 - Web(端口80)- 购买之后可在我的隧道中查看 - 复制authtoken
  • 下载NATAPP客户端natapp.exe
  • 在客户端根目录cmd运行natapp -authtoken=上文提到的authtoken。命令行会出现类似Forwarding http://smalle.natappfree.cc -> 127.0.0.1:80的显示。(表示访问在浏览器中访问http://smalle.natappfree.cc时相当于本地访问127.0.0.1:80)
    • 或者写入xxx.bat文件快速启动:D:/software/natapp.exe -authtoken=12347dc3f25a1234

启动本地web项目

本地项目是基于nginx反向代理服务器实现(apache也可)

  • 下载nginx并安装,配置nginx.conf文件,如: server { listen 80; server_name localhost; location / { root C:/Users/smalle/Desktop/web; index index.html index.htm; }
  • 将web项目拷贝到配置中的root路径
  • 启动nginx(此时可通过http://127.0.0.1或http://smalle.natappfree.cc访问)

配置回调地址

  • 微信后台 - 公众号设置 - 功能设置 - 网页授权域名
  • 将类似MP_verify_2DCaFsV02WRKw123.txt的文件下载到root路径下
  • 地址栏中填写xyabcd.natappfree.cc(不需要http://)保存即可

扩展:关于前后分离

  • 如果api和web项目分别部署,如web是用nginx静态服务器,api使用PHP/Java完成。就回出现跨域问题,此处可在nginx中再次配置后台api的转发 location /api/ { proxy_set_header X-Forward-For $proxy_add_x_forwarded_for; proxy_set_header Host $http_host; proxy_redirect off; if (!-f $request_filename) { proxy_pass http://127.0.0.1:8080; break; } }
    • web项目中认证请求js如:http://smalle.natappfree.cc/api/auth?code=021GT83e1ucjUu035F0e1Ttg3e1GT812就会被转发到http://127.0.0.1:8080/api/auth?code=021GT83e1ucjUu035F0e1Ttg3e1GT812 var url = "http://smalle.natappfree.cc/api/auth?code=" + code; $.get(url, function(res) { console.log(res); });

相关文章:服务号使用微信网页授权(H5应用等)

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

编辑于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏编程入门之C语言

Android native进程间通信实例-binder篇之——用parcel传输数组

和之前稍微不同,这次要稍微分析一下 Parce.cpp 和 android_os_Parcel.cp p的源码,为的是能够掌握调试技巧,后续传输其它类型数据就...

12230
来自专栏用代码征服天下

java之static关键字

8430
来自专栏Java程序员那些事

编程题:百钱买百鸡

#### 案列说明:主要内容是:公鸡5元一只,母鸡3元一只,小鸡1元三只,问100元怎样可以买100鸡?

12630
来自专栏用代码征服天下

java——面向对象

测试1和测试2编译时类型和运行时类型相同,所以没有多态发生,测试3编译时类型是BaseClass,而运行时类型是SubClass,所以当执行bs.base()时...

7320
来自专栏IT大咖说

1分钟带你看懂Java内部类

使用内部类最吸引人的原因是:每个内部类都能独立地继承一个(接口的)实现,所以无论外围类是否已经继承了某个(接口的)实现,

9820
来自专栏小蔚记录

界面组件之导航菜单备案

<li><a href="#" rel="prev">prev</a></li>

6210
来自专栏品茗IT

SpringBoot入门建站全系列(九)文件上传功能与下载方式

Spring对文件上传做了简单的封装,就是用MultipartFile这个对象去接收文件,当然有很多种写法,下面会一一介绍。

12340
来自专栏Creator星球游戏开发社区

探索CocosH5正确的开发姿势

回首自己3年多的cocos2d游戏开发经历,从cocos2d到coco2d-x入门,之后机缘巧合辗转到了cocos2d-js阵营。在深入使用cocos2d-js...

21320
来自专栏授客的专栏

单元测试_JUnit常用单元测试注解介绍及代码演示

https://pan.baidu.com/s/1OUNC0kZNduXJJLbpw76GZA

8640
来自专栏品茗IT

Spring整合JpaMapper(Mybatis通用插件)详情

那就用JpaMapper吧!JpaMapper是尽量按照JPA hibernate的书写风格,对mybatis进行封装,是CRUD操作更加简单易用,免于不断写s...

21950

扫码关注云+社区

领取腾讯云代金券

年度创作总结 领取年终奖励