【微信小程序控制硬件13 】 与硬件平台无关,微信小程序 AP 配网安信可 Wi-Fi 模块入网示例。【AT篇,附带Demo】

      微信物联网生态主要分在微信硬件开发平台腾讯物联开发平台,前者已经停止维护,但依然有着很大的学习价值,而后者作为主推的平台,集成很多功能,包括从微信小程序实现配网到控制;

      为了兼顾更多的朋友和自己的学习笔记,我将会一直更新此专题笔记,欢迎关注本人CSDN半颗心脏,带你走进前沿领域,学习前沿技术!

自搭微信服务器&&微信硬件开发平台

微信小程序控制硬件第1篇 】 全网首发,借助 emq 消息服务器带你如何搭建微信小程序的mqtt服务器,轻松控制智能硬件!
微信小程序控制硬件第2篇 】 开始微信小程序之旅,导入小程序Mqtt客户端源码,实现简单的验证和通讯于服务器!
微信小程序控制硬件第3篇 】 从软件到硬件搭建一个微信小程序控制esp8266的项目,自定义通讯协议,为面试职位和比赛项目加分!
微信小程序控制硬件第4篇 】 深度剖析微信公众号配网 Airkiss 原理与过程,esp8266如何自定义回调参数给微信,实现绑定设备第一步!
微信小程序控制硬件第5篇 】理清接下来必须走的架构思想,学习下 JavaScript 的观察者模式,在微信小程序多页面同时接收到设备推送事件!
微信小程序控制硬件第6篇 】服务器如何集成七牛云存储SDK,把用户自定义设备图片存储在第三方服务器!
微信小程序控制硬件第7篇 】动起来做一个微信小程序Mqtt协议控制智能硬件的框架,为自己心里全栈工程师梦想浇水!!
微信小程序控制硬件第8篇 】微信小程序以 websocket 连接阿里云IOT物联网平台mqtt服务器,封装起来使用就是这么简单!
微信小程序控制硬件第9篇 】巧借阿里云物联网平台的免费连接,从微信小程序颜色采集控制 esp8266 输出七彩灯效果,中秋节来个直播如何?!
微信公众号控制硬件 第10篇 】如何在微信公众号网页实现连接mqtt服务器教程!!
微信小程序控制硬件 第11篇 】全网首发,微信小程序ble蓝牙控制esp32,实现无需网络也可以控制亮度开关。
微信小程序控制硬件 第12篇 】微信小程序蓝牙控制硬件应如何开发?为您全面解析微信小程序蓝牙API的使用。
微信小程序控制硬件 第13篇 】【AT篇】与硬件平台无关,微信小程序 AP 配网安信可 Wi-Fi 模块入网示例。

腾讯物联开发平台

腾讯连连 - 腾讯物联开发平台 第1篇 】腾讯官方静鸡鸡发布的“腾讯连连”终于来了,按照官方教程教你在微信小程序实现配网、控制 ESP8266啦!
腾讯连连 - 腾讯物联开发平台 第2篇 】深度解析微信小程序smartconfig配网原理,安信可ESP-12S直连腾讯物联开发平台!!

在这里插入图片描述


前言

    近2个星期不断有朋友追问微信小程序如何实现热点配置Wi-Fi模块,那么我花了一个星期陆陆续续给大家做了个小案例,虽然微信小程序已经支持 smartconfig 配网,但是没开源,我们还是用下 softAP 配网就好啦!

    这篇为设备AT篇,因为太多客户问我拿这个了(虽然我不玩AT的)!下篇给大家来个设备 SDK 开发篇!现在也把微信小程序源码放在公司的GitHub上啦!

一 材料准备

  • 设备:已烧录出厂 AT 固件 的安信可 ESP-12S,ESP32-S和ESP-12K模组;
  • 微信小程序:自行具备微信小程序开发能力基础;

二 实现目的

通过微信小程序配置未入网的安信可Wi-Fi模组连接家庭2.4G路由器,实现连接云端服务器;

三 配置的数据交互协议

3.1 小程序发送网络信息阶段

  • 微信小程序发送配置网络的信息:
{ 
  "port":61691 , //微信小程序本地端口,代码获取
  "password":"12345678" , //要连接的家庭网络路由器的密码
  "ssid":"xuhong@aithinker" //要连接的家庭网络路由器的SSID
}
  • 模组返回以下信息,以表示成功收到配置网络的信息:
{ 
  "result": 0 ,  //错误码
}

