RT-Thread-基于W601实现网页版IAPRT-Thread问答社区

基于W601实现网页版IAP

1.00

发布于 2022-03-23 13:46:10 浏览：1692 订阅该版

[tocm]

# 简介
前段时间基于W601开发板做了个小项目放在家中运行，由于正常运行过程中会出现一些问题需要修改代码并且更新程序，而原来的程序更新需要串口或者仿真器，并且由于其实现的功能需要在运行过程中将W601放在固定的位置，这样一旦需要更新程序还得移动其位置，非常不方便，因此就想到做一个在线升级方案。

考虑到之前项目中经常会用到 Web 来更新固件，因此可以借助于之前开源的前端页面 [Upload Tool](https://github.com/WKJay/upload_tool_web) ([无法访问点此进入国内站点](https://gitee.com/wangjunjie997/upload_tool_web))来实现本次的在线升级功能。

Upload Tool 本质是一个具备文件上传功能的网页版小工具，该工具目前实现了以下一些前端功能：

- **固件上传 【本项目会用到】**
- 文件上传
- 文件夹上传
- 文件校验
- 清空存储
- 存储用量
- **版本号显示 【本项目会用到】**
由于前端只是界面的呈现与交互，所以大部分功能（如文件操作）都需要后端有对应的逻辑驱动，而使用者可能并不需要用到所有功能，当然也就没有必要实现所有的后端逻辑。Upload Tool具备功能可选特性，使用者可以根据需要使能或隐藏某些功能。后端只需实现使能的功能逻辑即可。并且该前端页面对移动端也进行了适配，即使使用手机或平板也能获得比较好的交互体验。

在本项目中我们的目的是实现固件升级，因此也就仅需实现固件上传与版本号显示（用于判断固件是否更新成功）功能。

# 页面展示

## PC端
![image.png](https://oss-club.rt-thread.org/uploads/20220323/d23210241a475645a2ab357532ac7650.png.webp)

## 移动端
![image.png](https://oss-club.rt-thread.org/uploads/20220323/c202be2ec6e3d2d925a246d8fa799efd.png.webp)

# 准备工作
## 硬件
- 正点原子W601开发板
- 可用的 WIFI 环境（W601通过WIFI联网）
## 软件
## 前端源码
> 使用者可以基于该源码修改Web，如果不需要修改，则无需前端源码，前端数据已经内置在后端源码中，直接下载后端源码编译下载即可。
- [Github](https://github.com/WKJay/upload_tool_web)
- [Gitee（国内访问推荐）](https://gitee.com/wangjunjie997/upload_tool_web)

## 后端源码（已包含Web）
- [Github](https://github.com/WKJay/W601_Web_Upload_Demo)
- [Gitee （国内访问推荐）](https://gitee.com/wangjunjie997/W601_Web_Upload_Demo)

## IDE
本文会使用 RT-Thread Studio 做演示，项目本身会包含 MDK 和 IAR 的工程文件，可以按照自身的开发环境自行选择。

# 起步
首先从上文源码地址中下载后端源码并将其导入到 RT-Thread Studio 中。（选择导入MDK项目到工作空间中，导入帮助）

导入完成后直接编译并下载到开发板。

确保开发板能够连接WIFI，若WIFI还没有连接，则可以在命令行中输入指令:

`wifi join + wifi名 + 密码`

实现连接。
![image.png](https://oss-club.rt-thread.org/uploads/20220323/48e12d6fef80c220ff0640d13cf1ecd5.png)

连接成功后会在控制台打印出当前板子的IP地址，也可以手动输入 `ifconfig` 命令进行查看。

![image.png](https://oss-club.rt-thread.org/uploads/20220323/0e3845b7ebbb6a04ef4b7098900da4da.png)

此时即可使用电脑或者手机打开浏览器，输入板子的IP地址，进入到 Upload Tool 页面中：

![image.png](https://oss-club.rt-thread.org/uploads/20220323/2df82c52a8f09885fc52a280e0c4b5e6.png)

由于后端实现了固件上传和版本号显示功能，因此 Type 会一栏会有 firmware 选项，同时 Device Version 栏中会显示我们当前软件的版本号。

此时 Upload Tool 就已经可以正常运行了，当我们的程序进行了修改以后，无需通过串口或仿真器，直接编译好代码并通过网页上传就可实现固件的升级。

**需要注意的是，该 DEMO 中支持的固件为 rbl 格式，也是 W601_IOT_Board 这个 SDK 的官方版本，而在使用 Upload Tool 时可以上传任意格式，只要后端做好处理即可。**

功能搭建完成后我们就可以来试一下固件升级是否真的有效。我们打开工程目录下的 Modules > wn_cgi.c 文件，将宏定义 VERSION 值改为 V1.0.2：

![image.png](https://oss-club.rt-thread.org/uploads/20220323/2300892a4ea87be42cdc70c872744bb4.png)

修改完成后编译，**注意不要下载**。

编译成功后会在工程路径下的 Bin 目录下生成 `rtthread.rbl` 文件。

![image.png](https://oss-club.rt-thread.org/uploads/20220323/7de3e2ee89e4d13a74ae7a3f52f45667.png)

此时打开网页，点击 **Choose firmware** 并选择 `rtthread.rbl` 文件。选择成功后可以看到 **Upload Tool** 面板上显示了文件名以及大小并且原先被禁用的 **UPLOAD** 按钮也变为可点击状态：

![image.png](https://oss-club.rt-thread.org/uploads/20220323/06613117f17b7a3813496cfe2e8fa8a2.png)

点击 **UPLOAD** 按钮进行固件上传。

![image.png](https://oss-club.rt-thread.org/uploads/20220323/051b3e475744879ea6d6935e87384162.png)

上传成功后页面会有 `firmware uploading success` 提示语，此时W601会自动进入固件升级状态，我们需要等待一段时间。（此时由于W601已断开网页连接进行固件升级操作，所以页面操作将不会被后端响应）固件升级过程中控制台也会输出响应的升级状态：

![image.png](https://oss-club.rt-thread.org/uploads/20220323/e843a7790c9e203ac319bf4f113dc1db.png)

升级成功后可刷新页面，可以发现此时版本号已从原来的 V1.0.1 变成了我们修改后的 V1.0.2，此时也验证了固件升级功能是没有问题的。

![image.png](https://oss-club.rt-thread.org/uploads/20220323/79f578d76cb18a66b698b53b3483e647.png)

至此我们的例程就已经介绍完毕。感兴趣的朋友可以下载源码研究下，后端实现的具体分析可进入该链接查看：[基于W601实现网页版IAP（实践分析）](https://blog.csdn.net/Cris_Jay/article/details/123710827)

回到
底部

基于W601实现网页版IAP 1.00

关于作者

WKJay

相关文章

热门标签

本月文章贡献