WebSocket connection to 'ws://test.mosquitto.org/' failed: Error during WebSocket handshake: Unexpected response code: 200

[malaimoo]

When I use it on browser,

var client = mqtt.connect('mqtt://test.mosquitto.org') // you add a ws:// url here

I just can not connect the server, and got this error:

VM8520:37 WebSocket connection to 'ws://test.mosquitto.org/' failed: Error during WebSocket handshake: Unexpected response code: 200

[mcollina]

As per https://test.mosquitto.org/, mosquitto test server for websockets is on port 8080.

[MartinMuzatko]

@mcollina this is not a satisfying answer. Why is mqtt turning it into a ws:// address, when it is mqtt? Why does it matter which protocol I use, when it is always transformed?

[mcollina]

if you are using a browser, mqtt is translated to ws, because we can't open a TCP socket in the browser. Possibly a bug on my side, if you would like to change that, feel free to open a PR.

[MartinMuzatko]

Thanks for the reply!
So if my broker runs over mqtt:// I can't access it from the browser?

[mcollina]

@MartinMuzatko exactly.

[MartinMuzatko]

I'm using mqttbox (chrome extension: https://chrome.google.com/webstore/detail/mqttbox/kaajoficamnjijhkeomgfljpicifbkaf) to test my connection. Here I have configured mqtt:// and I can successfully publish and and subscribe.
I tried to debug the app to find out how they convert the mqtt protocol to ws with no success.

[MartinMuzatko]

Looks like they are sending the publish to a service worker. Do they support mqtt://?

[jdiamond]

No, service workers can't open TCP sockets. Nor can Chrome extensions to my knowledge.

The instructions for installing MQTTBox say to install an external program. I suspect the extension is communicating with that to get around the browser limitations.

If you want to use MQTT from a "normal" browser-based app, you must tunnel MQTT over WebSockets so your broker will have to support that.

[MartinMuzatko]

Ok, thank you a lot for clarifying this @jdiamond :)

My broker supports that. Hence this solution works:

import * as io from 'socket.io-client';

const client = io('http://localhost:5000');
client.on('connect', ()=>{
    client.emit('subscribe', {topic: 'OT'});
})

client.on('mqtt', (event)=>{
    // event.topic
    // event.message
})

Is there a way to workaround this problem without using socketio directly? I'd loved to use mqtt on client and serverside.
Unfortunately, using the mqttjs package on the client does not work. Or is there a special setting to "tunnel" mqtt through ws?

[jdiamond]

I use MQTT.js directly without Socket.IO in multiple apps. I don't remember having to workaround anything. My broker supports WebSockets and the URL I use in my apps start with "wss:". Everything just works.

What broker are you using? How are you building your project? Webpack or Browserify?

[dyang08]

@jdiamond Can you provide a sample of how you're subscribing using only MQTT.js? I'm having the same issue as @MartinMuzatko where MQTT.js automatically resolves mqtt://test.mosquitto.org to ws://test.mosquitto.org on a node app running on a browser.

[jdiamond]

There is no way for JavaScript running in browsers to open TCP sockets so "normal" MQTT is impossible in browser apps. To get around this limitation, MQTT.js uses MQTT over WebSockets instead when it detects it's running in a browser.

So what you're seeing is how MQTT.js is supposed to work in browser apps. If your broker doesn't support MQTT over WebSockets, you need to find another way to communicate with it.

To use test.mosquitto.org, you need to be explicit about the port since they run their WebSocket endpoints on non-standard ports. I would be explicit about the protocol, too, and use this URL: wss://test.mosquitto.org:8081

However: the WebSocket endpoints on test.mosquitto.org have been broken for a few weeks now. I tried to bring attention to it in their IRC channel. We have no ability to fix it.

Downloading and configuring mosquitto to use WebSockets and run on your local machine isn't too hard. You might want to consider doing that instead of relying on their public test broker. Even when it works, it's very slow. Not to mention insecure.

[dyang08]

Thanks for the explanation. I was going about it incorrectly and subscribing via the clients rather than the server. MQTT.js works perfectly on the server.