微信小程序连接到阿里云物联网平台

目录

    • 准备阶段
    • 阿里云配置
    • 下载mqtt.min.js文件
    • 小程序实现
      • 注意
    • 小程序配置服务器域名

概述:介绍使用微信小程序连接到阿里云平台的快捷方法和完整过程。
阿里云平台建立设备,提供mqtt连接参数,小程序借助mqtt.min.js,也就是基于Github下的MQTT.js 库,实现mqtt通信连接到阿里云,过程简单清晰。

https://github.com/mqttjs/MQTT.js

准备阶段

1.需要有阿里云物联网平台账号,已注册。
2.需要下载好微信开发者工具。
3.下载mqtt.min.js文件。

阿里云配置

阿里云上创建设备获取相关连接信息的参数,相关操作可参考物联网平台配置(MQTT)

需要用到的参数如下图所示:

在这里插入图片描述

下载mqtt.min.js文件

这个的话,确实也是网上找的资源,链接:源代码
但是需要自己保存为文件。
我也保存了文件,大家可以直接免费下载使用。
通过网盘分享的文件:mqtt.min.js
链接: https://pan.baidu.com/s/1IXoG50OWMruQ6I4iYeNtWg?pwd=wbs9 提取码: wbs9

小程序实现

首先创建项目
在这里插入图片描述
选用测试号即可,这里不用选云服务,看个人需求吧,模板选js 基础模板即可。

界面控件什么的就不多说了,自己随便弄个开关什么,按钮什么的即可。
或者直接就是登录到该界面就直接后台自动连接到阿里云平台。

先说下目录结构

vx-app-test/
├── app.js                  # 小程序全局逻辑
├── app.json                # 全局配置
├── app.wxss                # 全局样式
├── project.config.json     # 项目配置文件
├── pages/
│   └── index/              # 首页
│       ├── index.js
│       ├── index.json
│       ├── index.wxml
│       └── index.wxss
└── utils/└── mqtt-client.js       # 封装的MQTT连接模块

index.js是json源码,控制逻辑实现,index.wxml和 index.wxss这个是界面配置文件,login.json和页面也有关联,默认即可。mqtt-client.js 可以理解为接口库。
index.js的详细源码:

const mqtt = require('../../utils/mqtt.min.js');
const subTopic = "" //订阅的topic,接收订阅信息
const publishTopic = "" //发布的topic,用来向平台传递信息
Page({
//定义全局变量data: {userInfo: null,          // 用户信息mqttStatus: '未连接',     // MQTT连接状态mqttConnected: false,    // MQTT连接标识mqttClient: null,		//MQTT连接},onLoad() {  // 初始化MQTT连接this.initMQTT()},onUnload() {// 页面卸载时断开MQTT连接this.data.mqttClient.disconnect()},initMQTT(){const options = {keepalive: 60, //60sclean: true, //cleanSession不保持持久会话protocolVersion: 4 //MQTT v3.1.1}//将前面阿里云平台获取到的连接信息,复制到下面对应变量中即可。options.clientId =""options.username =""options.password = ""const mqtt_url = "wxs:/{ProductKey}.iot-as-mqtt.{Region ID}.aliyuncs.com"const client = mqtt.connect(mqtt_url ,options)//连接事件client.on('connect', function () {console.log('连接服务器成功')//连接后可进行订阅// 订阅多个主题// client.subscribe(['topic1', 'topic2'], {qos: 0}, function(err)/*QoS级别说明:0:最多一次,发送者只发送一次消息,不进行重试1:至少一次,确保消息到达Broker2:恰好一次,使用两阶段确认保证消息不丢失不重复*/client.subscribe(subTopic, {qos: 1}, function (err) {if (!err) {console.log('订阅成功!');}})});//接收消息监听client.on('message', function (topic, message) {// message is Buffer  // message 是 Buffer 类型,需要转换为字符串let msg = message.toString();console.log('收到消息:'+ msg);//关闭连接 client.end()});//理论上有这两个就够了,订阅后,接收消息,处理消息。//错误事件client.on('error', function(error) {console.error('连接错误:', error);});    this.data.mqttClient = client; // 保存到全局},//举例一个开关触发接口,实现消息上报。
// 开关状态变化onPowerChange(e) {const powerOn = e.detail.value//获取开关值this.setData({ powerOn })    // 发送控制命令 构建msg消息,字符或者整型,自行处理,最终需要转为json// const msg = {staus: powerOn ? '1' : '0' };const message = JSON.stringify({cmd: 'status',value: powerOn ? 1 : 0})this.data.mqttClient.publish(publishTopic , message, {qos: 1});},
})

一些其他接口

//重连事件
client.on('reconnect', function() {console.log('正在尝试重新连接...');
});//断开连接事件
client.on('close', function() {console.log('连接已关闭');
});

注意

这里有几个需要注意的地方

mqtt链接域名问题

const mqtt_url = "wxs:/{ProductKey}.iot-as-mqtt.{Region ID}.aliyuncs.com"

