参考此库官方说明：https://github.com/mqttjs/MQTT.js#browserify
npm install -g webpack // install webpack
cd node_modules/mqtt
npm install . // install dev dependencies
webpack mqtt.js ./my_mqtt.js --output-library-target commonjs2
第二步：
将生成的my_mqtt.js文件里所有的：
(function() { return this}())
替换为：
window
第三步：
在my_mqtt.js文件顶部加上代码：
var setImmediate = setTimeout
var clearImmediate = clearTimeout
var socketOpen = false
var socketMsgQueue = []
function sendSocketMessage(msg) {
console.log('send msg:', typeof msg)
console.log(msg)
if (socketOpen) {
wx.sendSocketMessage({
data: msg
})
} else {
socketMsgQueue.push(msg)
}
}
var document = {
URL: ''
}
var window = {
setTimeout: setTimeout,
clearTimeout: clearTimeout,
WebSocket: function (url) {
console.log('call window WebSocket', arguments)
var ws = {
send: sendSocketMessage,
close: wx.closeSocket,
onopen: null,
onmessage: null,
onclose: null,
onerror: null
}
wx.connectSocket({ url: url })
wx.onSocketOpen(function (res) {
console.log('收到onopen事件:', arguments)
socketOpen = true
for (var i = 0i <socketMsgQueue.lengthi++) {
sendSocketMessage(socketMsgQueue[i])
}
socketMsgQueue = []
ws.onopen &&ws.onopen.apply(ws, arguments)
})
wx.onSocketMessage(function (res) {
console.log('收到onmessage事件:', arguments)
console.log(res.data)
ws.onmessage &&ws.onmessage.apply(ws, arguments)
})
wx.onSocketClose(function () {
console.log('收到onclose事件:', arguments)
ws.onclose &&ws.onclose.apply(ws, arguments)
})
wx.onSocketError(function () {
console.log('收到onerror事件:', arguments)
ws.onerror &&ws.onerror.apply(ws, arguments)
})
return ws
}
}
最近在着手研究使用网页控制硬件的交互过程，发现mqtt协议有很多种语言的封装，整个思路也很清晰，就是一个客户端进行发布和订阅+服务器中间代理的过程，于是开始学习使用MQTT框架搭建交互平台。客户端使用了MQTT.js，服务器使用mosca（基于nodejs）。
QoS在MQTT中有（摘自 MQ 遥测传输 (MQTT) V3.1 协议规范 ）：
MQTT.js只是支持了MQTT协议，并没有支持QoS，也就是说，只支持最低级别的“至多一次”（QoS0）。
在MQTT协议中，一个MQTT数据包由：固定头（Fixed header）、可变头（Variable header）、消息体（payload）三部分构成。
这里只了解消息体，固定头和可变头并不需要我们手动写。
payload消息体包含CONNECT、SUBSCRIBE、SUBACK、UNSUBSCRIBE四种类型的消息：
（1）Connect 与服务器建立连接。
（2）Disconnect 与服务器断开TCP/IP会话。
（3）Subscribe 订阅。
（4）UnSubscribe 取消订阅。
（5）Publish 发送消息请求，发送完成后返回应用程序线程。
二、实现（具体的API稍后呈现）
//引入mqtt的js包
var mqtt=require('../../utils/mqtt.min.js')
var client=null
Page({
/**
* 页面的初始数据
*/
data: {
},
onLoad() {
this.connectmqtt()
},
connectmqtt:function(){
var that=this
const options={
connectTimeout:4000,//连接延时
clientId:"PonyRemoteControl"+Math.ceil(Math.random()*10), //昵称
port:8084,//端口
username:'',
password:''
}
client=mqtt.connect('wxs://mqtt.****.cc/mqtt',options)//连接mqtt
client.on('connect',(e)=>{
console.log('服务器连接成功')
client.subscribe('EquipmentEnd_RemoteControlCar',{qos:0},function(err){
if (!err) {
console.log('订阅成功')
}
})
})
//信息监听事件
client.on('message',function(topic,message){
console.log('收到:'+message.toString())
})
client.on('reconnect',(error)=>{
console.log('正在重连中',error)
})
client.on('error',(error)=>{
console.log('连接失败',error)
})
}
})
