Here is a small chat program that can be used for building a rich chat application, or if you just want a very simple chat program for your friends. It contains sending and receiving STOMP messages from an Apache ActiveMQ topic.
Prerequisites:
* Apace ActiveMQ server which can be found here: https://activemq.apache.org/components/classic/download/ Usually no configuration needed. Just start the server (./activemq start) and everything should work ok
* Stomp.js. A helper script for handling the WebSocket communication between ActiveMQ and your javascript application. This script can be found here, courtesy of Jeff Mesnil and Mark Broadbent: https://github.com/jmesnil/stomp-websocket/tree/master/lib
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>A simple ActiveMQ chat application</title>
<script src="stomp.js"></script>
<script src="index.js"></script>
</head>
<body>
<textarea id="chat" rows="10" cols="35"></textarea>
<br />
<input id="message" size="40" type="text">
<br />
<button id="send" type="button" onclick="send()">Send</button>
</body>
</html>
Javascript:
// Setup websocket connection
const client = Stomp.client("ws://localhost:61614/stomp", "v11.stomp");
// Setup header options
const headers = {id: 'JUST.FCX', ack: 'client'};
// Connect to ActiveMQ (via websocket)
client.connect("admin", "admin", function () {
// Setup subscription of topic (/topic/chat)
client.subscribe("/topic/chat",
function (message) {
const msg = message.body;
// Add message to textarea
document.getElementById("chat").value += msg + "\n";
// Acknowledge the message
message.ack();
}, headers);
});
function send() {
const message = document.getElementById("message");
// Send message to topic (/topic/chat)
client.send("/topic/chat", {}, message.value);
// Reset input field
message.value = "";
}
Tested on OSX 10.15.7 and Apache ActiveMQ v5.16.3
Comments are closed.