6. MIT App inventor 自制手机APP连接阿里云平台 手机APP显示STM32发来的数据

本文主要是介绍6. MIT App inventor 自制手机APP连接阿里云平台 手机APP显示STM32发来的数据,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

系列文章目录

提示:这里是从实际应用如何使用教学配置,未从原理讲解,适合小白从零开始到成功,比较有成就感
STM32+ESP8266(AT固件)连接阿里云物联网系列保姆级教学
1. 创建产品和设备
2. 设置产品Topic数据和功能定义设备物模型数据显示
3. 硬件连接+代码修改
4. Web数据可视化
5.功能调试
6. MIT App inventor 自制手机APP连接阿里云平台 手机APP显示STM32发来的数据
7.MIT App inventor 自制手机APP连接阿里云平台 手机APP远程控制STM32设备


App inventor 自制手机APP连接阿里云平台 手机APP显示STM32发来的数据

  • 系列文章目录
  • 1.前言
  • 2.实际效果
  • 3.实现原理解析
  • 4.阿里云配置及MIT App inventor 修改
    • 1.在同一个产品下再添加一个设备,用于与APP与阿里云数据沟通
    • 2.在同一个产品下新建一个Topic,用于STM32 云流转数据,且用于APP获取阿里云的数据的Topic
    • 3.APP连接阿里云,让设备在线
    • 4.阿里云 (云产品流转设置)
    • 5.APP数据解析
  • 5.总结


1.前言

学习好前五篇,对阿里云物联网功能会有初步的了解,已经成功将esp8266连接上了阿里云平台,实现了数据的上云操作。在阿里云查看数据非常的不方便,但是APP操作会给系统带来更好的体验。

所用到的工具和例程:
App inventor 在线编程网址
App inventor APP例程组件
stm32+esp8266+at指令+mqtt协议+接入阿里云程序源码

2.实际效果

此教程是通过App inventor 自制手机APP实现连接阿里云平台,并且手机APP显示STM32发来的数据和实现远程控制

在这里插入图片描述

3.实现原理解析

通过阿里云平台的云产品流转实现设备与设备之间的通信。
其实很好理解,我们现在的阿里云上已经有一个设备了,也就是我们的MCU。而我们只需要再创建一个相同产品的设备用于给APP连接,然后将MCU设备的数据通过云流转的方式发送给APP设备,APP对转发的数据进行解析即可实现我们的目标了。

在这里插入图片描述

4.阿里云配置及MIT App inventor 修改

1.在同一个产品下再添加一个设备,用于与APP与阿里云数据沟通

在这里插入图片描述

2.在同一个产品下新建一个Topic,用于STM32 云流转数据,且用于APP获取阿里云的数据的Topic

注意:用于APP获取的Topic的设备操作权限一定要选择发布或者发布和订阅权限。否则会有问题。

在这里插入图片描述

在这里插入图片描述

获得APP抓取阿里云数据的Topic:/a1ku3iLsSpD/appdata/user/sub

3.APP连接阿里云,让设备在线

需要找到连接参数,其实这里与STM32 连接阿里云的参数相同,只不过设备变成了appdate设备。

连接参数:

clientId
username
passwd
mqttHostUrl
port
获得APP抓取阿里云数据的Topic:/a1ku3iLsSpD/appdata/user/sub

在这里插入图片描述

用网页版inventor APP打开例程
一对一填入对应的参数
打包apk
在这里插入图片描述
在APP中点击连接服务器,APP显示已连接,阿里云设备就会在线上。
在这里插入图片描述

在这里插入图片描述

4.阿里云 (云产品流转设置)

接下来我们就要配置阿里云的云流转产品,让MCU设备的数据转发到APP的设备上去

这边使用旧版本的规则
在这里插入图片描述

创建一个STM32toappdate的云流转规则;规则名称可以随意自取

在这里插入图片描述

编写SQL参数,这步是配置数据来源的设备。仔细配置,不要配置错误了。

在这里插入图片描述

接收数据设备配置

在这里插入图片描述

启用配置好的云产品流转规则
非常的事情说三遍
一定要启动规则
一定要启动规则
一定要启动规则

在这里插入图片描述

5.APP数据解析

MIT App inventor 内箭头所指示处,与你自己产品内物模型的标识符进行替换,再次打包即可在APP显示上显示数据

在这里插入图片描述在这里插入图片描述

用设备模拟器模拟STM32上传数据到阿里云在APP显示效果展示

在这里插入图片描述

这样就实现了数据上传APP了。学废了吗。没学废,多看几遍一定会成功的。

在这里插入图片描述

5.总结

想必学会了数据上传的同学,迫不及待的想学习如何控制实际设备的开关了吧

