ESP32 web 对接华为云平台--MQTT协议

文章目录

  • 前言
  • 一、MQTT协议
  • 二、如何使用MQTT协议对接华为云
    • 1.注册华为云账号
    • 2.设备接入中创建资源空间
    • 3.如何连接
    • 4.通过MQTT.fx工具做初步对接
      • 4.1 设置连接信息
      • 4.2 连接平台
    • 5.查看平台设备信息
  • 三. 设备测对接平台
    • 1.ESP测引入MQTT库
    • 2.编码
      • 2.1前端编码修改
      • 2.2 后端接口修改
    • 3.MQTT编码
    • 4.添加编译文件
    • 5.正常编译烧写
    • 6. 结果展示
  • 总结


前言

今天这篇文章,对于刚接触物联网协议或者刚接触ESP这款模组并且想对接云平台的人特别有帮助。还希望大家耐心的看完。
在今天的实验里面,你需要有三个概念。
第一什么是MQTT协议,
第二 MQTT协议又是如何连接的,
第三点如何在官方的web demo上添加后端服务和前端页面的接口,实验在线MQTT数据传输。


一、MQTT协议

MQTT协议是一个物联网协议,简单来说就是设备和云平台之间的一种通信传输方式,就好比,在中国大家用中国话来交流,在美国用美国话交流。这就对应着两种通信协议。具体的细节,我的建议还是去百度看看。对于初学者,有这个通信的概念即可。

二、如何使用MQTT协议对接华为云

1.注册华为云账号

这个就不说了,去百度找华为云的官方,免费注册。

2.设备接入中创建资源空间

这个可以百度一下华为云设备接入MQTT设备注册

3.如何连接

首先,我们要参考文档 。在这个文档里面,我们可以看到,我们连接的时候需要填写设备ID,用户名和密码。
在这里插入图片描述

其次,怎么获取这一套数据,是目前我们要思考的问题。好在官方直接给出了加密运算的方式。参数计算链接

在下图中,重点关注设备ID和密钥,密钥是在你创建设备的时候就有的
在这里插入图片描述

注意上图和下图的设备ID不一样,这是因为我想要告诉大家这个密钥在什么地方,单独创建了一下。

在这里插入图片描述

通过下面的页面,我们填入上述的设备ID和密钥,获取新的三元素,我们就可以对接设备。

在这里插入图片描述

4.通过MQTT.fx工具做初步对接

4.1 设置连接信息

在这里插入图片描述

4.2 连接平台

在这里插入图片描述

5.查看平台设备信息

在这里插入图片描述

三. 设备测对接平台

1.ESP测引入MQTT库

官方的MQTT demo路径 /esp/esp-idf/examples/protocols/mqtt

在上述的方案中,我们已经完成了电脑模拟设备对接的过程。接下来,我们要用我们的ESP模组完成云平台的对接。还是用之前的web demo。

2.编码

2.1前端编码修改

注意我是将Chart.vue中的内容注释掉替换成了下面的内容

<template><v-container><v-layout text-xs-center wrap><v-flex xs12 sm6 offset-sm3><v-card hover><v-card-title style="font-weight: 800; font-size: 18px">阿里云平台数据发送测试</v-card-title><div style="width: 90%; margin: 0 auto; padding: 20px"><v-text-fieldv-model="mesdata"label="测试数据"hint="输入测试数据"></v-text-field><v-btnblockcolor="success"size="large"type="submit"@click="submitdata">提交</v-btn></div></v-card></v-flex></v-layout></v-container>
</template><script>
export default {data() {return {mesdata: null,};},methods: {submitdata() {this.$ajax.post("/api/v1/mqtt/echo", {data: this.mesdata,}).then((data) => {console.log(data);}).catch((error) => {console.log(error);});this.mesdata = "";},},destroyed() {},mounted() {},
};
</script>

2.2 后端接口修改

加入一个后端接口,方便前端界面传输数据

// mqtt_send_data_toserver 是我自己封装的一个发送函数,代码都会给大家
extern void mqtt_send_data_toserver(char *message);
static esp_err_t mqtt_echo_handler(httpd_req_t *req)
{int total_len = req->content_len;int cur_len = 0;char message[256] = {0};char *buf = ((rest_server_context_t *)(req->user_ctx))->scratch;int received = 0;if (total_len >= SCRATCH_BUFSIZE){/* Respond with 500 Internal Server Error */httpd_resp_send_err(req, HTTPD_500_INTERNAL_SERVER_ERROR, "content too long");return ESP_FAIL;}while (cur_len < total_len){received = httpd_req_recv(req, buf + cur_len, total_len);if (received <= 0){/* Respond with 500 Internal Server Error */httpd_resp_send_err(req, HTTPD_500_INTERNAL_SERVER_ERROR, "Failed to post control value");return ESP_FAIL;}cur_len += received;}buf[total_len] = '\0';cJSON *root = cJSON_Parse(buf);//注意这里,这边是为了解析前端页面的数据strcpy(message, cJSON_GetObjectItem(root, "data")->valuestring);cJSON_Delete(root);httpd_resp_sendstr(req, "Post control value successfully");mqtt_send_data_toserver(message);return ESP_OK;
}