这里的{ProductKey},要替换为你的产品key,来自阿里云平台,这里的{Region ID}也需要替换为你的地域。

物联网平台中的地域是什么,如何查询?

在这里插入图片描述

常用地域对照表

地域名称所在城市Region ID
华北 2北京cn-beijing
华东 2上海cn-shanghai
华南 1深圳cn-shenzhen

官网地域对照表链接

综上:一个案例,ProductKey : h6xxxxxwI , Region ID:cn-shanghai

const mqtt_url = "wxs:h6xxxxxwI.iot-as-mqtt.cn-shanghai.aliyuncs.com"

小程序配置服务器域名

此外小程序需要设置服务器域名,才能访问,不然无法访问阿里云物联网平台。
登录微信公众平台-》扫码登录(用开发者助手同一个vx)
登录的时候会有一个选项,需要根据开发者助手中的信息选择登录。

在这里插入图片描述

登录后可以找到下面的页面,修改并在对应栏下添加域名即可。

注意一个关键的地方,这里输入的域名是wss:的,而实际代码中使用的是wssd :

const mqtt_url = "wxs:h6xxxxxwI.iot-as-mqtt.cn-shanghai.aliyuncs.com"

注意将代码中的mqtt_url进行替换为:

wss:h6xxxxxwI.iot-as-mqtt.cn-shanghai.aliyuncs.com

这不会影响连接。

在这里插入图片描述

完成以上操作,编译后,观察控制台输出正常,就可以观察阿里云设备在线就说明成功登录,建立连接了。

以上就是小程序连接阿里云的全部过程了,看了下网上一些其他的博客,有点乱,还要用上加密方法,实际上是不需要的,可以直接使用阿里云中的连接参数就可以了,当然这可能是不安全的,其他考虑就需要各位自己考虑了,有啥问题欢迎评论区留言。

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

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

相关文章

2-3〔O҉S҉C҉P҉ ◈ 研记〕❘ 漏洞扫描▸AppScan(WEB扫描)

郑重声明: 本文所有安全知识与技术,仅用于探讨、研究及学习,严禁用于违反国家法律法规的非法活动。对于因不当使用相关内容造成的任何损失或法律责任,本人不承担任何责任。 如需转载,请注明出处且不得用于商业盈利。 …

LeetCode 刷题【47. 全排列 II】

47. 全排列 II 自己做 解1&#xff1a;检查重复 class Solution { public:void circle(vector<int> nums, vector<vector<int>> &res,int start){int len nums.size();if(start len - 1){ //到头了//检查重复bool is_exist fa…

Https之(一)TLS介绍及握手过程详解

文章目录简介 TLSTLS第一次握手1.Client HelloTLS第二次握手2.Server Hello3.Certificate4.Server Hello DoneTLS第三次握手5.Client Key Exchange6.Change Cipher Spec7.Encrypted Handshake MessageTLS第四次握手8.New Session Ticket9.Change Cipher Spec10.Encrypted Hands…

【WEB 】从零实现一个交互轮播图(附源码)

文章目录 一、轮播图整体功能规划二、HTML结构深度解析三、CSS样式实现细节1. 定位系统详解2. 显示/隐藏机制3. 按钮交互效果实现4. 纯CSS箭头实现5. 指示器&#xff1a;当前位置可视化 四、JavaScript逻辑深入解析1. 核心变量与DOM获取2. 图片切换函数&#xff08;核心逻辑&am…

机器学习--PCA降维

一核心部分 1解决的问题&#xff1a;应对高维数据带来的计算量大、冗余信息多、易出现过拟合等问题&#xff0c;在减少数据维度的同时尽可能保留原始数据的关键信息。2核心思想&#xff1a…

leetcode 1277. 统计全为 1 的正方形子矩阵 中等

给你一个 m * n 的矩阵&#xff0c;矩阵中的元素不是 0 就是 1&#xff0c;请你统计并返回其中完全由 1 组成的 正方形 子矩阵的个数。示例 1&#xff1a;输入&#xff1a;matrix [[0,1,1,1],[1,1,1,1],[0,1,1,1] ] 输出&#xff1a;15 解释&#xff1a; 边长为 1 的正方形有…

知识蒸馏 - 各类概率分布

知识蒸馏 - 各类概率分布 flyfish一、离散概率分布 离散分布描述的是取值为离散值&#xff08;如0,1,2,…&#xff09;的随机变量的概率规律&#xff0c;通常用概率质量函数&#xff08;PMF&#xff09; 表示某一取值的概率。 1. 伯努利分布&#xff08;Bernoulli Distribution…

软件测试-Selenium学习笔记

""" 目标&#xff1a; driver.find_element() 需求&#xff1a; 1. 使用driver.find_element()方法 2. 输入用户名&#xff1a;admin 3. 输入密码&#xff1a;123456 """ # 导包 from selenium import webdriver from time import …

