MQTT js 库,无法在 Google Chrome 中通过 websocket 连接到代理,但在 FireFox 中运行良好

问题描述 投票:0回答:1

我遇到了一个问题,我尝试寻找解决方案,但没有任何效果。我正在使用 MQTT.js 库来连接代理服务器。我的代码如下。 (视频:https://youtu.be/5e9lRZM4o8I

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script
      src="https://cdnjs.cloudflare.com/ajax/libs/mqtt/4.3.7/mqtt.min.js"
      integrity="sha512-tc5xpAPaQDl/Uxd7ZVbV66v94Lys0IefMJSdlABPuzyCv0IXmr9TkqEQvZiWKRoXMSlP5YPRwpq2a+v5q2uzMg=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"></script>

    <script>
      try {
        const client = mqtt.connect('ws://test.mosquitto.org:8080/mqtt');

        client.on('connect', () => {
          console.log('Connected');
        });
      } catch (e) {
        console.log(e);
      }
    </script>
  </body>
</html>

一切都很简单。但是当我尝试使用谷歌浏览器访问我的网站时,我收到了错误。

当我在点火模式下使用 FireFox 或 chrome 时,一切正常

每个使用过这个库或知道一些解决方案的人都可以帮助我吗?非常感谢。

javascript reactjs websocket mqtt
1个回答
0
投票

我在 React 项目中使用 mqtt 醒来。您的代码看起来不错,但是一个区别是您用于连接的网址,请尝试这个:

mqtt://test.mosquitto.org:8081

这是 React 中的一个工作示例:

const url = "mqtt://test.mosquitto.org:8081";
const [client, setClient] = useState(null);

const mqttConnect = () => {
    const client = mqtt.connect(url);
    setClient(client);
  };


useEffect(() => {
    mqttConnect();
}, []);


 useEffect(() => {
    if (client) {
      client.on("connect", () => {
        console.log("connected");

      client.on("error", (err) => {
        console.error("Connection error: ", err);
        client.end();
      });

      client.on("reconnect", () => {
        console.log("Reconnecting");
      });
    }
  }, [client]);
© www.soinside.com 2019 - 2024. All rights reserved.