Connecting Reactjs to Myqtthub

Question

Hello I'm new to all this IOT thing and I want to be able to send and receive data from an Arduino via mqtt using https://myqtthub.com as our broker. I used the following code in order to connect:

import React, { Component } from 'react';

var mqtt = require('mqtt');

var options={
    clientId:"mqttjs01",
    username:"user",
    password:"password",
    clean:true};
    var client = mqtt.connect("mqtt://node02.myqtthub.com",options)

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




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

export default Garage;

I'm having the error: "WebSocket connection to 'ws://node02.myqtthub.com/' failed: Error during WebSocket handshake: Unexpected response code: 301"

Any help will be appreciated.

Answer 1

Assuming this is all running in the browser (mainly because MQTT.js is forcing the connection to be over ws:// as that is the ONLY option in the browser).

Looking at the docs for myqtthub, they do NOT claim any support for MQTT over Websockets (and the support forum says they don't support it yet). This means your application will NOT work with this broker provider until they add Websockets support..