3.2 模组连接路由器的回调:

  • 模组返回以下信息格式:
{ 
  "code": 1 , // 错误码
}
错误码 含义
0 设备成功收到信息
1 设备成功解析到小程序发来的SSID和PWD信息
2 设备成功连接到路由器
3 设备失败连接到路由器

四 配置原理和过程

在这里插入图片描述

五 设备端 AT 交互过程

命令顺序:

AT顺序 说明
AT+CWMODE=3 STAT+AP模式
AT+CIPMUX=1 设置多连接
AT+CWSAP=“ESP32”,“123456789”,1,3 设置软热点
AT+CIPSTART=0,“UDP”,“192.168.4.1”,8888,1000,0 开启UDP服务(等待小程序发来SSID和PWD)
AT+CIPSENDEX=0,10,“192.168.4.2”,63665 解析OK,回复给小程序
{“code”:0} 协议,见上章
AT+CWJAP=“iot@xuhongv”,“xuhong12345678” 根据小程序发来的SSID和PWD连接路由器
AT+CIPSENDEX=0,10,“192.168.4.2”,63665 解析OK,回复给小程序
{“code”:2} 协议,见上章

详细的交互抓取:

Ai-Thinker Technology Co. Ltd.

ready
WIFI CONNECTED
WIFI GOT IP
AT+CWMODE=3

OK
AT+CIPMUX=1

OK
AT+CWSAP="ESP32","123456789",1,3

OK
AT+CIPSTART=0,"UDP","192.168.4.1",8888,1000,0
0,CONNECT

OK
+STA_CONNECTED:"f8:87:f1:0f:35:3b"
+DIST_STA_IP:"f8:87:f1:0f:35:3b","192.168.4.2"
+DIST_STA_IP:"f8:87:f1:0f:35:3b","192.168.4.2"

+IPD,0,63:{"port":63665,"password":"xh12345678","ssid":"iot@xuhongv"}
AT+CIPSENDEX=0,10,"192.168.4.2",63665

收:OK

>busy p...

Recv 10 bytes

SEND OK
AT+CWJAP="iot@xuhongv","xh12345678"
WIFI DISCONNECT
WIFI CONNECTED
WIFI GOT IP

OK
..

Recv 10 bytes

SEND OK
AT+CWJAP="iot@xuhongv","xh12345678"
WIFI DISCONNECT
WIFI CONNECTED
WIFI GOT IP

OK

小程序的核心代码:

      //是否第一次UDP建立
      if (this.data.isFirst) {
            let udp = wx.createUDPSocket();
            this.setData({
                isFirst: false,
                udp,
                port: udp.bind(),
            });
        }

        const password = this.data.password;
        const ssid = this.data.ssid;
        const port = this.data.port;

        let message = JSON.stringify({
            port,
            password,
            ssid
        })
        //双方约好为
        this.data.udp.send({
            address: '192.168.4.1',
            port: 1000,
            message
        });


        this.data.udp.onMessage((res) => {
            //字符串转换,很重要
            let unit8Arr = new Uint8Array(res.message);
            let encodedString = String.fromCharCode.apply(null, unit8Arr);
            let data = decodeURIComponent(escape((encodedString)));
            console.log("data:", data);
            let str = JSON.parse(data);
            switch (str.code) {
                //成功收到信息
                case 0:
                    wx.showToast({
                        title: '接收成功',
                    })
                    break;
                //成功解析到信息
                case 1:
                    wx.showToast({
                        title: '准备连接路由器',
                    })
                    break;
                //成功连接到路由器
                case 2:
                    wx.showToast({
                        title: '成功连接',
                    })
                    break;
                //连接失败路由器
                case 3:
                    wx.showToast({
                        title: '连接失败',
                    })
                    break;
            }
        })
    },

微信小程序源码:https://github.com/xuhongv/WeChatMiniAP2Net


另外,不要把我的博客作为学习标准,我的只是笔记,难有疏忽之处,如果有,请指出来,也欢迎留言哈!

  • 玩转esp8266带你飞、加群QQ群,不喜的朋友勿喷勿加:434878850
  • 个人邮箱:[email protected] 24小时在线,有发必回复!
  • esp8266源代码学习汇总(持续更新,欢迎star):https://github.com/xuhongv/StudyInEsp8266
  • esp32源代码学习汇总(持续更新,欢迎star):https://github.com/xuhongv/StudyInEsp32
  • 关注下面微信公众号二维码,干货多多,第一时间推送!

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/xh870189248/article/details/107462477