在start_rest_server 函数中添加下面的代码 (注册解析前端方法到系统中)

    httpd_uri_t mqtt_post_uri = {.uri = "/api/v1/mqtt/echo",.method = HTTP_POST,.handler = mqtt_echo_handler,.user_ctx = rest_context};httpd_register_uri_handler(server, &mqtt_post_uri);

3.MQTT编码


/** SPDX-FileCopyrightText: 2022-2023 Espressif Systems (Shanghai) CO LTD** SPDX-License-Identifier: Apache-2.0*/#include <stdio.h>
#include <stdint.h>
#include <stddef.h>
#include <string.h>
#include "esp_system.h"
#include "nvs_flash.h"
#include "esp_event.h"
#include "esp_netif.h"
#include "cJSON.h"
#include "esp_log.h"
#include "mqtt_client.h"#define CLIENTID ""
#define USERNAME ""
#define PASSWORD ""
#define SERVERURL "mqtt://121.36.42.100:1883"#define PUSHTOPIC "$oc/devices/你的设备ID/sys/properties/report"esp_mqtt_client_handle_t mqtt_client;static const char *MQTTTAG = "MQTT";static void log_error_if_nonzero(const char *message, int error_code)
{if (error_code != 0){ESP_LOGE(MQTTTAG, "Last error %s: 0x%x", message, error_code);}
}void mqtt_send_data_toserver(char *message)
{int msg_id;char obj_name[10] = {0};double rounded = 0;cJSON *root = cJSON_CreateObject();// 创建数组对象cJSON *array = cJSON_CreateArray();// 创建对象cJSON *obj = cJSON_CreateObject();cJSON_AddStringToObject(obj, "service_id", "echo");cJSON *values = cJSON_CreateObject();cJSON_AddStringToObject(values, "read", message);cJSON_AddItemToObject(obj, "properties", values);// 将对象添加到数组中cJSON_AddItemToArray(array, obj);// 将数组添加到根节点中cJSON_AddItemToObject(root, "services", array);const char *sys_info = cJSON_Print(root);ESP_LOGI(MQTTTAG, "%s", sys_info);msg_id = esp_mqtt_client_publish(mqtt_client, PUSHTOPIC, sys_info, 0, 1, 1);free((void *)sys_info);cJSON_Delete(root);return;
}static void mqtt5_event_handler(void *handler_args, esp_event_base_t base, int32_t event_id, void *event_data)
{ESP_LOGD(MQTTTAG, "Event dispatched from event loop base=%s, event_id=%" PRIi32, base, event_id);esp_mqtt_event_handle_t event = event_data;esp_mqtt_client_handle_t client = event->client;int msg_id;switch ((esp_mqtt_event_id_t)event_id){case MQTT_EVENT_CONNECTED:ESP_LOGI(MQTTTAG, "MQTT_EVENT_CONNECTED");mqtt_send_data_toserver("sadsadsadas");break;case MQTT_EVENT_DISCONNECTED:ESP_LOGI(MQTTTAG, "MQTT_EVENT_DISCONNECTED");esp_mqtt_client_reconnect(client);break;case MQTT_EVENT_SUBSCRIBED:ESP_LOGI(MQTTTAG, "MQTT_EVENT_SUBSCRIBED, msg_id=%d", event->msg_id);break;case MQTT_EVENT_UNSUBSCRIBED:/* 退订绑定的服务,目前先不处理 */ESP_LOGI(MQTTTAG, "MQTT_EVENT_UNSUBSCRIBED, msg_id=%d", event->msg_id);break;case MQTT_EVENT_PUBLISHED:/* 推送绑定的事件 */ESP_LOGI(MQTTTAG, "MQTT_EVENT_PUBLISHED, msg_id=%d", event->msg_id);break;case MQTT_EVENT_DATA:/* 数据下发,先不处理 */ESP_LOGI(MQTTTAG, "MQTT_EVENT_DATA");break;case MQTT_EVENT_ERROR:ESP_LOGI(MQTTTAG, "MQTT_EVENT_ERROR return code %d", event->error_handle->connect_return_code);if (event->error_handle->error_type == MQTT_ERROR_TYPE_TCP_TRANSPORT){log_error_if_nonzero("reported from esp-tls", event->error_handle->esp_tls_last_esp_err);log_error_if_nonzero("reported from tls stack", event->error_handle->esp_tls_stack_err);log_error_if_nonzero("captured as transport's socket errno", event->error_handle->esp_transport_sock_errno);ESP_LOGI(MQTTTAG, "Last errno string (%s)", strerror(event->error_handle->esp_transport_sock_errno));}break;default:ESP_LOGI(MQTTTAG, "Other event id:%d", event->event_id);break;}
}int mqtt5_app_start(void)
{esp_mqtt_client_config_t mqtt_cfg = {.broker.address.uri = SERVERURL,.credentials.client_id = CLIENTID,.credentials.username = USERNAME,.credentials.authentication.password = PASSWORD,.network.disable_auto_reconnect = true};ESP_LOGI(MQTTTAG, "MQTT Server url:%s Client Id %s", mqtt_cfg.broker.address.uri, mqtt_cfg.credentials.client_id);mqtt_client = esp_mqtt_client_init(&mqtt_cfg);if (mqtt_client == NULL){return 1;}/* The last argument may be used to pass data to the event handler, in this example mqtt_event_handler */esp_mqtt_client_register_event(mqtt_client, ESP_EVENT_ANY_ID, mqtt5_event_handler, NULL);esp_mqtt_client_start(mqtt_client);return 0;
}

