uni-app 微信小程序端-AirKiss一键配网
发现网上很多关于微信小程序配网的文章都是微信小程序原生开发,uni-app少之又少。这篇文章就介绍一下怎么在HBuilder X使用airkiss配网插件。
一.AirKiss介绍
AirKiss是微信硬件平台为Wi-Fi设备提供的微信配网、局域网发现和局域网通讯的技术。开发者若要实现通过微信客户端对Wi-Fi设备配网、通过微信客户端在局域网发现Wi-Fi设备,或者把微信客户端内的音乐、图片、文件等消息通过局域网发送至Wi-Fi设备。
设备进入 Wi-Fi 混杂模式(promiscuous mode)以监听捕获周围的 Wi-Fi 报文。由于设备暂未联网,且 Wi-Fi 网络的数据帧已通过加密,设备无法获取 payload 的内容,但可以获取报文的某些特征数据,例如每个报文的长度,同时对于某些数据帧;例如 UDP 的广播包或多播包,其报文的帧头结构比较固定,较容易识别。
此时在手机 App 或者小程序侧,即可通过发送 UDP 的广播包或多播包,并利用报文的特征,例如长度变化进行编码。
将目标 Wi-Fi 路由器的 SSID/PSW 字符以约定的编码方式发送出去,设备端在捕获到 UDP 报文后,按约定的方式进行解码,即可得到目标 Wi-Fi 路由器的相关信息并进行联网。
二.对项目进行配置
在微信开发者工具中需要使用到配网功能时🍊
新建项目之后,在app.js文件中添加下面代码
"plugins": {
"airkiss": {
"version": "1.1.0",
"provider": "wx610ea582556c983e"
}
}
而在uni-app开发中,如果我们在微信开发者工具中进行了配置,那本次配置的内容会在HBuilder X重新编译之后消失。
所以我们需要在HBuilder X中进行相关配置。
在进入项目之后,打开项目的manifest.json文件,在小程序特有相关中添加下面代码
"plugins": {
"airkiss": {
"version": "1.1.0",
"provider": "wx610ea582556c983e"
}
}
在运行到微信开发者工具后,在控制台会提示你添加插件,然后按提示添加即可。
进行配网的代码就很简单,建议在小程序的条件编译中编写代码
三.配网页面代码常规流程
有关WIFI功能都需要用户打开GPS😆
注意:请自行处理是否为2.4G频段路由器
- 打开WIFI模块
// #ifdef MP-WEIXIN
wx.startWifi({
success(res) {
console.log(res)
},
fail(res) {
console.log(res)
uni.showToast({
title: '请打开WIFI',
icon: 'none',
duration: 1000
});
},
})
// #endif
- 进入页面,获取当前所连接的WIFI
// #ifdef MP-WEIXIN
var that = this
wx.getConnectedWifi({
success(res) {
console.log(res)
that.BSSID = res.wifi.BSSID
that.WIFIName = res.wifi.SSID
},
fail(res) {
console.log(res)
//报错的相关处理
},
})
// #endif
- 点击某个按钮获取WIFI列表
// #ifdef MP-WEIXIN
var that = this
wx.getWifiList({
success(res) {
console.log(res)
wx.onGetWifiList(function(res) {
console.log("获取wifi列表");
console.log(res.wifiList); //在这里提取列表数据
//通过遍历将WIFI名字存入集合,以便下卡框等组件使用
for (var i = 0; i < res.wifiList.length; i++) {
that.wifiList.push(res.wifiList[i].SSID)
}
})
},
fail(res) {
console.log(res)
//报错的相关处理
},
})
// #endif
- 开始配网,将WIFI名字和WIFI密码传输给硬件
// #ifdef MP-WEIXIN
const airkiss = requirePlugin('airkiss');
if (this.wifiList.length == 0) {
this.SSID = this.WIFIName
} else {
this.SSID = this.wifiList[this.value]
}
if (this.SSID != '' && this.password != '') {
console.log(airkiss)
uni.showLoading({
title: '配网中请稍后..'
});
airkiss.startAirkiss(this.SSID, this.password, function(res) {
console.log(res)
switch (res.code) {
case 0:
uni.hideLoading();
uni.showModal({
title: '初始化失败',
content: res.result,
showCancel: false,
confirmText: '收到',
})
break;
case 1:
uni.hideLoading();
uni.showModal({
title: '配网成功',
content: '设备IP:' + res.ip + '\r\n 设备Mac:' + res.bssid,
showCancel: false,
confirmText: '好的',
})
break;
case 2:
uni.hideLoading();
uni.showModal({
title: '配网失败',
content: '请检查密码是否正确',
showCancel: false,
confirmText: '收到',
})
break;
default:
uni.hideLoading();
break;
}
})
} else {
uni.showToast({
title: '请选择WIFI并输入密码',
icon: 'none',
duration: 1000
});
}
// #endif
🍎大功告成