ESP32或K210如何上传图片到Mixio物联网平台显示

作者：AllinToyou | 2024-04-10 21:59:51

踩

ESP32或K210如何上传图片到Mixio显示

文章目录

ESP32或K210如何上传图片到Mixio显示

注：以下教程均建议在网络连接正常的基础上！

使用前须知

Mixio是北师大傅骞博士带领的Mixly团队所开发的一个基于MQTT的国产开源物联网平台，与别的MQTT平台相比其具备图形界面与简单逻辑控制同时支持Mixly图形化编程，简单注册与使用详情见Mixio教程，本教程主要介绍Mixio平台的图片组件的简单使用与如何通过齐护AIcam与AIstart Pro主板拍照并上传到Mixio进行显示。

一、使用前准备

齐护教育版Mixly
Mixio账号注册

二、Mixio图片组件

1、组件介绍

Mixio图片组件（见图1）是Mixio平台提供的一个UI设计组件，其可以显示网络视频或者图片对UI进行美化，其支持的参数有两种，第一种是图片或者视频的URL地址，第二种是图片的base64编码图片（见图2），这两种方式都可以将图片显示到Mixio当中，两种方式的区别如下：

URL方式

URL方式相当于浏览器主动获取指定地址的图片或者视频进行下载，需要保证浏览器能够正常访问图片或者视频，该URL需要公网链接才可以外网访问，否则仅能局域网使用。
base64字符串方式

base64字符串方式仅图片有效，将图片进行base64编码转换后直接发送到Mixio，传输的是图片本身，这种方式则不要求图片具备公网访问能力，因为图片已经以字符串的方式保存到了Mixio服务器。

图1 Mixio图片组件

图2 Mixio图片显示

2、组件添加

Mixio组件添加（见图3、图4、图5）此处的项目名称为data，先添加一个图片显示组件消息主题默认然后拖动组件画布并缩放到合适的位置。

图3 Mixio添加组件1

图4 Mixio添加组件2

图5 Mixio添加组件3

三、Mixio图片组件配置工具及其使用

Mixio图片组件配置工具是齐护机器人提供的一个Mixio图片转发工具，它可以在线配置Mixio服务器与账号等信息从而构造得到一个图片上传链接，将图片以二进制文件形式发送该地址那么便能将上传的图片以base64编码的形式发送到Mixio显示。该工具使用（见图6）

图6 Mixio图片组件配置工具

按照上面的1-7序号所示步骤填写相关服务器与账号信息点击提交参数，在序号8所示的文本显示框将显示属于自己的Mixio上传图片链接，然后点击序号9按钮一键复制URL，我们将图片上传到该URL便可以将图片发送到Mixio显示，这里以API Tester为例调试方式（见图7）

图7 API调试

将API Tester改为POST上传方式BODY方式为File，将上面得到的URL填写到地址栏然后可以看到1-5序号所示的信息，然后鼠标单击序号6所示的位置选择图片（此处已经选择好了0000.jpg这个图片，注意仅支持jpg与png格式的图片），最后点击Send然后我们便可以在Mixio看到推送的图片了（见图8），这里返回success表示发送成功。