基于HaaS100实现WEB配网功能

1、前言

1.1、物联网设备WiFi配网

           设备连接WiFi路由器热点时，需要输入路由器的网络名称(SSID)和密码，才能连上路由器的无线网路。物联网设备通常都没有直接的输入设备，来输入SSID和密码。因此，需要通过其它的方式获取到WiFi路由器的网络名称(SSID)和密码，这个过程就是物联网设备WiFi配网。

1.2、物联网设备常用Wi-Fi配网方式及优缺点比较

          物联网设备常用的配网方式如下表：

配网方式	配网原理	优点	缺点
直接配网	通过串口，外接键盘，触摸屏等方式直接输入SSID和密码	实现简单，可靠性最高	需要依赖输入设备，对于没有这些输入设备的产品，无法使用
一键配网(SmartConfig)	手机通过广播或者组播方式发送SSID及密码，设备在sniffer模式接收802.11报文，解析出其中的SSID和密码信息。	手机APP一键操作，操作比较方便。	依赖手机APP。 对手机及路由器有要求，可能发生各种兼容性问题导致配网失败。
蓝牙配网	手机与设备通过蓝牙配对连接后，将SSID和密码通过蓝牙发送给设备。	可靠性高，操作方便	依赖手机APP。 设备需要有蓝牙设备。
路由器配网	路由器与设备配合，通过专用的配网用SSID实现设备配网。	可靠性高，操作方便	仅支持配套的路由器和设备。
零配	阿里巴巴针对天猫精灵设计的配网模式，天猫精灵联网成功，开启找队友模式时，自动将SSID和密码通过802.11帧下发给待配网设备。	可靠性高，操作方便	设备需要支持天猫精灵配网协议。
设备热点配网	待配网设备在配网模式启动SoftAP，手机或者电脑连接设备热点。通过手机APP或者WEB浏览器将SSID及密码配置给设备。	可靠性高，操作方便	需要设备支持SoftAP模式。

       WEB网页配网，属于设备热点配网的一种方式，待配网物联网设备在配网模式下，启动SoftAP创建热点后，同时启动一个web server。手机或者电脑连接上设备热点后，通过WEB浏览器登录固定的ip地址，在设备预置的WiFi配置页面上输入路由器的SSID和密码后，实现配网。配网成功后，设备切换回Station模式即可正常连接路由器。

1.3、HaaS100实现WEB网页配网原因

1）HaaS100 WiFi支持SoftAP方式，可以实现设备热点配网功能。

2）HaaS100 有16MBFlash，存储空间较大，可以存储下配网所需html网页等资源文件。

3）HaaS100面对的工农业等场景，很可能没有手机APP，使用WEB网页配网更简单方便，减少手机APP开发工作量。

4）WEB网页配网成功率高，可以满足工农业等要求较高的场景使用。

 

2、实现原理

2.1、配网流程

配网模式说明：

1)  设备出厂时，默认处于配网模式，开机后，切换到SoftAP模式，启动DHCP Server和Web Server。

2）设备已经配网后，如果想重新配网，可以长按配网键，进入配网模式，重新开始配网。

 

2.2、设备进入SoftAP模式

1）在wifi适配代码中，调用芯片WIFI驱动接口，实现启动SoftAP和停止SoftAP的功能。

     启动SoftAP时，需要传入预置的SSID和密码，以及beacon时间，热点是否隐藏等参数。

2）在WiFi Service中，获取SoftAP的netif，关联上固定的IP地址，gatew地址及netmask，将该netif传给DHCP服务。

2.3、DHCP服务

2.3.1、DHCP服务启动流程

DHCP服务，用于设备给连上设备热点的手机或者电脑分配IP地址。目前，lwip已经自带DHCP服务，按照下面流程开启即可：

1）在lwipopts.h中定义LWIP_DHCP宏为1。

2)  设置DHCP地址资源池的地址范围。

3）将SoftAP的netif，关联上固定的IP地址，gateway地址及netmask，调用dhcps_init接口，启动DHCP服务。

