Mqtt.js 的WSS鏈接 · php開發筆記

### 最近在著手開發一個物聯項目，由于還在萌芽階段；不想一來就開套MVC框架也不想弄太大的代碼量。所以就選擇個H5接入測試算了，也就半天到一天的時間。主要是通過mqtt進行數據的發送而已。H5下的MQTT當然選mqttws31.min.js這個JavaScript庫。但網上的都是ws的連接，而由于我們用的mqtt是沒有ws連接只有wss，當然都疑惑ws和wss有什么不同。后臺跟百度的MQTT的工程師進行溝通才知道其實ws和wss就是類似http和https的關系，那一切都明了了。然后找mqttws31的老家，看E；俺很長時間沒看E文，看著看著發現其實mqttws也是支持WSS，只需在配置的useSSL打開就可以（國內的經驗分享都是關閉的false）。。。那就搞掂了。。 ### 好吧，咱們還是直接上代碼！ ~~~js <script> var mid="866714041240721"; $(document).ready(function(){ $("#mid").val(mid); }); var hostname = 'appylgv.iot.gz.baidubce.com', port = '443', clientId = 'MQ_WEB'+Math.floor(Math.random() * 5 + 1), timeout = 5, keepAlive = 100, cleanSession = false, ssl = true, userName = '用戶名', password = '密碼', topic = '訂閱的topic'; client = new Paho.MQTT.Client(hostname, Number(port), clientId); //建立客戶端實例 var options = { invocationContext: { host: hostname, port: port, path: client.path, clientId: clientId }, timeout: timeout, keepAliveInterval: keepAlive, cleanSession: cleanSession, useSSL: ssl,//wss傳輸 userName: userName, password: password, onSuccess: onConnect, mqttVersion: 4, onFailure: function (e) { console.log(e); s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onFailure()}"; console.log(s); } }; client.connect(options); //連接服務器并注冊連接成功處理事件 function onConnect() { console.log("onConnected"); s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onConnected()}"; console.log(s); client.subscribe(topic); } client.onConnectionLost = onConnectionLost; //注冊連接斷開處理事件 client.onMessageArrived = onMessageArrived; //注冊消息接收處理事件 function onConnectionLost(responseObject) { console.log(responseObject); s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onConnectionLost()}"; console.log(s); if (responseObject.errorCode !== 0) { alert(userName + "連接已斷開"+s); console.log("onConnectionLost:" + responseObject.errorMessage); console.log("連接已斷開"); } } function onMessageArrived(message) { s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", onMessageArrived()}"; $("#txt_log").val($("#txt_log").val()+"收到消息:" + message.payloadString+"\n"); console.log(s); console.log("收到消息:" + message.payloadString); var scrollTop = $("#txt_log")[0].scrollHeight; $("#txt_log").scrollTop(scrollTop); } function send() {//發送信息 var s = document.getElementById("msg").value; if (s) { s = "{\"Spare\":\"0\",\"IMEI\":\""+ clientId +"\",\"Timestamp\":\"" + new Date().Format("yyyy-MM-dd hh:mm:ss") + "\",\"DATA\":\"" + (s) + "\",\"API\":\"1111\"}"; message = new Paho.MQTT.Message(s); message.destinationName =topic; client.send(message); document.getElementById("msg").value = ""; } } var count = 0; function start() { window.tester = window.setInterval(function () { if (client.isConnected) { var s = "{time:" + new Date().Format("yyyy-MM-dd hh:mm:ss") + ", content:" + (count++) +", from: web console}"; message = new Paho.MQTT.Message(s); message.destinationName = topic; client.send(message); } }, 1000); } function stop() { window.clearInterval(window.tester); } Date.prototype.Format = function (fmt) { //author: meizz var o = { "M+": this.getMonth() + 1, //月份 "d+": this.getDate(), //日 "h+": this.getHours(), //小時 "m+": this.getMinutes(), //分 "s+": this.getSeconds(), //秒 "q+": Math.floor((this.getMonth() + 3) / 3), //季度 "S": this.getMilliseconds() //毫秒 }; if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length)); for (var k in o) if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[ k]) : (("00" + o[k]).substr(("" + o[k]).length))); return fmt; } </script> ~~~ 復制不過目前感覺用MQTT.JS來聯不是太安全，因為用戶名和密碼都外露還沒加密，一個打開就知道了，但是勝在簡單。不過真是環境下就想辦法加密~還有這個JavaScript還可以用在[微信小程序](https://cloud.tencent.com/product/tcb?from=10680)中，不過目前就不深究了，如果再配合[小程序](https://cloud.tencent.com/product/tcb?from=10680)云開，那真是不得了。。。好吧暫時就這樣吧 \-完-