mqtt前端配置

最新推荐文章于 2026-06-18 15:17:38 发布

原创最新推荐文章于 2026-06-18 15:17:38 发布 · 316 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

GEO检测

标签

#前端

    initMqtt() {
      // mqtt配置
      let options = {
        connectTimeout: 4000, // 超时时间
        clean: true, // 保留会话
        reconnectPeriod: 4000, // 重连时间间隔
        clientId: "mqttjs_" + (Math.random() * 10000000).toString(),
        // 如果服务器使用非默认端口，请确保这里的端口与服务器配置匹配
        port: 5092, // 默认注释掉，除非您知道服务器使用的是这个端口
        host: "13.0.18.23", // 后端地址
        username: "Android5043879312294918", // id
        password:
 "eyJhbGciOiJIUzI1NiJ9.eyJ3NX0.hd-DD1_wCyQVcLTP_R4PqMYygWlebHjFQNTnSjeUuoo", // 密码
      };
      if (this.client) {
        this.client.end();
      }
      this.client = mqtt.connect(`ws://13.0.18.23/mqtt`, options); 
      // 确保服务器支持 WebSockets
      this.client
        .on("connect", (res) => {
          this.client.subscribe("alarm", (err) => {
            if (!err) {
              console.log("订阅成功");
            }
          });
        })
        .on("message", (topic, message) => {
          console.log(JSON.parse(message.toString())); // 确保将 Buffer 转换为字符串
          const data = JSON.parse(message.toString());

          if (this.types === "water") {
            this.handleWaterLevelAlarm(data);
          }
          // this.weather = JSON.parse(message.toString());
          // 接收服务端信息
        })
        .on("reconnect", () => {
          console.log("重连中...");
          // MQTT.js 会自动处理重连，这里的代码是可选的
        })
        .on("error", (error) => {
          console.error("MQTT 客户端错误:", error);
          // 在这里可以添加更复杂的错误处理逻辑，例如重试策略或通知用户
        });
    },