102 lines
3.4 KiB
HTML
102 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
|
|
|
|
<head>
|
|
<!--script type="text/javascript" src="paho.javascript-1.0.0/mqttws31.js"></script-->
|
|
<script type="application/javascript" src="http://git.eclipse.org/c/paho/org.eclipse.paho.mqtt.javascript.git/plain/src/mqttws31.js"></script>
|
|
<!--script type="text/javascript" src="file:///home/andrea/workspace/moquette_github/mqttws31.js"></script-->
|
|
|
|
<script type="text/javascript">
|
|
|
|
// Create a client instance
|
|
var client;
|
|
function doConnect() {
|
|
console.log("connect invoked");
|
|
client = new Paho.MQTT.Client("127.0.0.1", Number(8080), "", "clientId");
|
|
//client = new Paho.MQTT.Client("test.mosquitto.org", Number(8080), "", "clientId");
|
|
//client = new Paho.MQTT.Client("ws://whistler1.hursley.ibm.com", Number(1883), "ClientId");
|
|
|
|
client.startTrace();
|
|
// set callback handlers
|
|
client.onConnectionLost = onConnectionLost;
|
|
client.onMessageArrived = onMessageArrived;
|
|
|
|
// connect the client
|
|
client.connect({onSuccess:onConnect});
|
|
console.log("connect finished");
|
|
}
|
|
|
|
|
|
// called when the client connects
|
|
function onConnect() {
|
|
// Once a connection has been made, make a subscription and send a message.
|
|
console.log("onConnect");
|
|
client.subscribe("/World");
|
|
message = new Paho.MQTT.Message("Hello");
|
|
message.destinationName = "/World";
|
|
client.send(message);
|
|
}
|
|
|
|
// called when the client loses its connection
|
|
function onConnectionLost(responseObject) {
|
|
if (responseObject.errorCode !== 0) {
|
|
console.log("onConnectionLost:"+responseObject.errorMessage);
|
|
}
|
|
}
|
|
|
|
// called when a message arrives
|
|
function onMessageArrived(message) {
|
|
console.log("onMessageArrived:"+message.payloadString);
|
|
}
|
|
|
|
function doSubscribe() {
|
|
client.subscribe("/World");
|
|
}
|
|
|
|
function doDisconnect() {
|
|
client.disconnect();
|
|
}
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<h1>Example Web Messaging web page.</h1>
|
|
<form id="example">
|
|
<fieldset>
|
|
<legend id="Connect" > Connect </legend>
|
|
Make a connection to the server, and set up a call back used if a
|
|
message arrives for this client.
|
|
<br>
|
|
<input type="button" value="Connect" onClick="doConnect(this.form)" name="Connect"/>
|
|
<input type="checkbox" name="connected" disabled="disabled"/>
|
|
</fieldset>
|
|
|
|
<fieldset>
|
|
<legend id="Subscribe" > Subscribe </legend>
|
|
Make a subscription to topic "/World".
|
|
<br> <input type="button" value="Subscribe" onClick="doSubscribe(this.form)"/>
|
|
</fieldset>
|
|
|
|
<fieldset>
|
|
<legend id="Send" > Send </legend>
|
|
Create a Message object containing the word "Hello" and then publish it at
|
|
the server.
|
|
<br>
|
|
<input type="button" value="Send" onClick="doSend(this.form)"/>
|
|
</fieldset>
|
|
|
|
<fieldset>
|
|
<legend id="Receive" > Receive </legend>
|
|
A copy of the published Message is received in the callback we created earlier.
|
|
<textarea name="receiveMsg" rows="1" cols="40" disabled="disabled"></textarea>
|
|
</fieldset>
|
|
|
|
<fieldset>
|
|
<legend id="Disconnect" > Disconnect </legend>
|
|
Now disconnect this client from the server.
|
|
<br> <input type="button" value="Disconnect" onClick="doDisconnect()"/>
|
|
</fieldset>
|
|
</form>
|
|
</body>
|
|
</html>
|