B4J Question Connect client browser to jMqtt broker

Angel Garcia

Member
Licensed User
Hello all,
I have a jMqtt broker running on a server. Several tablets with a b4a App connect to this broker and publish and subscribe messages correctly.
I want to go a step forward and also provide a web page that could connect to this broker and receive messages from the tablets, for this purpose i'm working on a Blazor Webassembly solution, i have added the Mqtt.Net library. But i have found that, the client connects successfully only from the server side with tcp connection, but can't make messages to trigger and pass messages to the client/frontend side. On another approach i found that browsers/client side only can connect to mqttbroker with websockets, i tested the connection with websocket with a third-party cloudmqtt and it works correctly.
Maybe its important to mention that the web page would be hosted at the same place/server where mqttbroker is running.
In this old thread: https://www.b4x.com/android/forum/threads/mqttbroker.61548/page-2#post-430232 , Erel mentioned that the broker can also work with websockets, so the question is how to connect from a web page to the mqttbroker with websocket?.
I have tried so far many combinations with no luck, with tcp, no tcp, with tls, with no tls.:
C#:
MqttClientOptions mqttClientOptions;
            string wss = mqttWebSocket + ":" + mqttPort;
            
            if (conTCP == true)
            {
                if (conTls == true)
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithTcpServer(mqttWebSocket, Convert.ToInt32(mqttPort)).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true).WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).WithTls().Build();
                }
                else
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithTcpServer(mqttWebSocket, Convert.ToInt32(mqttPort)).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true).WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).Build();
                }
            }
            else
            {
                if (conTls == true)
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithWebSocketServer(wss).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true).WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).WithTls().Build();
                }
                else
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithWebSocketServer(wss).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true).WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).Build();
                }
            }

            MqttServicio.Init(clientid, mqttClientOptions);
            MqttServicio.MessageReceived += MqttClient_MessageReceived;
            MqttServicio.Connected += MqttClient_Connected;
            MqttServicio.Disconnected += MqttClient_Disconnected;

            var result = await MqttServicio.Connect();

MqttWebsocket is my server url and port the one mqtt is running 51041.
And in the debug logs when running the b4jbroker:
B4X:
Configuring message interceptors...
Initializing broker interceptor. InterceptorIds=[]
Using default SSL context creator
Invoking constructor with io.moquette.broker.config.IConfig argument. ClassName=anywheresoftware.b4j.objects.MqttBroker$B4XAuthenticator, interfaceName=io.moquette.broker.security.IAuthenticator
Authorizator policy io.moquette.broker.security.PermitAllAuthorizatorPolicy instance will be used
Initializing CTrie
Initializing subscriptions store...
Netty is using NIO
Server bound to host=0.0.0.0, port=51044, protocol=TCP MQTT
Property websocket_port has been setted to disabled. Websocket MQTT will be disabled
Moquette integration has been started successfully in 1182 ms

So it looks like the websocket port is disabled, there is a way to enable it?
Maybe someone knows a workaround to accomplish this ??.

Any help would be highly appreciated, or put me in the right direction.

Many thanks all in advance!
Ángel
 

ivanomonti

Expert
Licensed User
Longtime User
Hello all,
I have a jMqtt broker running on a server. Several tablets with a b4a App connect to this broker and publish and subscribe messages correctly.
I want to go a step forward and also provide a web page that could connect to this broker and receive messages from the tablets, for this purpose i'm working on a Blazor Webassembly solution, i have added the Mqtt.Net library. But i have found that, the client connects successfully only from the server side with tcp connection, but can't make messages to trigger and pass messages to the client/frontend side. On another approach i found that browsers/client side only can connect to mqttbroker with websockets, i tested the connection with websocket with a third-party cloudmqtt and it works correctly.
Maybe its important to mention that the web page would be hosted at the same place/server where mqttbroker is running.
In this old thread: https://www.b4x.com/android/forum/threads/mqttbroker.61548/page-2#post-430232 , Erel mentioned that the broker can also work with websockets, so the question is how to connect from a web page to the mqttbroker with websocket?.
I have tried so far many combinations with no luck, with tcp, no tcp, with tls, with no tls.:
C#:
MqttClientOptions mqttClientOptions;
            string wss = mqttWebSocket + ":" + mqttPort;
           
            if (conTCP == true)
            {
                if (conTls == true)
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithTcpServer(mqttWebSocket, Convert.ToInt32(mqttPort)).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true).WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).WithTls().Build();
                }
                else
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithTcpServer(mqttWebSocket, Convert.ToInt32(mqttPort)).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true).WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).Build();
                }
            }
            else
            {
                if (conTls == true)
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithWebSocketServer(wss).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true) .WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).WithTls().Build();
                }
                altro
                {
                    mqttClientOptions = new MqttClientOptionsBuilder().WithWebSocketServer(wss).WithCleanSession(true).WithCredentials(mqttUser, mqttPass).WithClientId(clientid).WithWillTopic("conexion/" + clientid).WithWillPayload("Offline").WithWillRetain(true) .WithWillQualityOfServiceLevel(MQTTnet.Protocol.MqttQualityOfServiceLevel.AtMostOnce).Build();
                }
            }

            MqttServicio.Init(clientid, mqttClientOptions);
            MqttServicio.MessageReceived += MqttClient_MessageReceived;
            MqttServicio.Connected += MqttClient_Connected;
            MqttServicio.Disconnected += MqttClient_Disconnected;

            var risultato = attendi MqttServicio.Connect();
[/CODICE]

MqttWebsocket è l'URL del mio server e la porta su cui è in esecuzione mqtt 51041.
E nei log di debug durante l'esecuzione di b4jbroker:
[CODE=b4x]Configurazione degli intercettatori di messaggi...
Inizializzazione dell'intercettore del broker in corso. InterceptorIds=[]
Utilizzo del creatore di contesto SSL predefinito
Richiamo del costruttore con l'argomento io.moquette.broker.config.IConfig. ClassName=anywheresoftware.b4j.objects.MqttBroker$B4XAuthenticator, interfaceName=io.moquette.broker.security.IAuthenticator
Verrà utilizzata l'istanza io.moquette.broker.security.PermitAllAuthorizatorPolicy del criterio di autorizzazione
Inizializzazione CTrie
Inizializzazione archivio abbonamenti...
Netty sta usando NIO
Server associato a host=0.0.0.0, porta=51044, protocollo=TCP MQTT
La proprietà websocket_port è stata impostata su disabilitata. Websocket MQTT sarà disabilitato
L'integrazione di Moquette è stata avviata correttamente in 1182 ms

Quindi sembra che la porta websocket sia disabilitata, c'è un modo per abilitarla?
Forse qualcuno conosce una soluzione alternativa per ottenere questo risultato ??.

Qualsiasi aiuto sarebbe molto apprezzato o mi metterebbe nella giusta direzione.

Molte grazie a tutti in anticipo!
Angelo
ionteressante, stavo cercando di capire MQTT mi farebbe piacere fare uno scambio di conoscenza se magari dai degli esempi funzionali sarebbe per me eccellente.
 
Upvote 0

Similar Threads

  • Locked
  • Article
Android Tutorial [B4X] MQTT Chat Room
Replies
60
Views
57K
  • Locked
  • Article
B4J Library MqttBroker
Replies
51
Views
38K
  • Locked
  • Article
B4J Tutorial [IoT] MQTT Protocol
Replies
33
Views
47K
Top