ngx-mqtt connect via webapp to SSL/TLS mosquitto broker

Question

I´m using a raspberry to run a broker and a java backend. Broker has its certificates and the backend already connects via ssl without any issues. Problem is, as mcollina already mentioned, if i want to connect via webapp to mosquitto broker, i can´t use either key, cert nor ca.

these are my client options:

    const MQTT_SERVICE_OPTIONS: IMqttServiceOptions = {
          hostname: environment.hostname,
          port: 8883,
          protocol: 'wss',
          clientId: this.hashId,
          username: environment.mqttUsername,
          password: environment.mqttPassword,
        }
    
    this.mqttService = new MqttService(MQTT_SERVICE_OPTIONS);

and here is the mosquitto log:

1611954829: New connection from xx.x.xxx.xxx on port 8883.
1611954829: Socket error on client <unknown>, disconnecting.

I couldn't find a working solution so far.

EDIT:

Mosquitto config:

tls_version tlsv1.2
cafile /etc/ssl/certs/my_domain_115928960DigiCertCA.crt
certfile /etc/ssl/certs/my_domain_115928960my-domain.crt
keyfile /home/pi/Desktop/server/cert/www.my-domain.key

allow_anonymous false
password_file /etc/mosquitto/passwd

port 8883
listener 8884
protocol websockets

Answer 1

Certificate configuration in mosquitto is listener dependent so you will need to list the certs twice to get this to work properly. Once for the default listener bound to the port command and again for the websocket listener.

Change you mosquitto.conf to look like this:

allow_anonymous false
password_file /etc/mosquitto/passwd

port 8883
tls_version tlsv1.2
cafile /etc/ssl/certs/my_domain_115928960DigiCertCA.crt
certfile /etc/ssl/certs/my_domain_115928960my-domain.crt
keyfile /home/pi/Desktop/server/cert/www.my-domain.key

listener 8884
protocol websockets
cafile /etc/ssl/certs/my_domain_115928960DigiCertCA.crt
certfile /etc/ssl/certs/my_domain_115928960my-domain.crt
keyfile /home/pi/Desktop/server/cert/www.my-domain.key

Answer 2

I'll take a guess here. You are using a self signed certificate with your broker.

This will lead to the problem with any Web Browser because unlike when you make a HTTPS connection to the HTTP server with the self signed certificate the browser will not pop up a warning about an untrusted certificate that the user can choose to accept.

When Secure Websocket connections are made the certificate presented by the broker must already be trusted by the browser.

You have 2 options:

1. Add the CA certificate you are using to the brokers certificate store. How you do this will be different from broker to broker (and possibly also based on what OS the browser is running on). The problem with this that you have to do it to EVERY browser that ever wants to access the site. This is is only really an option in a development environment or a corporate settings where CA certs can be pushed by a central management system.

2. Use a certificate from a existing trusted CA. eg Letsencrypt.org these are free and already trusted by all browsers.