Question 184456 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – MQTT.js wss connection failed in browser

I am coding a browser app by using the react framework. In this app mqtt topics are subscribed. I am using the MQTT.js package. If I am running the app in the browser (Edge and Firefox tested) by using an https connection I am forced to using secure websocket (wss) connections. If I am forcing the browser to use an http connection the websocket connection (ws) works fine. But with wss the connection fails:

WebSocket connection to 'wss://serveradress.tld:8084/mqtt' failed

The wss connection to the broker works also fine from a standalone MQTT client (MQTTX). But it does not work from an webclient like hivemq or mqttx web either.

Here my code for connecting the mqtt broker:

var mqtt = require('mqtt/dist/mqtt');
var mqttOptions = {
  protocol:  'wss',
  keepalive: 20,
  clientId: "mqttjs_" + Math.random().toString(16).substr(2, 8),
  path: "/mqtt/,
  rejectUnauthorized: false
};
const mqttUrl = "wss://serveradress.tld:8084";

var mqttClient = mqtt.connect(mqttUrl, mqttOptions);

I do not need to verify the certificates because I am running the connection in a closed network. I am thinking, that the option "rejectUnauthorized: false" accepts this?

Any recommendations how I can debug this?
Thank in advance!

nico

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Finally it was a fault in the broker configuration. The broker (EMQX) was not using the correct certificates because the listener was only defined for the SSL connection on port 8883. After defining the path to the certificates for the WSS listener, the connection was successfully established.


  2. 0

    When running in the browser, the JavaScript code has no control over the TLS/SSL handling, all that is done by the browser.

    The browser will also not present a screen asking you to accept an invalid certificate as it does when accessing a HTTPS page.

    You ONLY option (other than using a cert issued by "real" CA) is to add either the broker certificate or it’s CA certificate to the certificate store of EVERY browser that wants to use the broker. This is so the browser knows to trust this.

    How you add certificates/CA certificates to browsers is slightly different for every browser, but usually found under "Security" in the Settings.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search