之前在调用微信公众号拍照时候,总是不能调用微信授权的认证,因为不在一个运行环境下,总是不能调用成功,搞得花费太多精力和时间去联调这东西,处理相关的交互。
最近又接到相关的开发任务,就决定花时间去处理解决问题。
我大概理了下步骤,如下
- 下载微信开发者工具
- vue-cli 里面config配置
- 配置本地hosts文件
下载微信开发者工具
在微信官网文档下载工具 https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html
vue-cli 里面config配置
config文件夹里面index.js文件 dev里面参数配置
示例如下
proxyTable: {
'/api': {
target: 'http://apptest.xxxx.com', //目标接口域名
changeOrigin: true, //是否跨域
secure: false,
},
},
host: '0.0.0.0', // 可以通过ip访问
port:80 //80为默认端口,方便域名反向代理到自己所在ip
vue-cli 里面 build文件 webpack配置
在webpack.dev.conf.js文件参数配置
window系统本地hosts文件配置
在c盘 windows目录 system32/drivers/etc 目录下 hosts文件用txt记事本打开加上一段代码
127.0.0.1 apptest.xxxx.com
访问改域名指向到本地调试地址
总结:该调试的重点就是配置在同一个环境里面。进入微信初始要调用微信授权的接口,要调用摄像头拍照、语音录音等功能的话,需要调用微信config的接口,这里面要传一个url。但是该url必须是申请微信公众号配置的域名。通过反向代理指向本地调试的ip。就可以解决问题。