Software Archive
Read-only legacy content

MQTT in my HTML5 app

Jonas_P_
Beginner
898 Views

How can I connect to my MQTT server in my HTML5 app.

src="js/mqttws31.js" type="text/javascript">
src="js/host.js" type="text/javascript">                                                                        
var mqtt;
var reconnectTimeout = 2000;
function MQTTconnect() {
mqtt = new Paho.MQTT.Client(
                            host,
                            port,
                            "web_" + parseInt(Math.random() * 100,
                            10));
var options = {
     timeout: 3,
     useSSL: useTLS,
     cleanSession: cleansession,
     onSuccess: onConnect,
     onFailure: function (message) {
       $('#status').val("Connection failed: " + message.errorMessage + "Retrying");
       setTimeout(MQTTconnect, reconnectTimeout);
     }
};
mqtt.onConnectionLost = onConnectionLost;
mqtt.onMessageArrived = onMessageArrived;
if (username != null) {
    options.userName = username;
    options.password = password;
}
console.log("Host="+ host + ", port=" + port + " TLS = " + useTLS + " username=" + username + " password=" + password);
mqtt.connect(options);
}
function onConnect() {
    $('#status').val('Connected to ' + host + ':' + port);
    // Connection succeeded; subscribe to our topic
    mqtt.subscribe(topic, {qos: 0});
    $('#topic').val(topic);
    mqtt.publish("/arduino/commando/", "test Intel");
}
function onConnectionLost(response) {
    setTimeout(MQTTconnect, reconnectTimeout);
    $('#status').val("connection lost: " + responseObject.errorMessage + ". Reconnecting");
};
function onMessageArrived(message) {
    var topic = message.destinationName;
    var payload = message.payloadString;
    $('#ws').prepend('<li>' + topic + ' = ' + payload + '</li>');
};
$(document).ready(function() {
MQTTconnect();
});
<header>
<h2>MQTT Test</h2>
</header>
<div>
Subscribed to <input type='text' id='topic' disabled />
Status: <input type='text' id='status' size="80" disabled />
<ul id='ws' style="font-family: 'Courier New', Courier, monospace;"></ul>
</div>

In the host file:

host = 'm20.cloudmqtt.com'; // hostname or IP address
port = 13365;
topic = '/arduino/status/';     // topic to subscribe to
useTLS = false;
username = "test";
password = "test";
cleansession = true;

Nothing is happing on my app when I run it on my Iphone or Windows 8.
I also tried to adapt the host to my local IP-address and run the HiveMQ or Mosca server.
I can't get my app working, but with a MQTT client (MQTT.fx) everything is working.

0 Kudos
2 Replies
PaulF_IntelCorp
Employee
898 Views

Sorry, but none of us are familiar with MQTT, so we are not aware of what the requirements are to make that protocol work.

0 Kudos
Alexandre_B_1
Beginner
898 Views

Hello Jonas.

I´m trying to implement an app with MQTT protocol to communicate with myRio hardware.

 

Does your implementation worked?

 

Have you seen this plugin?

http://phonegap-plugins.com/plugins/arcoirislabs/mqtt-cordova

 

0 Kudos
Reply