知微传感3D相机上位机DkamViewer使用:给相机升级固件

写在前面 本人从事机器视觉细分的3D相机行业。编写此系列文章主要目的有&#xff1a; 1、便利他人应用相机&#xff0c;本系列文章包含公司所出售相机的SDK的使用例程及详细注释&#xff1b;2、促进行业发展及交流。 知微传感Dkam系列3D相机可以应用于定位分拣、焊接焊缝提取、…

CMake进阶: CMake Modules---简化CMake配置的利器

目录 1.简介 2.为什么需要 CMake Modules&#xff1f; 3.内置模块&#xff1a;开箱即用的工具 3.1.依赖查找模块&#xff08;FindXXX.cmake&#xff09; 3.2.功能检测模块&#xff08;CheckXXX.cmake&#xff09; 3.3.通用工具模块&#xff08;如 FetchContent.cmake、CT…

【Docker】Ubuntu上安装Docker(网络版)

【Docker】Ubuntu上安装Docker注意&#xff1a;一、环境准备1. 系统要求2. 卸载旧版本二、安装步骤1.配置仓库源2.安装 Docker引擎3.验证安装情况三、解决报错1、检查网络连接2、检查Docker服务状态3、换源4.重载生效、重启服务、查看是否配置成功5.验证解决情况四、权限与配置…

Socket 编程 TCP

TCP 网络程序 和刚才 UDP 类似. 实现一个简单的英译汉的功能。TCP是面向字节流的可靠传输&#xff0c;如同前文的管道流&#xff0c;只要是流&#xff0c;它的操作就是文件的写出与读入。TCP socket API 详解下面介绍程序中用到的 socket API,这些函数都在 sys/socket.h 中。so…

使用AWS S3 + Lambda + MediaConvert 实现上传视频文件并自动转码

前言 最近团队在做短视频平台的技术调研&#xff0c;其中有一个环节便是音视频开发&#xff0c;即对用户上传的视频进行自适应转码。自适应的原理其实就是预先将视频转换为几个常用的分辨率&#xff0c;app端根据用户手机分辨率拉取相应分辨率的视频。 目前尝试了两种方案&…

QT之QWaitCondition降低cpu占用率,从忙等待到高效同步

在多线程编程中&#xff0c;线程间的同步是一个核心问题。在处理线程等待时&#xff0c;经常会写出高CPU占用率的代码&#xff0c;其中最典型的就是使用忙等待&#xff08;busy waiting&#xff09;。本文将详细介绍如何使用Qt框架中的QWaitCondition类来优雅地解决这一问题&am…

pcl求平面点云的边界凸包点

基本流程1&#xff0c;读入点云&#xff0c;并去除无效点2&#xff0c;拟合平面3&#xff0c;去除离平面距离较远的点4&#xff0c;对点云进行平面投影5&#xff0c;进行convex_hull运算初学者&#xff0c;暂时不知道能用来干嘛。练手还是非常不错的&#xff01;#define _CRT_S…

Windows系统上使用GIT

首先破除一下畏惧心理&#xff1a;在Windows上使用git和在linux系统中的使用方法是一样的&#xff0c;只是安装方式没那么便捷&#xff0c;毕竟linux中安装git只需要一行命令 GIT下载地址 如果你的电脑的CPU是64位的&#xff0c;就点击&#xff1a; Git-2.50.1-64-bit.exe 如果…

《设计模式之禅》笔记摘录 - 17.模板方法模式

模板方法模式的定义模板方法模式(Template Method Pattern)是如此简单&#xff0c;以致让你感觉你已经能够掌握其精髓了。其定义如下&#xff1a;Define the skeleton of an algorithm in an operation, deferring some steps to subclasses.Template Method lets subclasses r…

SpreadJS 协同服务器 MongoDB 数据库适配支持

为了支持 SpreadJS 协同编辑场景&#xff0c;协同服务器需要持久化存储文档、操作、快照及里程碑数据。本文介绍了 MongoDB 数据库适配器的实现方法&#xff0c;包括集合初始化、适配器接口实现以及里程碑存储支持。 一、MongoDB 集合初始化 协同编辑服务需要以下集合&#x…

Ubuntu 主机名:精通配置与管理

主机名&#xff08;hostname&#xff09;是Linux系统中用于标识网络上特定设备的名称&#xff0c;它在网络通信、服务配置&#xff08;如 Kubernetes 集群、数据库&#xff09;以及日志记录中扮演着至关重要的角色。对于初学者来说&#xff0c;配置主机名似乎很简单&#xff0c…

C/C++ 协程:Stackful 手动控制的工程必然性

&#x1f680; C/C 协程&#xff1a;Stackful 手动控制的工程必然性 引用&#xff1a; C/C 如何正确的切换协同程序&#xff1f;&#xff08;基于协程的并行架构&#xff09; #mermaid-svg-SXgplRf3WRYc8A7l {font-family:"trebuchet ms",verdana,arial,sans-serif;…