微信小程序使用mqtt开发可以,真机不行

本文详细介绍了如何通过下载mqtt.js库、配置MQTT连接、处理错误与订阅、以及设置Nginx以支持小程序的SSL连接,确保设备成功连接至服务器。

以下可以解决我的问题,请一步一步跟着做,有可能版本不一样就失败了

一、下载mqtt.js

前往蓝奏云 https://wwue.lanzouo.com/iQPdc1k50hpe
在这里插入图片描述
下载好后将.txt改为.js
然后放入项目里
在这里插入图片描述

二、连接mqtt

const mqtt = require('../../utils/mqtt.min');
let client;
// 连接选项
const options = {
  connectTimeout: 30000, // 默认 30 * 1000毫秒,收到 CONNACK 之前等待的时间,即连接超时时间。
  clientId: 'mqttjs_' + Math.random().toString(16).substring(2, 8), // 客户端 ID
  username: 'l', // 连接用户名
  password: 'h0', // 连接密码
  clean: true, // 设置为 false 以在离线时接收 QoS 1 和 2 消息
};
client = mqtt.connect(`wxs://l.com/appletMqtt`, options);
// 链接异常处理
client.on('error', (error) => {
  console.log('连接失败:', error);
});
// 订阅
client.subscribe(
  '/szdx/#',
  {
    qos: 1,
  },
  (error) => {
    if (!error) {
      console.log('订阅成功/szdx/device/in/#');
    } else {
      console.log('订阅失败/szdx/device/in/#');
    }
  }
);
// 接收消息处理
client.on('message', (e, a) => {
  if (e.search('/szdx') > -1) {
    let c = JSON.parse(String(a));
  }
});

三、nginx配置(因为小程序的bug)

emqx官网
需要有ssl证书

server {
    listen  443 ssl;        
    server_name xxx.emqx.io; 
    ssl_certificate   cert/***.pem;
    ssl_certificate_key  cert/***.key;
    ssl_session_timeout  5m;      
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
    ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
    ssl_prefer_server_ciphers on;

    # 添加反向代理
    location /appletMqtt {
      proxy_pass http://127.0.0.1:8083/mqtt;
      proxy_set_header Host $host;
      proxy_set_header Sec-WebSocket-Protocol mqtt;
      proxy_set_header X-Real-IP $remote_addr;
      proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
      # client_max_body_size 35m;
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "upgrade";    
    }
}

四、最后就可以连上了(别问为什么,有用就行,哈哈)

注意,每一步都是有用的哦,如果你的不行,那么就原样复制一下

### 微信小程序中实现与MQTT服务器的连接并进行真机调试 为了在微信小程序中成功建立与MQTT服务器的连接,并确保能够在真实设备上顺利调试,需遵循特定的方法和注意事项。 #### 安装依赖库 推荐使用 `MQTT.js` 库版本 v4.2.1 来构建适用于原生微信小程序的应用程序[^1]。此版本经过优化,在大多数情况下能提供更稳定的性能表现。可以通过 npm 或者直接下载的方式引入该库到项目当中。 #### 配置连接参数 在小程序配置文件(例如 app.json 或页面级别的 json 文件)内指定必要的 MQTT 连接属性,比如服务器地址、端口编号以及认证凭证等信息[^2]: ```json { "mqtt": { "server": "wss://your-mqtt-broker-url", "port": 8083, "username": "your_username", "password": "your_password" } } ``` #### 创建 MQTT 连接实例 利用上述配置的数据初始化一个新的客户端对象,并订阅感兴趣的主题以便接收消息推送。下面给出了一段 JavaScript 示例代码用于展示如何完成这项工作: ```javascript const mqtt = require('mqtt'); // 获取全局应用实例 const app = getApp(); Page({ data: {}, onLoad() { const options = { clientId: 'wx_app_' + Math.random().toString(16).substr(2, 8), username: app.globalData.mqtt.username, password: app.globalData.mqtt.password }; this.client = mqtt.connect(app.globalData.mqtt.server + ':' + app.globalData.mqtt.port, options); this.client.on('connect', () => { console.log('Connected to MQTT broker'); // 订阅主题 this.client.subscribe('/topic/test'); }); this.client.on('message', (topic, message) => { console.log(`Received Message on ${topic}:`, message.toString()); }); this.client.on('error', error => { console.error(error); }); }, onUnload() { if(this.client){ this.client.end(); } } }); ``` 当遇到仅能在开发者工具里正常运作而实际手机却无法连通的情况时,可能是因为所使用的 `MQTT.js` 版本存在问题;此时不妨考虑更换其他稳定版次来解决问题。
评论 3
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

xl__qd

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值