FastBee 移动端
FastBee 移动端基于 UniApp 跨平台框架开发，一套代码支持微信小程序、Android、iOS 和 H5 多端运行。
支持平台
| 平台 | 支持情况 | 说明 |
|---|---|---|
| 微信小程序 | ✓ | 推荐，功能最完整 |
| Android | ✓ | Wap2App 方式打包 |
| iOS | ✓ | Wap2App 方式打包 |
| H5 | ✓ | 浏览器直接访问 |
核心功能
设备配网
- 支持单设备配网（全平台）和多设备配网（仅微信小程序）
- 设备开启热点后，移动端通过 Web 服务传递 Wi-Fi 配置
- 设备热点地址：
192.168.4.1
扫码添加设备
- 扫描设备二维码（含设备编号、产品 ID）快速绑定到用户账号
- 支持批量扫码和手动输入设备编号
实时数据监控
- 集成 MQTT over WebSocket 协议
- 设备属性、功能、事件数据实时推送
- 支持物模型数据图表展示
设备管理
- 设备列表查看、在线状态监控
- 远程控制（属性设置、功能调用）
- 设备分享（支持分享给其他用户）
其他功能
- 中英文国际化切换
- 天气预报（心知天气 API）
- 视频监控（微信小程序需申请权限）
- 登录注册 / 个人中心
技术栈
| 组件 | 技术选型 |
|---|---|
| 开发框架 | UniApp |
| UI 框架 | uView 2.0 |
| 状态管理 | Vuex |
| 图表 | uChart 2.0（canvas2d 模式） |
| 实时通信 | MQTT over WebSocket / WXS |
| 开发工具 | HBuilderX 3.3+ |
MQTT 连接协议
移动端使用 WebSocket 方式连接 MQTT Broker。
| 协议 | 端口 | 适用场景 |
|---|---|---|
| ws | 8083 | H5 / Android / iOS（未加密） |
| wss | 8084 | H5 / Android / iOS（加密） |
| wxs | 8084 | 微信小程序专用 |
快速开始
环境准备
- 安装 HBuilderX 3.3 以上版本
- 安装 Node.js 并执行
npm install安装依赖 - 部署并启动 FastBee 后端服务
配置服务器地址
编辑 env.config.js，配置后端 API 地址和 MQTT 服务器地址。
js
// 开发环境
const devBaseUrl = 'http://localhost:8080'
// MQTT WebSocket 地址
const devMqttUrl = 'ws://服务器IP:8083/mqtt'
// 生产环境
const prodBaseUrl = 'https://your-domain.com'
const prodMqttUrl = 'wss://your-domain.com:8084/mqtt'运行到微信小程序
- HBuilderX 中选择 运行 → 运行到小程序模拟器 → 微信开发者工具
- 在微信开发者工具中预览和调试
- 配网功能需要在真机上测试
运行到 H5
- HBuilderX 中选择 运行 → 运行到浏览器
- 浏览器中访问即可
打包为 App
- HBuilderX 中选择 发行 → 原生 App-Wap2App
- 分别打包 Android APK 和 iOS 安装包
- Android/iOS 视频监控需使用 Wap2App 方式打包
项目结构
├─ apis/ 接口管理（模块化）
├─ common/ 公共工具、过滤器、MQTT 工具
├─ components/ 组件库（easycom 自动引入）
├─ locale/ 国际化语言文件
├─ pages/ 主包页面（首页、趋势、个人中心）
├─ pagesA/ 分包 A
├─ pagesB/ 分包 B
├─ pages_player/ 播放器页面
├─ store/ Vuex 状态管理
├─ uni_modules/ 插件（含 uView UI）
├─ env.config.js 服务器地址配置
├─ manifest.json 各平台配置信息
└─ pages.json 页面路由配置注意事项
- 微信小程序配网需要在
manifest.json中启用位置接口权限，且必须真机调试 - 微信小程序视频功能需向微信官方申请类目权限
- 生产环境建议使用 wss 加密连接
- 多端适配时注意网络协议差异（WS/WSS/WXS）