八、网页版消息推送SDK-WebSockets
介绍
由于项目组需求、最近在研究消息推送服务平台、结合业务和使用场景分析最终选择的是 Mosquitto 消息服务器、 Mosquitto 服务器的安装、配置、集群搭建 我就不在这多说了、有兴趣的可以看我对 Mosquitto 学习记录的前七篇文章。 今天在这主要介绍网页版 WebSockets 实现消息的推送。
1: 本 SDK 的开发 是基于 eclipse.paha.javaScript 包来实现的。
2: 引入开发需要的JavaScript
<script src="https://cdnjs.cloudflare.com/ajax/libs/paho-mqtt/1.0.1/mqttws31.js" type="text/javascript"></script>
注: 此文件可以到官网下载、 地址:https://raw.githubusercontent.com/eclipse/paho.mqtt.javascript/master/src/mqttws31.js
3: 封装实现 js - sdk
var websocket = function(config) { this.host = config.host;// ip this.port = config.port;// 端口 this.useTLS = config.useTLS; // 是否启用TLS 安全连接 this.topic = config.topic;// 订阅Topic this.userName = config.userName; // 连接用户名 this.password = config.password; // 密码 this.cleansession = config.cleansession; //false : 表示每次相同的身份登陆: true : 表示每次以新身份登陆 this.reconnectTimeout = 5000; // 重试超时时间 this.clientId = config.clientId; // 客户端名称 var mqttClient; this.connect = function MQTTconnect() { mqttClient = new Paho.MQTT.Client(this.host, this.port, clientId); var options = { timeout : 10, useSSL : this.useTLS, cleanSession : this.cleansession, onSuccess : onConnect, onFailure : function(message) { faildMssge(message.errorMessage, "Retrying", fialdMessageCallback) setTimeout(MQTTconnect, this.reconnectTimeout); } }; mqttClient.onConnectionLost = onConnectionLost; mqttClient.onMessageArrived = onMessageArrived; if (this.userName != null) { options.userName = this.userName; options.password = this.password; } console.log("Host=" + host + ", port=" + port + " TLS = " + useTLS + " username=" + userName + " password=" + password); mqttClient.connect(options); } function onConnect() { mqttClient.subscribe(topic, { qos : 0 }); } function onConnectionLost(response) { setTimeout(MQTTconnect, this.reconnectTimeout); faildMssge("connection lost: " + responseObject.errorMessage, ". Reconnecting", fialdMessageCallback) } ; function onMessageArrived(message) { var topic = message.destinationName; var payload = message.payloadString; callback(topic, payload, messageCallback); } ; function callback(topic, payload, messageCallback) { messageCallback(topic, payload); } function faildMssge(errorMessage, type, fialdMessageCallback) { fialdMessageCallback(errorMessage, type); } this.sendMessage = function sendMessage(topic, message) { var message = new Paho.MQTT.Message(message); message.destinationName = topic; message.qos = 0; mqttClient.send(message); } }
4: 使用说明
// Create a config config = { host : '172.16.192.103', port : 9001, topic : '#', useTLS : false, userName : null, password : null, cleansession : true, clientId : 'clientId' } //Create a client instance var client = new websocket(config); // connect the client client.connect(); //send message client.sendMessage(topic, message); // subscribe topic message callback function function messageCallback(topic, payload) { // 业务逻辑处理 } //error message callback function function fialdMessageCallback(errorMessage, type) { //业务逻辑处理 }
到这网页版消息推送基本功能已经实现: 如想要完整的 web 应用实例请到如下地址下载:https://github.com/yuelicn/mqtt-client.git
本人 JavaScript 水平有限、如有不妥的地方欢迎指正 谢谢!