4.添加编译文件

在这里插入图片描述

5.正常编译烧写

这个就不再叙述了,查看以往的案例

6. 结果展示

平台端的显示

在这里插入图片描述

网页端的发送 (注意 我是修改的Chart.vue 这个文件的内容)

在这里插入图片描述

后台日志显示 (按照这个报文形势发送)

在这里插入图片描述

{"services": [{"service_id": "echo","properties": {"read": "xxxxx"}}]
}

总结

今天完成了ESP 对接华为云的案例,里面还是有点弯弯绕的.有疑问就提出来,我都会回复.
后面再有好玩的案例,再发出来看.

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/713831.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

element-plus+vue3表单含图片(可预览)(线上图片)

一、要实现的效果&#xff1a; 二、如果期间出现这样的效果&#xff08;表格穿透过来了&#xff09;&#xff0c;加上了这行代码就可以了&#xff1a; preview-teleported“true” 如果仅测试用&#xff0c;建议使用线上图片链接的形式&#xff0c;免得本地地址不生效&#xf…

SSH 的两种认证方式

SSH&#xff08;Secure Shell&#xff09;提供了几种不同的认证方式&#xff0c;其中两种最常见的方式是密码认证和密钥认证。以下是它们的详细介绍&#xff1a; 密码认证&#xff1a; 原理&#xff1a;用户在连接时输入用户名和密码&#xff0c;然后将密码传输到远程服务器进行…

数学实验-Matlab使用(1)

使用方法以及笔记均在文件中 class1_func1.m function f class1_func1(x) % f为输出&#xff0c;输出有多个时需要用中括号以矩阵的方式包起来 % x为输入f sin(x)class1_func2.m function [a,b,u,v] class1_func2(x,y)[a,b] eig(x)[u,v] eig(y)class1.m % 当语句后有…

yolov9从头开始训练

yolov9从头开始训练 一、准备数据集 数据集相关文件存放布局如下 yolov9-datasets ├── train │ ├── images │ │ ├── image.jpg │ │ ├── │ └── labels │ ├── image.txt │ ├── ├── valid │ ├── images │ │ ├── image.jpg │ │ ├─…

吴恩达deeplearning.ai:模型选择交叉验证测试集的训练方法

以下内容有任何不理解可以翻看我之前的博客哦&#xff1a;吴恩达deeplearning.ai专栏 在上一节中&#xff0c;我们了解了如何利用测试集来评估模型性能。今天我们来进一步完善这个想法&#xff0c;让你使用该技术自动选择一个更好的模型。 文章目录 模型选择交叉验证 Cross Va…

SpringBoot 框架(上)

SpringBoot SpringBoot概述依赖管理自动配置SpringBoot 注解使用ConfigurationImport(value {Cat.class,Dog.class})ImportResource(locations "classpath:beans.xml") yaml 标记语言概述基本语法数据类型字面量对象数组 使用细节 Rest 风格请求处理概述注意事项 接…

vue2 开发记录

