公司一个项目是内网,要实现扫一扫功能,taro扫码功能只能在微信公众号才有效,做的过程中也遇到各种坑,现在在这里总结一下:
第一步:
先安装微信jdk依赖:
npm install weixin-js-sdk -S
安装好后在需要调取扫一扫的页面引入或者全局引入:
第二步:
去微信公众平台注册一个测试号https://mp.weixin.qq.com/debug/cgi-bin/sandboxinfo?action=showinfo&t=sandbox/index
使用微信jdk只需要配置安全域名就行了,其他的不用配置
本地测试,需要把做内网穿透,这里用的是natapp,把你的前端地址映射出来:比如你前端地址是127.0.0.1:8888,用natapp映射出来的是http://vwb627.natappfree.cc(图1),只需要把测试号的安全域名设置成vwb627.natappfree.cc即可(图2):
第三步:
接下来就是去后端拿签名了,后端代码官网有示例,里面有php,node,java,这里值得注意的是:
后端获取签名的链接url,必须是前端的地址,并且最后要带“/”:
所以这个url要么前端获取后给后端,要么后端去获取:
比如前端调取扫码的url如下:
http://vwb627.natappfree.cc/#/pages/retrospective/index
那么传给后端的url应该为http://vwb627.natappfree.cc/,千万要注意,最后要有“/”,不然一直会配置不成功,我之前一直卡在这里,是没有仔细看官网的后果,前端代码具体如下:
至此,微信jdk本地调试流程以及taro开发H5使用微信扫一扫就完了