Blazor WebAssembly MQTT over websockets not working

Question

I'm trying to implement an mqtt over websocket client subscriber in Blazor using Paho. The problem is it insists on using wss instead of ws and throws an ERR_SSL_PROTOCOL_ERROR error upon connection.

Here's a simplified code block:

var mqtt;
var host = "api.mydomainexample.com";
var port = 1884;
function onConnect(){
   console.log("connected ! Now listening for messages ..");
   mqtt.subscribe("someTopic");
}

function onFailure(message){
   console.log("connection to host failed: " + message);
}

function onMessageArrived(msg){
   var message = "Message received on topic '"+ msg.destinationName +"': "+ msg.payloadString;
   console.log(message);
}

function mqttConnect() {
   console.log("connecting to " + host + " ..");
   mqtt = new Paho.MQTT.Client(host, port, clientid);
   var options = {
       timeout: 3,
       onSuccess: onConnect,
       onFailure: onFailure,
       useSSL: false
   };
   mqtt.onMessageArrived = onMessageArrived;
   mqtt.connect(options);
}

I copied this code into an html page created in notepad, called the function from the html body and ran the file in browser. It worked and subscribed well. Also I added useSSL: false in the connection options although I didnt have it before but still didnt work.

here's the error I'm having from console:

WebSocket connection to 'wss://api.mydomainexample:1884/mqtt' failed: Error in connection establishment: net::ERR_SSL_PROTOCOL_ERROR

I also changed my projects launch settings so that it launches as http and not https because based on this answer, I cannot use a ws from a page loaded through https.

Any ideas ? Can't I just connect to a websocket without certificate in blazor?

If you load the page over https then you MUST use wss for Websockets. The browser will not let you use lower security protocols if you load the page securely — hardillb, Jul 28 '22 at 10:02
exactly, that's why I loaded it in http but it's still using wss. — NadaNK, Jul 28 '22 at 10:24

score 0 · Answer 1 · answered Jul 29 '22 at 07:30

0

Ok it turns out that when creating the blazor application, there is an option to 'configure on https' where this option causes requests redirection from http to https and consequently asks for secure wss instead of ws.

Hope this helps someone!

answered Jul 29 '22 at 07:30

NadaNK

782
2
10
26

Blazor WebAssembly MQTT over websockets not working

1 Answers1