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中的内容注释掉替换成了下面的内容templatev-containerv-layout text-xs-center wrapv-flex xs12 sm6 offset-sm3v-card hoverv-card-title stylefont-weight: 800; font-size: 18px阿里云平台数据发送测试/v-card-titlediv stylewidth: 90%; margin: 0 auto; padding: 20pxv-text-field v-modelmesdatalabel测试数据hint输入测试数据/v-text-fieldv-btn block colorsuccesssizelargetypesubmitclicksubmitdata提交/v-btn/div/v-card/v-flex/v-layout/v-container/templatescriptexportdefault{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(){},};/script2.2 后端接口修改加入一个后端接口,方便前端界面传输数据// mqtt_send_data_toserver 是我自己封装的一个发送函数,代码都会给大家externvoidmqtt_send_data_toserver(char*message);staticesp_err_tmqtt_echo_handler(httpd_req_t*req){inttotal_lenreq-content_len;intcur_len0;charmessage[256]{0};char*buf((rest_server_context_t*)(req-user_ctx))-scratch;intreceived0;if(total_lenSCRATCH_BUFSIZE){/* Respond with 500 Internal Server Error */httpd_resp_send_err(req,HTTPD_500_INTERNAL_SERVER_ERROR,content too long);returnESP_FAIL;}while(cur_lentotal_len){receivedhttpd_req_recv(req,bufcur_len,total_len);if(received0){/* Respond with 500 Internal Server Error */httpd_resp_send_err(req,HTTPD_500_INTERNAL_SERVER_ERROR,Failed to post control value);returnESP_FAIL;}cur_lenreceived;}buf[total_len]\0;cJSON*rootcJSON_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);returnESP_OK;}在start_rest_server 函数中添加下面的代码 (注册解析前端方法到系统中)httpd_uri_tmqtt_post_uri{.uri/api/v1/mqtt/echo,.methodHTTP_POST,.handlermqtt_echo_handler,.user_ctxrest_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 */#includestdio.h#includestdint.h#includestddef.h#includestring.h#includeesp_system.h#includenvs_flash.h#includeesp_event.h#includeesp_netif.h#includecJSON.h#includeesp_log.h#includemqtt_client.h#defineCLIENTID#defineUSERNAME#definePASSWORD#defineSERVERURLmqtt://121.36.42.100:1883#definePUSHTOPIC$oc/devices/你的设备ID/sys/properties/reportesp_mqtt_client_handle_tmqtt_client;staticconstchar*MQTTTAGMQTT;staticvoidlog_error_if_nonzero(constchar*message,interror_code){if(error_code!0){ESP_LOGE(MQTTTAG,Last error %s: 0x%x,message,error_code);}}voidmqtt_send_data_toserver(char*message){intmsg_id;charobj_name[10]{0};doublerounded0;cJSON*rootcJSON_CreateObject();// 创建数组对象cJSON*arraycJSON_CreateArray();// 创建对象cJSON*objcJSON_CreateObject();cJSON_AddStringToObject(obj,service_id,echo);cJSON*valuescJSON_CreateObject();cJSON_AddStringToObject(values,read,message);cJSON_AddItemToObject(obj,properties,values);// 将对象添加到数组中cJSON_AddItemToArray(array,obj);// 将数组添加到根节点中cJSON_AddItemToObject(root,services,array);constchar*sys_infocJSON_Print(root);ESP_LOGI(MQTTTAG,%s,sys_info);msg_idesp_mqtt_client_publish(mqtt_client,PUSHTOPIC,sys_info,0,1,1);free((void*)sys_info);cJSON_Delete(root);return;}staticvoidmqtt5_event_handler(void*handler_args,esp_event_base_tbase,int32_tevent_id,void*event_data){ESP_LOGD(MQTTTAG,Event dispatched from event loop base%s, event_id%PRIi32,base,event_id);esp_mqtt_event_handle_teventevent_data;esp_mqtt_client_handle_tclientevent-client;intmsg_id;switch((esp_mqtt_event_id_t)event_id){caseMQTT_EVENT_CONNECTED:ESP_LOGI(MQTTTAG,MQTT_EVENT_CONNECTED);mqtt_send_data_toserver(sadsadsadas);break;caseMQTT_EVENT_DISCONNECTED:ESP_LOGI(MQTTTAG,MQTT_EVENT_DISCONNECTED);esp_mqtt_client_reconnect(client);break;caseMQTT_EVENT_SUBSCRIBED:ESP_LOGI(MQTTTAG,MQTT_EVENT_SUBSCRIBED, msg_id%d,event-msg_id);break;caseMQTT_EVENT_UNSUBSCRIBED:/* 退订绑定的服务目前先不处理 */ESP_LOGI(MQTTTAG,MQTT_EVENT_UNSUBSCRIBED, msg_id%d,event-msg_id);break;caseMQTT_EVENT_PUBLISHED:/* 推送绑定的事件 */ESP_LOGI(MQTTTAG,MQTT_EVENT_PUBLISHED, msg_id%d,event-msg_id);break;caseMQTT_EVENT_DATA:/* 数据下发先不处理 */ESP_LOGI(MQTTTAG,MQTT_EVENT_DATA);break;caseMQTT_EVENT_ERROR:ESP_LOGI(MQTTTAG,MQTT_EVENT_ERROR return code %d,event-error_handle-connect_return_code);if(event-error_handle-error_typeMQTT_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 transports 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;}}intmqtt5_app_start(void){esp_mqtt_client_config_tmqtt_cfg{.broker.address.uriSERVERURL,.credentials.client_idCLIENTID,.credentials.usernameUSERNAME,.credentials.authentication.passwordPASSWORD,.network.disable_auto_reconnecttrue};ESP_LOGI(MQTTTAG,MQTT Server url:%s Client Id %s,mqtt_cfg.broker.address.uri,mqtt_cfg.credentials.client_id);mqtt_clientesp_mqtt_client_init(mqtt_cfg);if(mqtt_clientNULL){return1;}/* 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);return0;}4.添加编译文件5.正常编译烧写这个就不再叙述了,查看以往的案例6. 结果展示平台端的显示网页端的发送 (注意我是修改的Chart.vue 这个文件的内容)后台日志显示 (按照这个报文形势发送){services:[{service_id:echo,properties:{read:xxxxx}}]}总结今天完成了ESP 对接华为云的案例,里面还是有点弯弯绕的.有疑问就提出来,我都会回复.后面再有好玩的案例,再发出来看.

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