el-select 如何修改选择项的样式/el-select-dropdown__item 文字上下显示 测试代码 <div stylemargin-left: 100px><!-- 测试代码--><el-select filterablesizemini><div classxxx-el-select><el-optionv-foritem in [{key:1,des:2,…

AVT Prosilica GC Vision Cameras 相机视觉说明使用安装。具体详情内容可参看PDF目录内容。

AVT Prosilica GC Vision Cameras 相机视觉说明使用安装。具体详情内容可参看PDF目录内容。

TikTok矩阵系统功能怎么写?常用源代码是什么?

TikTok矩阵系统的功能是如何编写的?又有哪些常用的源代码支撑这些功能呢?本文将通过五段源代码的分享&#xff0c;为大家揭开TikTok矩阵系统的神秘面纱。 一、TikTok矩阵系统的核心功能 TikTok的矩阵系统涵盖了多个核心功能&#xff0c;包括但不限于用户管理、内容分发、推…

【接口测试】HTTP协议介绍

目录 介绍 HTTP状态码 HTTP报文 请求方法 HTTP版本 HTTP标头 通用标头 请求标头 响应标头 get 编码 post 编码 RESTful风格 HTTPS 绝大多数的Web服务接口都是基于HTTP协议进行通信的&#xff0c;包括RESTful API和SOAP等。了解HTTP协议可以帮助测试人员理解接口的…

回溯算法题单✨✨✨

力扣&#xff1a; 78. 子集 - 力扣&#xff08;LeetCode&#xff09; 216. 组合总和 III - 力扣&#xff08;LeetCode&#xff09; LCR 080. 组合 - 力扣&#xff08;LeetCode&#xff09; LCR 082. 组合总和 II - 力扣&#xff08;LeetCode&#xff09; LCR 083. 全排列…

【多线程】CAS详解

目录 &#x1f334;什么是 CAS&#x1f338;CAS 伪代码 &#x1f38d;CAS 是怎么实现的&#x1f340;CAS 有哪些应⽤&#x1f338;实现原子类&#x1f338;实现自旋锁 &#x1f333;CAS 的 ABA 问题&#x1f338;**什么是 ABA 问题**&#xff1f;&#x1f338;ABA 问题引来的 B…

【C++】核心编程--函数高级

文章目录 1. 函数的默认参数2. 函数占位参数3. 函数重载4. 注意事项 1. 函数的默认参数 在C中&#xff0c;函数的形参列表中的形参是可以有默认值的 //语法&#xff1a; 返回值类型 函数名 (参数 默认值){} #include<iostream> using namespace std; //函数默认参数 //如…

异常值检测-3σ法提交 代码注释

背景信息里面都给了相应的答案&#xff0c;但我们可以多了解一下代码的含义&#xff0c;而不是简单的复制粘贴 import pandas as pd import matplotlib.pyplot as plt from scipy import stats import numpy as npdata pd.read_csv("src/death.csv", index_colUnna…

ASPICE实操中的那点事儿-如何避免重复性测试

写在前面 ASPICE理解起来容易&#xff0c;毕竟是有条有理的。但实操起来&#xff0c;尤其是把ASPICE各过程域做全的时候&#xff0c;会遇到各种各样的问题&#xff08;不是技术问题有多难&#xff0c;而是该如何做选择&#xff0c;如何既能符合ASPICE要求&#xff0c;保证过程质…

智慧城市建设的新里程碑:公共服务电子支付大屏

随着科技的飞速发展&#xff0c;我们的生活正在经历前所未有的变革。电子支付的出现&#xff0c;无疑是这场变革中的一大亮点&#xff0c;它不仅改变了我们日常的支付方式&#xff0c;更成为智慧城市建设的重要一环&#xff0c;为公众提供了更加便捷、高效的服务体验。 在以前&…

python SHP2COCO

1. 将shp的标签数据转成coco # -*- coding: utf-8 -*- import os, json import cv2 from osgeo import gdal import numpy as np from osgeo import ogr, gdal, osr from shapely.geometry import box, shape from shapely.geometry.polygon import Polygon import collection…

Flutter 的状态管理

状态提升&#xff08;Lifting-state-up&#xff09; 把子组件的状态&#xff0c;提升到上级组件中&#xff0c;从而实现在多个组件之间共享和同步数据的效果 以 flutter counter demo&#xff0c;那个按按钮1 的来说&#xff0c;现在的 count 是几&#xff0c;不是存在页面显…

政府采购标书制作的要点解析

导语&#xff1a;政府采购是政府为满足公共利益&#xff0c;按照法定程序和标准&#xff0c;通过招标、竞争性谈判等方式&#xff0c;购买商品、工程和服务的行为。标书作为政府采购活动中的重要文件&#xff0c;其制作质量直接影响到项目的顺利进行。本文将围绕政府采购标书制…

二路归并排序的算法设计和复杂度分析and周记

数据结构实验报告 实验目的: 通过本次实验&#xff0c;了解算法复杂度的分析方法&#xff0c;掌握递归算法时间复杂度的递推计算过程。 实验内容&#xff1a; 二路归并排序的算法设计和复杂度分析 实验过程&#xff1a; 1.算法设计 第一步&#xff0c;首先要将数组进行…