使用 MyQttHub 将 Reactjs 项目连接到 mqtt

Question

我需要一些帮助来将我的 react 项目连接到 myqtt hub 以发布和接收数据。 这是我正在使用的代码：

import React, { Component } from 'react';

var mqtt = require('mqtt');

var options={
    clientId:"id",
    username:"ArduinoProject",
    password:"ssssss",
    protocolId: "MQTT",
    protocolVersion: 4,
  
     port : 1883 ,
    clean:true};
    var client = mqtt.connect("mqtt://node02.myqtthub.com/",options)

client.on('connect', () => {
    alert('Connected!');
   
    console.log('Connected');
});

client.publish('testingfromnode','Dou You see mee?');

console.log(client.clientId);
console.log(JSON.stringify(client.options));


class Garage extends Component {
   
   
    render() {
        return (
            <div>
                <h1>HEllooo</h1>
            </div>
        );
    }
}

export default Garage;

出于某种原因，我有一个错误说： WebSocket connection to 'ws://node02.myqtthub.com:1883/' failed: Connection closed before收到握手响应。

我写的 HTML 出现了，但是我无法连接到 mqtt 代理。

Answer 1

我看到你已经在这里发布了这个问题，这个问题应该作为重复关闭，但我想你现在迫切需要一个答案。 你从哪里得到1883的端口值？ 我想您只是从JD Allen在评论中提供的示例中复制了它。 当然它是行不通的，它只是一个样本值。

因此，根据他们的 Node-Red 官方指南，您应该使用端口8883 。 另外，我很确定您的clientId不是id ，您应该从您的集线器获取它。

如果您仍然收到与握手相关的错误，则很可能是您的服务器和客户端上的协议版本不匹配。 查看npm package 的文档，更具体地说是有关web ZFFE33A3F6E3550541ZABA01的部分。

这应该几乎可以解决握手问题。 从那时起，您将遇到其他问题，因为您没有订阅代码中的任何主题。 再次检查mqtt的 package 文档。

这个问题也应该对您有所帮助： MQTT.js not connected from websockets 。