相关推荐

分布式锁详解-MySQL、ZooKeeper与Redis三种实现方案

如何高效管理微信聊天记录：实用备份与分析方法指南

认知几何学：思维如何弯曲意义空间——课题提纲、核心理论及教育应用（报告版）

更多资讯

VScode前端插件推荐：用TaoToken统一管理AI编程助手的Key与API通道

三大主流推理框架汇总：vLLM · SGLang · FlashInfer 与 TaoToken 统一 Key 接入实践

MuMu模拟器接入AI工具，三步实现自然语言控制：TaoToken统一Key配置与mumu-control skill验证

NVMe 驱动开发入门：从 U-Boot 到 Linux 内核的实战指南

Kimi For Coding 实测：技能包安装到 README 维护的完整体验

龙虾AI OpenClaw Win11安装全流程：TaoToken统一Key接入本地自动化工具部署

今日更新

Agent Skills 完全指南：原理、写法、安装与实战避坑

Agent Skills 实战：从 Genkit 定义到 GKE 部署与排查

Agent Skills 实战：从设计到调试的完整指南

本周精选

CMOS设计三大物理效应：体效应、沟道长度调制与亚阈值导电

微信小程序在线阅读毕设全解析：Java后端+MySQL+避坑实战

Android音频问题五层分析法：从App到Codec的系统化诊断

本月热门

我发现了一个新思路：用 Remotion + Claude Code 像写代码一样自动化生成短视频

Windows下 Codex 中 Chrome 和 Computer Use 插件不可用问题排查及解决参考方式：TaoToken 统一 Key 配置与验证

2026 大模型集体涨价：用 Python 做企业 Token 成本测算与选型避坑（附配置）

读完文章，想聊聊您的网站？