4）手机或者电脑连接上热点后，会自动从DHCP服务获取到IP地址，可以跟设备之间进行IP网络通信。

2.3.2、LWIP DHCP服务介绍

lwip的DHCP服务，遵循RFC1531动态主机设置协议，Server通过UDP报文为Client分配IP地址。基本原理如下：

• 首次获取IP地址

说明：

1）首次获取IP地址时，客户端没有IP地址，且不知道DHCP服务器的地址，因此都是通过广播消息来与服务器交互。

2）DHCP客户端发起的DHCP服务发现广播，局域网内所有服务器均能收到，且均会回响应。客户端自己根据服务器回复的先后，选择最先响应的服务器。

    对于手机连接设备热点配网的场景，只有一个DHCP服务器。

3）DHCP成功后，客户端获取到服务器分配的IP地址，且记录下来服务器本身IP。后续与DHCP服务器通信，不再需要通过广播消息交互，可以直接发给服务器。

4）DHCP服务器给客户端分配IP地址时，通常会把服务器自身地址、子网掩码、DNS Server地址、网关地址等信息也一并下发给客户端。

 

• IP地址租约到期

1）租约到期前50%时间，客户端会向分配IP地址的服务器请求租约更新。如果服务器正常响应，则更新租期。

    如果服务器没有响应，则在过期前87.5%时间再次发送租约更新请求。如果服务器正常响应，则更新租期。

2) 如果租约到期前，服务器一直都没有响应，则时间到期后，之前分配的IP地址无法使用，需要重新开始走首次获取IP地址流程。

说明：lwip的DHCP服务分配IP时，租约默认时间为1天。

 

• IP地址冲突

1）地址冲突一般是由于下列几个原因造成：

a) DHCP客户端在租约过期前关机，开机后，租约已经过期，地址已经分配给其它设备。

b) 局域网中，有设备设置了静态IP，跟服务器分配的动态IP冲突。

2）地址冲突后，服务器会对客户端的请求进行判断，如果地址时自己分配的，则会重新分配正确的地址；如果地址不是自己分配的，则不响应该请求。

3）客户端如果地址冲突后，请求得不到响应，则会重新走首次获取IP地址流程。

2.4、Web网页服务

WEB网页服务，用于接收手机或者电脑浏览器发出的HTTP请求，给浏览器发送用于配网的HTML页面，并接收手机或者电脑发送的SSID及密码等配网信息。

2.4.1、HTTP协议简介

1）协议概述

HTTP协议是Hyper Text Transfer Protocol(超文本传输协议)的缩写，是承载于TCP协议之上的应用层协议(通常)，是万维网的数据通信基础。目前广泛应用的版本是HTTP1.1(RFC2616)，最新版本是HTTP2.0(RFC7540)。

HTTP协议采用经典的客户端-服务器模型，由客户端往一个统一资源标识(Uniform Resource Identifiers, URI)发起请求消息，该请求经过网络发送给服务器，服务器对该请求进行处理，并给出对应的回复，客户端收到回复后，进行对应的处理(显示网页、下载文件、播放音乐等)。

HTTP协议本身是没有状态的，服务器不会通过HTTP协议本身来记录服务器与客户端之间的会话，以及客户端的状态，客户端发起的多次请求之间本身没有直接的关联。（目前，通常使用Cookies来实现状态管理，使用Cookies实现由状态的会话）

2）协议请求类型

HTTP协议的请求类型有下列几种：

• GET

向服务器请问获取数据。比如"GET /index.html"表示向服务器获取index.html这个网页。本文中，浏览器向服务器获取显示的网页数据，就是通过GET命令从设备获取的。

• POST

请求向服务器发送数据。POST请求通常通过HTML表单发送，服务器收到后进行处理，然后返回处理结果。本文中路由器的SSID和password，就通过POST发给设备。

• HEAD

向服务器请求获取资源的头部信息。HEAD请求一般用于下载文件前，先通过HEAD命令向服务器获取文件大小等信息。

• PUT

请求在服务器中创建或者替换资源文件。PUT通常用于向服务上传文件等操作。

• DELETE

