MQTT.js 无法建立本地代理连接

Question

我在一个 React Native 移动应用上工作。我使用MQTT.js 与经纪人建立连接。作为第一个测试，我与Mosquitto public broker 建立了联系。我设法只连接了 WebSockets 端口（8080 和 8081）。不幸的是，与我的 localhost Mosquitto 代理的连接失败且没有错误。

首先，我在我的 Linux 计算机上安装了 Mosquitto 和 Node-RED。我分别从$ mosquitto -v 和$ node-red 开始。在 Node-RED 上，我创建了我的第一个流：inject node 连接到 mqtt publisher，mqtt subscriber 连接到 debug node。 mqtt 发布者和订阅者在同一个主题上，并成功连接到我的 Mosquitto localhost 代理。我部署了：它有效。

如果我尝试连接我的 React 应用：

let mqtt = require('mqtt')
let client = mqtt.connect('mqtt://localhost:1883')
console.log('client', client)

client.on('connect', function () {
    console.log('connected')
})

client.on('error', function (error) {
    console.log('error', error)
})

它运行但我的 Mosquitto 代理没有收到任何新连接。 console.log('client', client) 回复这个：

'client', 
 { options: 
   { protocol: 'ws',
     slashes: true,
     auth: null,
     host: 'localhost:1883',
     port: 1883,
     ...
   }
}

protocol: 'ws' 代表 WebSockets，但我的 Mosquitto 代理是基于 IP 协议的，所以我在 /etc/mosquitto/conf.d 文件夹中创建了一个 protocol.conf 并写入 protocol websockets 行。然后当我重新启动 Mosquitto $ mosquitto -v -c /etc/mosquitto/conf.d/protocol.conf 它显示：

mosquitto version 1.6.4 starting
Config loaded from /etc/mosquitto/conf.d/protocol.conf.
Opening websockets listen socket on port 1883.

我重新编译了我的 React 应用程序：不起作用。

除非console.log('client', client)我的日志是空的，否则任何错误。

我预计至少会出现连接错误，但即使是 Mosquitto 代理也不会收到连接尝试。

Answer 1

localhost 表示自身 - 执行引用 localhost 的代码的计算机。在 React 应用程序中，这将是运行加载 React 应用程序的网络浏览器的计算机，我敢打赌，它不是运行 Mosquitto 代理的计算机。

您需要找出运行代理的计算机的 IP 地址并使用它而不是 localhost。那不会是127.0.0.1，它是localhost 的IP 地址，意味着同样的事情并且会有同样的问题。它可能看起来像 10.0.x.x 或 192.168.x.x。

您也不应该将端口 1883 用于基于 Web 套接字的 MQTT。它可以工作，但 1883 是默认的 MQTT over TCP 端口。如果您没有更改 Mosquitto 的默认配置，它将已经在端口 1883 上进行侦听。端口 8883 通常用于 Web 套接字上的 MQTT - 确切的端口号与确保它没有被使用无关紧要。它现在可能正在工作，因为您只添加了 protocol websockets 行。如果您永远不会将代理用于 websockets 以外的任何东西，那么您可以放心地忽略这部分，但如果您想要使用 MQTT over TCP 连接到它，那么端口 1883 上的 websockets 将很快变得混乱。

编辑 @hardlib 有一个很好的建议，指出如果网页由运行 MQTT 代理的同一台计算机提供服务，您可以调用 location.host 来获取服务器/代理的名称或 IP 地址。