前端连接activemq demo

前端连接activemq demo

代码如下

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>mqtt-websocket测试</title>
    // 替换成你的本地地址或者cdn地址
    <script src='js/jquery-1.7.2.min.js'></script>
    <script src="js/mqttws31.js"></script>
</head>
<body>
<div id="messages">
    <button id="start_connect" onclick="connect_server()">连接</button>
    <button id="stop_connect" onclick="dis_connect()">断开连接</button>
    <br>
    <input type="text" id="msg_input">
    <button id="send_btn" onclick="send_msg()">发送</button>
</div>
<br>
<div id="ws_log"><p>日志</p><br></div>

<script>
    var client;
    // 订阅主题
    var topic_name = 'test_mqtt_ws';

    function connect_server() {
        // 终端ID,可以随机,可以手动设定
        // var clientID = "client-" + (Math.floor(Math.random() * 100000));
        var clientID = 'web-0001';
        // Activemq中间件地址
        //client = new Messaging.Client('192.168.23.128', 61614, clientID);
        client = new Messaging.Client('192.168.23.128', 61644, clientID);

        // 连接
        client.connect({
            // 根据需要选择
             userName: 'admin',
             password: 'admin',
            // 连接成功
            onSuccess: onConnect,
            // 连接出错
            onFailure: onFailure,
        });

        client.onConnect = onConnect;
        client.onMessageArrived = onMessageArrived;
        client.onConnectionLost = onConnectionLost;
    }

    // 显示输出内容
    function ws_logs(str) {
        $("#ws_log").append(str + "<br>");
    }

    // 建立连接
    function onConnect() {
	alert("123");
        ws_logs("正在建立连接");
        // 订阅Topic
        client.subscribe(topic_name);
    }

    // 连接失败
    function onFailure(failure) {
        ws_logs("连接失败");
        ws_logs(failure.errorMessage);
    }

    // 监听消息
    function onMessageArrived(message) {
        ws_logs(message.payloadString);
        // 如果你传输的是Json数据,在这里就可以进行解析了
        var json_obj = eval('(' + message.payloadString + ')')
        if (json_obj.cmd == '1') {
			// 执行操作
		}
    }

    // 连接中断
    function onConnectionLost() {
        if (responseObject.errorCode !== 0) {
            // client.clientId 可以获取到ClientID
            ws_logs(client.clientId + ": " + responseObject.errorCode);
        }
    }

    // 主动断开连接
    function dis_connect() {
        client.disconnect();
        ws_logs("断开连接");
        return false;
    }

    // 发送消息
    function send_msg() {
        var mqtt_msg_send = $('#msg_input').val();
        if (mqtt_msg_send) {
            message = new Messaging.Message(mqtt_msg_send);
            message.destinationName = topic_name;
            // 发送mqtt消息
            client.send(message);
            $('#msg_input').val("");
        }
        return false;
    }
</script>

</body>
</html>

★另附[完整版demo下载,可直接调试调用](https://download.csdn.net/download/qq_25073261/11945036)
发布了17 篇原创文章 · 获赞 0 · 访问量 410

猜你喜欢

转载自blog.csdn.net/qq_25073261/article/details/104054601