其实操作类似,我们只需要新建另一个规则,将APP的控制数据发送给MCU即可,不过我们需要通过自己调试找到相关的Topic来配置。
教程已经写了,大家有需要的话可以去看一下:
7. App inventor 自制手机APP连接阿里云平台 手机APP远程控制STM32设备

app提示的报错。较多情况是因为下发到app的数据在MIT App inventor 查找不到相关物模型标识符导致的
8.特别篇:MIT App inventor 报错:Bad arguments to lookup in pairs

侵权私聊删除
参考文章:https://blog.csdn.net/weixin_55576473/article/details/127580362

这篇关于6. MIT App inventor 自制手机APP连接阿里云平台 手机APP显示STM32发来的数据的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/646860

相关文章

通过ibd文件恢复MySql数据的操作方法

《通过ibd文件恢复MySql数据的操作方法》文章介绍通过.ibd文件恢复MySQL数据的过程,包括知道表结构和不知道表结构两种情况,对于知道表结构的情况,可以直接将.ibd文件复制到新的数据库目录并... 目录第一种情况:知道表结构第二种情况:不知道表结构总结今天干了一件大事,安装1Panel导致原来服务

Linux虚拟机不显示IP地址的解决方法(亲测有效)

《Linux虚拟机不显示IP地址的解决方法(亲测有效)》本文主要介绍了通过VMware新装的Linux系统没有IP地址的解决方法,主要步骤包括:关闭虚拟机、打开VM虚拟网络编辑器、还原VMnet8或修... 目录前言步骤0.问题情况1.关闭虚拟机2.China编程打开VM虚拟网络编辑器3.1 方法一:点击还原VM

Jmeter如何向数据库批量插入数据

《Jmeter如何向数据库批量插入数据》:本文主要介绍Jmeter如何向数据库批量插入数据方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录Jmeter向数据库批量插入数据Jmeter向mysql数据库中插入数据的入门操作接下来做一下各个元件的配置总结Jmete

CSS模拟 html 的 title 属性(鼠标悬浮显示提示文字效果)

《CSS模拟html的title属性(鼠标悬浮显示提示文字效果)》:本文主要介绍了如何使用CSS模拟HTML的title属性,通过鼠标悬浮显示提示文字效果,通过设置`.tipBox`和`.tipBox.tipContent`的样式,实现了提示内容的隐藏和显示,详细内容请阅读本文,希望能对你有所帮助... 效

MySQL InnoDB引擎ibdata文件损坏/删除后使用frm和ibd文件恢复数据

《MySQLInnoDB引擎ibdata文件损坏/删除后使用frm和ibd文件恢复数据》mysql的ibdata文件被误删、被恶意修改,没有从库和备份数据的情况下的数据恢复,不能保证数据库所有表数据... 参考:mysql Innodb表空间卸载、迁移、装载的使用方法注意!此方法只适用于innodb_fi

mysql通过frm和ibd文件恢复表_mysql5.7根据.frm和.ibd文件恢复表结构和数据

《mysql通过frm和ibd文件恢复表_mysql5.7根据.frm和.ibd文件恢复表结构和数据》文章主要介绍了如何从.frm和.ibd文件恢复MySQLInnoDB表结构和数据,需要的朋友可以参... 目录一、恢复表结构二、恢复表数据补充方法一、恢复表结构(从 .frm 文件)方法 1:使用 mysq

mysql8.0无备份通过idb文件恢复数据的方法、idb文件修复和tablespace id不一致处理

《mysql8.0无备份通过idb文件恢复数据的方法、idb文件修复和tablespaceid不一致处理》文章描述了公司服务器断电后数据库故障的过程,作者通过查看错误日志、重新初始化数据目录、恢复备... 周末突然接到一位一年多没联系的妹妹打来电话,“刘哥,快来救救我”,我脑海瞬间冒出妙瓦底,电信火苲马扁.

golang获取prometheus数据(prometheus/client_golang包)

《golang获取prometheus数据(prometheus/client_golang包)》本文主要介绍了使用Go语言的prometheus/client_golang包来获取Prometheu... 目录1. 创建链接1.1 语法1.2 完整示例2. 简单查询2.1 语法2.2 完整示例3. 范围值

pycharm远程连接服务器运行pytorch的过程详解

《pycharm远程连接服务器运行pytorch的过程详解》:本文主要介绍在Linux环境下使用Anaconda管理不同版本的Python环境,并通过PyCharm远程连接服务器来运行PyTorc... 目录linux部署pytorch背景介绍Anaconda安装Linux安装pytorch虚拟环境安装cu

javaScript在表单提交时获取表单数据的示例代码

《javaScript在表单提交时获取表单数据的示例代码》本文介绍了五种在JavaScript中获取表单数据的方法:使用FormData对象、手动提取表单数据、使用querySelector获取单个字... 方法 1:使用 FormData 对象FormData 是一个方便的内置对象,用于获取表单中的键值