请求删除服务器上的某个资源。

• TRACE

调试命令，可实现沿通向目标资源路径的消息环回测试。

• OPTIONS

向服务器请求获取服务器对某个资源，或者整站所支持的方法类型。

• CONNECT

用于建立客户端与请求资源之间的双向通道，一般用于代理，或者HHTPS等。

• PATCH

请求修改资源的部分内容。

对应本文中的WEB配网功能，实现了GET和POST这2种请求类型。

 

2.4.2、Web服务实现方案

HaaS100上的Web服务，采用HTTP 1.1协议（不支持HTTPS），HTML文件存储在littlefs文件系统中。

1）整体流程

2）初始化流程

     a. 创建TCP socket。

     b. 绑定80端口。

     c. 等待客户端连接请求。

     d. 设置客户端连接socket的发送延时及接收超时时间。

3）HTTP协议报文GET命令处理流程

a. 解析请求报文字符串，根据字符串内容，判断出请求命令是否是GET。

b. GET命令，解析出文件名称。

c. 读取文件内容，按照HTTP协议生成响应头和响应内容。   

d. 发送响应给浏览器。

 

响应头格式：

HTTP/1.1 200 OK\r\nContent-Type: %s;charset=UTF-8\r\nContent-Length: %d\r\n\r\n

Content-Type根据响应内容确定，具体参见  https://tool.oschina.net/commons/，Content-Length为响应内容的长度。

 

4）HTTP协议报文POST命令处理流程

      a. 解析请求报文字符串，根据字符串内容，判断出请求命令是否是POST。

b. POST命令，解析出POST的CGI对象是否是wificonfig

c. 从请求报文内容中，解析出SSID和密码。

d. 解析成功后，给浏览器返回一个配网成功的网页。(失败则返回配网失败的网页)

2.4.3、HTML网页设计

1）HTML网页

    a. index.html  用于显示配网的默认页面

    b. mystyle.css CSS文件，用于控制index.html中的元素显示格式(字体、大小、位置、颜色等)

    c. wificfg_succ.html 用于显示配网成功的页面

    d. wificfg_error.html 用于显示配网失败的页面

    e. 404.html 用于显示请求命令错误的页面

    所有html文件总大小为2K字节左右，存储与littlefs文件系统/data/html目录下。

    网页在手机上显示如下图：

2）配网HTML FORM

       
       

       
       

       配置

    在html网上上输入SSID和密码，点击配置按钮后，会将SSID及密码发送给服务器，由服务器进行解析处理。

 

3、结果

3.1、功能效果

手机配网操作过程如下：

连接到HaaS100 默认热点 -> 浏览器打开 192.168.0.1，输入家里路由器的SSID和密码 -> 返回配置成功即可

    

 

3.2、资源消耗统计

内存消耗：峰值约5.5K字节。

ROM消耗：约6K字节（4K代码，2K HTML文件）。

 

4、总结

1）本文所述方案适合于在没有直接输入设备、没有手机APP、资源受限、对配网成功率要求比较高的物联网设备上实现WEB配网功能。

2）本文所述WEB服务，也可用于通过WEB网页配置设备的各种参数，比如配置系统时间、配置GPIO端口、配置按键功能等等。

3）对于资源更加丰富的设备，可以移植一些开源的WEB服务器代码，比如Lighttpd, Shttpd, Thttpd, Boa, Mini_httpd, Appweb, Goahead等，这些面向嵌入式的WEB服务器可以在较低的内存/ROM开销，较低的CPU负载下，提供相对完整的WEB服务功能，比如CGI、SSL、Cookie等。

4）lwip本身也自带了一个WEB服务代码，可以用于提供WEB服务功能，资源占用也比较少，但是lwip自带的web服务功能，不支持直接从文件系统中读取html文件，html文件需要使用转换工具事先转换成c代码编译进系统中，不方便在发布后动态替换html网页。

5、开发者技术支持

如需更多技术支持，可加入钉钉开发者群

更多技术与解决方案介绍，请访问阿里云AIoT首页https://iot.aliyun.com/