├── .gitignore
├── .hbuilderx
    └── launch.json
├── App.vue
├── README.md
├── index.html
├── lib
    └── mqttTool.js
├── main.js
├── manifest.json
├── package-lock.json
├── package.json
├── pages.json
├── pages
    ├── home
    │   └── Home.vue
    └── index
    │   └── index.vue
├── static
    └── logo.png
└── uni.scss


/.gitignore:
--------------------------------------------------------------------------------
 1 | .DS_Store
 2 | node_modules
 3 | unpackage
 4 | /dist
 5 | 
 6 | # local env files
 7 | .env.local
 8 | .env.*.local
 9 | 
10 | # Log files
11 | npm-debug.log*
12 | yarn-debug.log*
13 | yarn-error.log*
14 | pnpm-debug.log*
15 | 
16 | # Editor directories and files
17 | .idea
18 | .vscode
19 | *.suo
20 | *.ntvs*
21 | *.njsproj
22 | *.sln
23 | *.sw?
24 | 


--------------------------------------------------------------------------------
/.hbuilderx/launch.json:
--------------------------------------------------------------------------------
 1 | { // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
 2 |   // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
 3 |     "version": "0.0",
 4 |     "configurations": [{
 5 |      	"app-plus" : 
 6 |      	{
 7 |      		"launchtype" : "local"
 8 |      	},
 9 |      	"default" : 
10 |      	{
11 |      		"launchtype" : "local"
12 |      	},
13 |      	"type" : "uniCloud"
14 |      }
15 |     ]
16 | }
17 | 


--------------------------------------------------------------------------------
/App.vue:
--------------------------------------------------------------------------------
 1 | <script>
 2 | 	export default {
 3 | 		onLaunch: function() {
 4 | 			console.log('App Launch')
 5 | 		},
 6 | 		onShow: function() {
 7 | 			console.log('App Show')
 8 | 		},
 9 | 		onHide: function() {
10 | 			console.log('App Hide')
11 | 		}
12 | 	}
13 | </script>
14 | 
15 | <style>
16 | 	/*每个页面公共css */
17 | </style>
18 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
  1 | # MQTT 演示及调试demo
  2 | 
  3 | 仅作为供MQTT初试者参考范例
  4 | 
  5 | ---
  6 | 
  7 | ## 如何使用
  8 | 
  9 | - 下载项目代码
 10 | - npm install 安装mqtt.js包
 11 | - HbuilderX运行项目即可（请先替换配置中mqtt的connect地址为你个人地址）
 12 | 
 13 | ### 1. 代码示例[mqttTool.js]
 14 | 
 15 | - mqttTool为个人处理工具
 16 | 
 17 | ```js
 18 | var mqtt = require('mqtt/dist/mqtt.js')
 19 | 
 20 | let mqttTool = {
 21 | 	client: null
 22 | }
 23 | 
 24 | mqttTool.connect = function(params){
 25 | 	let options = {
 26 | 		clientId: params.clientId,
 27 | 		username: params.username,
 28 | 		password: params.password,
 29 | 		clean: params.clean,
 30 | 		connectTimeout: 600000, 
 31 | 		cleanSession: false
 32 | 	}
 33 | 	let client = mqtt.connect(params.url, options);
 34 | 	mqttTool.client = client
 35 | 	return client;
 36 | }
 37 | 
 38 | mqttTool.end = function(){
 39 | 	return new Promise((resolve, reject) => {
 40 | 		if(mqttTool.client == null){
 41 | 			resolve('未连接')
 42 | 			console.log('App_text' + ":end 未连接")
 43 | 			return;
 44 | 		}
 45 | 		mqttTool.client.end()
 46 | 		mqttTool.client = null
 47 | 		resolve('连接终止')
 48 | 	})
 49 | }
 50 | 
 51 | mqttTool.reconnect = function(){
 52 | 	return new Promise((resolve, reject) => {
 53 | 		if(mqttTool.client == null){
 54 | 			resolve('未连接')
 55 | 			console.log('App_text' + ":reconnect 未连接")
 56 | 			return;
 57 | 		}
 58 | 		mqttTool.client.reconnect()
 59 | 	})
 60 | }
 61 | 
 62 | mqttTool.subscribe = function(params){
 63 | 	return new Promise((resolve, reject) => {
 64 | 		if(mqttTool.client == null){
 65 | 			resolve('未连接')
 66 | 			console.log('App_text' + ":unconnect 未连接")
 67 | 			return;
 68 | 		}
 69 | 		mqttTool.client.subscribe(params.topic, {qos:params.qos}, function(err,res) {
 70 | 			console.log(err,res)
 71 | 			if (!err && res.length>0) {
 72 | 				resolve('订阅成功')
 73 | 				console.log('App_text' + ":subscribe success 订阅成功")
 74 | 			}else{
 75 | 				resolve('订阅失败')
 76 | 				console.log('App_text' + ":subscribe failed 订阅失败")
 77 | 				return;
 78 | 			} 
 79 | 		})  
 80 | 	})
 81 | }
 82 | 
 83 | mqttTool.unsubscribe = function(params){
 84 | 	return new Promise((resolve, reject) => {
 85 | 		if(mqttTool.client == null){
 86 | 			resolve('未连接')
 87 | 			console.log('App_text' + ":unconnect 未连接")
 88 | 			return;
 89 | 		}
 90 | 		mqttTool.client.unsubscribe(params.topic, function(err) {
 91 | 			if (!err) {
 92 | 				resolve('取消订阅成功')
 93 | 				console.log('App_text' + ":unsubscribe success 取消订阅成功")
 94 | 			}else{
 95 | 				resolve('取消订阅失败')
 96 | 				console.log('App_text' + ":unsubscribe failed 取消订阅失败")
 97 | 				return;
 98 | 			} 
 99 | 		})  
100 | 	})
101 | }
102 | 
103 | mqttTool.publish = function(params){
104 | 	return new Promise((resolve, reject) => {
105 | 		if(mqttTool.client == null){
106 | 			resolve('未连接')
107 | 			console.log('App_text' + ":unconnect 未连接")
108 | 			return;
109 | 		}
110 | 		mqttTool.client.publish(params.topic, params.message, function(err){
111 | 			if (!err) {
112 | 				resolve(params.topic + '-' + params.message + '-发送成功')
113 | 				console.log('App_text' + ":publish success 发送成功")
114 | 			}else{
115 | 				resolve(params.topic + '-' + params.message + '-发送失败')
116 | 				console.log('App_text' + ":publish failed 发送失败")
117 | 				return;
118 | 			} 
119 | 		})
120 | 	})
121 | }
122 | 
123 | export default mqttTool
124 | ```
125 | 
126 | ### 2. 代码示例[main.js]
127 | 
128 | - 使用范例
129 |   ```js
130 |   import mqttTool from './lib/mqttTool.js'
131 |   Vue.prototype.$mqttTool = mqttTool
132 |   ```
133 | 
134 | 
135 | ### 3. 代码示例[index.vue]
136 | 
137 | - 使用范例
138 |   ```js
139 |   /* 连接 */
140 |     		async startConnect(){
141 |     			var _this = this
142 |     			let opts = {
143 |     				url: 'wx://192.168.1.131:8083/mqtt',
144 |     				clientId: this.connectInfo.clientId,
145 |     				username: this.connectInfo.username,
146 |     				password: this.connectInfo.password,
147 |     				clean: this.connectInfo.clean
148 |     			}
149 |     			var client = await this.$mqttTool.connect(opts);
150 |     			client.on('connect', function(res) {
151 |     				_this.logs.unshift({option:'mqtt：', log:'连接成功'})
152 |     			})
153 |     			client.on('reconnect', function(res) {
154 |     				_this.logs.unshift({option:'mqtt：', log:'重新连接'})
155 |     			})
156 |     			client.on('error', function(res) {
157 |     				_this.logs.unshift({option:'mqtt：', log:'连接错误'})
158 |     			})
159 |     			client.on('close', function(res) {
160 |     				_this.logs.unshift({option:'mqtt：', log:'关闭成功'})
161 |     			})
162 |     			client.on('message', function(topic, message, buffer) {
163 |     				if(_this.isBuffer){
164 |     					_this.logs.unshift({option:topic+' buffer：', log: JSON.stringify(buffer)})
165 |     				}
166 |     				_this.logs.unshift({option:topic+' message：' + buffer.messageId, log: message.toString()})
167 |     			})
168 |     		},
169 |   ```
170 | 


--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
 1 | <!DOCTYPE html>
 2 | <html lang="en">
 3 |   <head>
 4 |     <meta charset="UTF-8" />
 5 |     <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0" />
 6 |     <title></title>
 7 |     <!--preload-links-->
 8 |     <!--app-context-->
 9 |   </head>
10 |   <body>
11 |     <div id="app"><!--app-html--></div>
12 |     <script type="module" src="/main.js"></script>
13 |   </body>
14 | </html>
15 | 


--------------------------------------------------------------------------------
/lib/mqttTool.js:
--------------------------------------------------------------------------------
  1 | /* main.js 项目主入口注入实例 */
  2 | // import mqttTool from './lib/mqttTool.js'
  3 | // Vue.prototype.$mqttTool = mqttTool
  4 | 
  5 | /* 使用范例见 /pages/index/index.vue */
  6 | // mqtt协议：H5使用ws/wss APP-PLUS使用wx/wxs
  7 | 
  8 | var mqtt = require('mqtt/dist/mqtt.js')
  9 | 
 10 | let mqttTool = {
 11 | 	client: null
 12 | }
 13 | 
 14 | mqttTool.connect = function(params){
 15 | 	let options = {
 16 | 		clientId: params.clientId,
 17 | 		username: params.username,
 18 | 		password: params.password,
 19 | 		clean: params.clean,
 20 | 		connectTimeout: 600000, 
 21 | 		cleanSession: false
 22 | 	}
 23 | 	let client = mqtt.connect(params.url, options);
 24 | 	mqttTool.client = client
 25 | 	return client;
 26 | }
 27 | 
 28 | mqttTool.end = function(){
 29 | 	return new Promise((resolve, reject) => {
 30 | 		if(mqttTool.client == null){
 31 | 			resolve('未连接')
 32 | 			console.log('App_text' + ":end 未连接")
 33 | 			return;
 34 | 		}
 35 | 		mqttTool.client.end()
 36 | 		mqttTool.client = null
 37 | 		resolve('连接终止')
 38 | 	})
 39 | }
 40 | 
 41 | mqttTool.reconnect = function(){
 42 | 	return new Promise((resolve, reject) => {
 43 | 		if(mqttTool.client == null){
 44 | 			resolve('未连接')
 45 | 			console.log('App_text' + ":reconnect 未连接")
 46 | 			return;
 47 | 		}
 48 | 		mqttTool.client.reconnect()
 49 | 	})
 50 | }
 51 | 
 52 | mqttTool.subscribe = function(params){
 53 | 	return new Promise((resolve, reject) => {
 54 | 		if(mqttTool.client == null){
 55 | 			resolve('未连接')
 56 | 			console.log('App_text' + ":unconnect 未连接")
 57 | 			return;
 58 | 		}
 59 | 		mqttTool.client.subscribe(params.topic, {qos:params.qos}, function(err,res) {
 60 | 			console.log(err,res)
 61 | 			if (!err && res.length>0) {
 62 | 				resolve('订阅成功')
 63 | 				console.log('App_text' + ":subscribe success 订阅成功")
 64 | 			}else{
 65 | 				resolve('订阅失败')
 66 | 				console.log('App_text' + ":subscribe failed 订阅失败")
 67 | 				return;
 68 | 			} 
 69 | 		})  
 70 | 	})
 71 | }
 72 | 
 73 | mqttTool.unsubscribe = function(params){
 74 | 	return new Promise((resolve, reject) => {
 75 | 		if(mqttTool.client == null){
 76 | 			resolve('未连接')
 77 | 			console.log('App_text' + ":unconnect 未连接")
 78 | 			return;
 79 | 		}
 80 | 		mqttTool.client.unsubscribe(params.topic, function(err) {
 81 | 			if (!err) {
 82 | 				resolve('取消订阅成功')
 83 | 				console.log('App_text' + ":unsubscribe success 取消订阅成功")
 84 | 			}else{
 85 | 				resolve('取消订阅失败')
 86 | 				console.log('App_text' + ":unsubscribe failed 取消订阅失败")
 87 | 				return;
 88 | 			} 
 89 | 		})  
 90 | 	})
 91 | }
 92 | 
 93 | mqttTool.publish = function(params){
 94 | 	return new Promise((resolve, reject) => {
 95 | 		if(mqttTool.client == null){
 96 | 			resolve('未连接')
 97 | 			console.log('App_text' + ":unconnect 未连接")
 98 | 			return;
 99 | 		}
100 | 		mqttTool.client.publish(params.topic, params.message, function(err){
101 | 			if (!err) {
102 | 				resolve(params.topic + '-' + params.message + '-发送成功')
103 | 				console.log('App_text' + ":publish success 发送成功")
104 | 			}else{
105 | 				resolve(params.topic + '-' + params.message + '-发送失败')
106 | 				console.log('App_text' + ":publish failed 发送失败")
107 | 				return;
108 | 			} 
109 | 		})
110 | 	})
111 | }
112 | 
113 | export default mqttTool
114 | 


--------------------------------------------------------------------------------
/main.js:
--------------------------------------------------------------------------------
 1 | import Vue from 'vue'
 2 | import App from './App'
 3 | 
 4 | import mqttTool from './lib/mqttTool.js'
 5 | Vue.prototype.$mqttTool = mqttTool
 6 | 
 7 | Vue.config.productionTip = false
 8 | App.mpType = 'app'
 9 | const app = new Vue({
10 | 	...App
11 | })
12 | app.$mount()


--------------------------------------------------------------------------------
/manifest.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name" : "MQTT",
 3 |     "appid" : "__UNI__EB874D4",
 4 |     "description" : "",
 5 |     "versionName" : "1.0.0",
 6 |     "versionCode" : "100",
 7 |     "transformPx" : false,
 8 |     /* 5+App特有相关 */
 9 |     "app-plus" : {
10 |         "usingComponents" : true,
11 |         "nvueStyleCompiler" : "uni-app",
12 |         "compilerVersion" : 3,
13 |         "splashscreen" : {
14 |             "alwaysShowBeforeRender" : true,
15 |             "waiting" : true,
16 |             "autoclose" : true,
17 |             "delay" : 0
18 |         },
19 |         /* 模块配置 */
20 |         "modules" : {},
21 |         /* 应用发布信息 */
22 |         "distribute" : {
23 |             /* android打包配置 */
24 |             "android" : {
25 |                 "permissions" : [
26 |                     "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
27 |                     "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
28 |                     "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
29 |                     "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
30 |                     "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
31 |                     "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
32 |                     "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
33 |                     "<uses-permission android:name=\"android.permission.CAMERA\"/>",
34 |                     "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
35 |                     "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
36 |                     "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
37 |                     "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
38 |                     "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
39 |                     "<uses-feature android:name=\"android.hardware.camera\"/>",
40 |                     "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
41 |                 ]
42 |             },
43 |             /* ios打包配置 */
44 |             "ios" : {},
45 |             /* SDK配置 */
46 |             "sdkConfigs" : {}
47 |         }
48 |     },
49 |     /* 快应用特有相关 */
50 |     "quickapp" : {},
51 |     /* 小程序特有相关 */
52 |     "mp-weixin" : {
53 |         "appid" : "",
54 |         "setting" : {
55 |             "urlCheck" : false
56 |         },
57 |         "usingComponents" : true
58 |     },
59 |     "mp-alipay" : {
60 |         "usingComponents" : true
61 |     },
62 |     "mp-baidu" : {
63 |         "usingComponents" : true
64 |     },
65 |     "mp-toutiao" : {
66 |         "usingComponents" : true
67 |     },
68 |     "uniStatistics" : {
69 |         "enable" : false
70 |     },
71 |     "vueVersion" : "2"
72 | }
73 | 


--------------------------------------------------------------------------------
/package-lock.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "name": "demo",
  3 |   "version": "1.0.0",
  4 |   "lockfileVersion": 1,
  5 |   "requires": true,
  6 |   "dependencies": {
  7 |     "async-limiter": {
  8 |       "version": "1.0.1",
  9 |       "resolved": "https://registry.npmjs.org/async-limiter/-/async-limiter-1.0.1.tgz",
 10 |       "integrity": "sha512-csOlWGAcRFJaI6m+F2WKdnMKr4HhdhFVBk0H/QbJFMCr+uO2kwohwXQPxw/9OCxp05r5ghVBFSyioixx3gfkNQ=="
 11 |     },
 12 |     "balanced-match": {
 13 |       "version": "1.0.2",
 14 |       "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz",
 15 |       "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw=="
 16 |     },
 17 |     "base64-js": {
 18 |       "version": "1.5.1",
 19 |       "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
 20 |       "integrity": "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA=="
 21 |     },
 22 |     "bl": {
 23 |       "version": "4.1.0",
 24 |       "resolved": "https://registry.npmjs.org/bl/-/bl-4.1.0.tgz",
 25 |       "integrity": "sha512-1W07cM9gS6DcLperZfFSj+bWLtaPGSOHWhPiGzXmvVJbRLdG82sH/Kn8EtW1VqWVA54AKf2h5k5BbnIbwF3h6w==",
 26 |       "requires": {
 27 |         "buffer": "^5.5.0",
 28 |         "inherits": "^2.0.4",
 29 |         "readable-stream": "^3.4.0"
 30 |       },
 31 |       "dependencies": {
 32 |         "readable-stream": {
 33 |           "version": "3.6.0",
 34 |           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
 35 |           "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
 36 |           "requires": {
 37 |             "inherits": "^2.0.3",
 38 |             "string_decoder": "^1.1.1",
 39 |             "util-deprecate": "^1.0.1"
 40 |           }
 41 |         }
 42 |       }
 43 |     },
 44 |     "brace-expansion": {
 45 |       "version": "1.1.11",
 46 |       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
 47 |       "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
 48 |       "requires": {
 49 |         "balanced-match": "^1.0.0",
 50 |         "concat-map": "0.0.1"
 51 |       }
 52 |     },
 53 |     "buffer": {
 54 |       "version": "5.7.1",
 55 |       "resolved": "https://registry.npmjs.org/buffer/-/buffer-5.7.1.tgz",
 56 |       "integrity": "sha512-EHcyIPBQ4BSGlvjB16k5KgAJ27CIsHY/2JBmCRReo48y9rQ3MaUzWX3KVlBa4U7MyX02HdVj0K7C3WaB3ju7FQ==",
 57 |       "requires": {
 58 |         "base64-js": "^1.3.1",
 59 |         "ieee754": "^1.1.13"
 60 |       }
 61 |     },
 62 |     "buffer-from": {
 63 |       "version": "1.1.2",
 64 |       "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
 65 |       "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="
 66 |     },
 67 |     "callback-stream": {
 68 |       "version": "1.1.0",
 69 |       "resolved": "https://registry.npmjs.org/callback-stream/-/callback-stream-1.1.0.tgz",
 70 |       "integrity": "sha512-sAZ9kODla+mGACBZ1IpTCAisKoGnv6PykW7fPk1LrM+mMepE18Yz0515yoVcrZy7dQsTUp3uZLQ/9Sx1RnLoHw==",
 71 |       "requires": {
 72 |         "inherits": "^2.0.1",
 73 |         "readable-stream": "> 1.0.0 < 3.0.0"
 74 |       }
 75 |     },
 76 |     "commist": {
 77 |       "version": "1.1.0",
 78 |       "resolved": "https://registry.npmjs.org/commist/-/commist-1.1.0.tgz",
 79 |       "integrity": "sha512-rraC8NXWOEjhADbZe9QBNzLAN5Q3fsTPQtBV+fEVj6xKIgDgNiEVE6ZNfHpZOqfQ21YUzfVNUXLOEZquYvQPPg==",
 80 |       "requires": {
 81 |         "leven": "^2.1.0",
 82 |         "minimist": "^1.1.0"
 83 |       }
 84 |     },
 85 |     "concat-map": {
 86 |       "version": "0.0.1",
 87 |       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
 88 |       "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
 89 |     },
 90 |     "concat-stream": {
 91 |       "version": "1.6.2",
 92 |       "resolved": "https://registry.npmjs.org/concat-stream/-/concat-stream-1.6.2.tgz",
 93 |       "integrity": "sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==",
 94 |       "requires": {
 95 |         "buffer-from": "^1.0.0",
 96 |         "inherits": "^2.0.3",
 97 |         "readable-stream": "^2.2.2",
 98 |         "typedarray": "^0.0.6"
 99 |       }
100 |     },
101 |     "core-util-is": {
102 |       "version": "1.0.3",
103 |       "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.3.tgz",
104 |       "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ=="
105 |     },
106 |     "d": {
107 |       "version": "1.0.1",
108 |       "resolved": "https://registry.npmjs.org/d/-/d-1.0.1.tgz",
109 |       "integrity": "sha512-m62ShEObQ39CfralilEQRjH6oAMtNCV1xJyEx5LpRYUVN+EviphDgUc/F3hnYbADmkiNs67Y+3ylmlG7Lnu+FA==",
110 |       "requires": {
111 |         "es5-ext": "^0.10.50",
112 |         "type": "^1.0.1"
113 |       }
114 |     },
115 |     "debug": {
116 |       "version": "4.3.4",
117 |       "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz",
118 |       "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==",
119 |       "requires": {
120 |         "ms": "2.1.2"
121 |       }
122 |     },
123 |     "duplexify": {
124 |       "version": "3.7.1",
125 |       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.7.1.tgz",
126 |       "integrity": "sha512-07z8uv2wMyS51kKhD1KsdXJg5WQ6t93RneqRxUHnskXVtlYYkLqM0gqStQZ3pj073g687jPCHrqNfCzawLYh5g==",
127 |       "requires": {
128 |         "end-of-stream": "^1.0.0",
129 |         "inherits": "^2.0.1",
130 |         "readable-stream": "^2.0.0",
131 |         "stream-shift": "^1.0.0"
132 |       }
133 |     },
134 |     "end-of-stream": {
135 |       "version": "1.4.4",
136 |       "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
137 |       "integrity": "sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==",
138 |       "requires": {
139 |         "once": "^1.4.0"
140 |       }
141 |     },
142 |     "es5-ext": {
143 |       "version": "0.10.61",
144 |       "resolved": "https://registry.npmjs.org/es5-ext/-/es5-ext-0.10.61.tgz",
145 |       "integrity": "sha512-yFhIqQAzu2Ca2I4SE2Au3rxVfmohU9Y7wqGR+s7+H7krk26NXhIRAZDgqd6xqjCEFUomDEA3/Bo/7fKmIkW1kA==",
146 |       "requires": {
147 |         "es6-iterator": "^2.0.3",
148 |         "es6-symbol": "^3.1.3",
149 |         "next-tick": "^1.1.0"
150 |       }
151 |     },
152 |     "es6-iterator": {
153 |       "version": "2.0.3",
154 |       "resolved": "https://registry.npmjs.org/es6-iterator/-/es6-iterator-2.0.3.tgz",
155 |       "integrity": "sha1-p96IkUGgWpSwhUQDstCg+/qY87c=",
156 |       "requires": {
157 |         "d": "1",
158 |         "es5-ext": "^0.10.35",
159 |         "es6-symbol": "^3.1.1"
160 |       }
161 |     },
162 |     "es6-map": {
163 |       "version": "0.1.5",
164 |       "resolved": "https://registry.npmjs.org/es6-map/-/es6-map-0.1.5.tgz",
165 |       "integrity": "sha1-kTbgUD3MBqMBaQ8LsU/042TpSfA=",
166 |       "requires": {
167 |         "d": "1",
168 |         "es5-ext": "~0.10.14",
169 |         "es6-iterator": "~2.0.1",
170 |         "es6-set": "~0.1.5",
171 |         "es6-symbol": "~3.1.1",
172 |         "event-emitter": "~0.3.5"
173 |       }
174 |     },
175 |     "es6-set": {
176 |       "version": "0.1.5",
177 |       "resolved": "https://registry.npmjs.org/es6-set/-/es6-set-0.1.5.tgz",
178 |       "integrity": "sha1-0rPsXU2ADO2BjbU40ol02wpzzLE=",
179 |       "requires": {
180 |         "d": "1",
181 |         "es5-ext": "~0.10.14",
182 |         "es6-iterator": "~2.0.1",
183 |         "es6-symbol": "3.1.1",
184 |         "event-emitter": "~0.3.5"
185 |       },
186 |       "dependencies": {
187 |         "es6-symbol": {
188 |           "version": "3.1.1",
189 |           "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.1.tgz",
190 |           "integrity": "sha1-vwDvT9q2uhtG7Le2KbTH7VcVzHc=",
191 |           "requires": {
192 |             "d": "1",
193 |             "es5-ext": "~0.10.14"
194 |           }
195 |         }
196 |       }
197 |     },
198 |     "es6-symbol": {
199 |       "version": "3.1.3",
200 |       "resolved": "https://registry.npmjs.org/es6-symbol/-/es6-symbol-3.1.3.tgz",
201 |       "integrity": "sha512-NJ6Yn3FuDinBaBRWl/q5X/s4koRHBrgKAu+yGI6JCBeiu3qrcbJhwT2GeR/EXVfylRk8dpQVJoLEFhK+Mu31NA==",
202 |       "requires": {
203 |         "d": "^1.0.1",
204 |         "ext": "^1.1.2"
205 |       }
206 |     },
207 |     "event-emitter": {
208 |       "version": "0.3.5",
209 |       "resolved": "https://registry.npmjs.org/event-emitter/-/event-emitter-0.3.5.tgz",
210 |       "integrity": "sha1-34xp7vFkeSPHFXuc6DhAYQsCzDk=",
211 |       "requires": {
212 |         "d": "1",
213 |         "es5-ext": "~0.10.14"
214 |       }
215 |     },
216 |     "ext": {
217 |       "version": "1.6.0",
218 |       "resolved": "https://registry.npmjs.org/ext/-/ext-1.6.0.tgz",
219 |       "integrity": "sha512-sdBImtzkq2HpkdRLtlLWDa6w4DX22ijZLKx8BMPUuKe1c5lbN6xwQDQCxSfxBQnHZ13ls/FH0MQZx/q/gr6FQg==",
220 |       "requires": {
221 |         "type": "^2.5.0"
222 |       },
223 |       "dependencies": {
224 |         "type": {
225 |           "version": "2.6.0",
226 |           "resolved": "https://registry.npmjs.org/type/-/type-2.6.0.tgz",
227 |           "integrity": "sha512-eiDBDOmkih5pMbo9OqsqPRGMljLodLcwd5XD5JbtNB0o89xZAwynY9EdCDsJU7LtcVCClu9DvM7/0Ep1hYX3EQ=="
228 |         }
229 |       }
230 |     },
231 |     "extend": {
232 |       "version": "3.0.2",
233 |       "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz",
234 |       "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g=="
235 |     },
236 |     "fs.realpath": {
237 |       "version": "1.0.0",
238 |       "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
239 |       "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8="
240 |     },
241 |     "glob": {
242 |       "version": "7.2.3",
243 |       "resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
244 |       "integrity": "sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==",
245 |       "requires": {
246 |         "fs.realpath": "^1.0.0",
247 |         "inflight": "^1.0.4",
248 |         "inherits": "2",
249 |         "minimatch": "^3.1.1",
250 |         "once": "^1.3.0",
251 |         "path-is-absolute": "^1.0.0"
252 |       }
253 |     },
254 |     "glob-parent": {
255 |       "version": "3.1.0",
256 |       "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-3.1.0.tgz",
257 |       "integrity": "sha1-nmr2KZ2NO9K9QEMIMr0RPfkGxa4=",
258 |       "requires": {
259 |         "is-glob": "^3.1.0",
260 |         "path-dirname": "^1.0.0"
261 |       }
262 |     },
263 |     "glob-stream": {
264 |       "version": "6.1.0",
265 |       "resolved": "https://registry.npmjs.org/glob-stream/-/glob-stream-6.1.0.tgz",
266 |       "integrity": "sha1-cEXJlBOz65SIjYOrRtC0BMx73eQ=",
267 |       "requires": {
268 |         "extend": "^3.0.0",
269 |         "glob": "^7.1.1",
270 |         "glob-parent": "^3.1.0",
271 |         "is-negated-glob": "^1.0.0",
272 |         "ordered-read-streams": "^1.0.0",
273 |         "pumpify": "^1.3.5",
274 |         "readable-stream": "^2.1.5",
275 |         "remove-trailing-separator": "^1.0.1",
276 |         "to-absolute-glob": "^2.0.0",
277 |         "unique-stream": "^2.0.2"
278 |       }
279 |     },
280 |     "help-me": {
281 |       "version": "1.1.0",
282 |       "resolved": "https://registry.npmjs.org/help-me/-/help-me-1.1.0.tgz",
283 |       "integrity": "sha1-jy1QjQYAtKRW2i8IZVbn5cBWo8Y=",
284 |       "requires": {
285 |         "callback-stream": "^1.0.2",
286 |         "glob-stream": "^6.1.0",
287 |         "through2": "^2.0.1",
288 |         "xtend": "^4.0.0"
289 |       }
290 |     },
291 |     "ieee754": {
292 |       "version": "1.2.1",
293 |       "resolved": "https://registry.npmjs.org/ieee754/-/ieee754-1.2.1.tgz",
294 |       "integrity": "sha512-dcyqhDvX1C46lXZcVqCpK+FtMRQVdIMN6/Df5js2zouUsqG7I6sFxitIC+7KYK29KdXOLHdu9zL4sFnoVQnqaA=="
295 |     },
296 |     "inflight": {
297 |       "version": "1.0.6",
298 |       "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
299 |       "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
300 |       "requires": {
301 |         "once": "^1.3.0",
302 |         "wrappy": "1"
303 |       }
304 |     },
305 |     "inherits": {
306 |       "version": "2.0.4",
307 |       "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
308 |       "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ=="
309 |     },
310 |     "is-absolute": {
311 |       "version": "1.0.0",
312 |       "resolved": "https://registry.npmjs.org/is-absolute/-/is-absolute-1.0.0.tgz",
313 |       "integrity": "sha512-dOWoqflvcydARa360Gvv18DZ/gRuHKi2NU/wU5X1ZFzdYfH29nkiNZsF3mp4OJ3H4yo9Mx8A/uAGNzpzPN3yBA==",
314 |       "requires": {
315 |         "is-relative": "^1.0.0",
316 |         "is-windows": "^1.0.1"
317 |       }
318 |     },
319 |     "is-extglob": {
320 |       "version": "2.1.1",
321 |       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
322 |       "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI="
323 |     },
324 |     "is-glob": {
325 |       "version": "3.1.0",
326 |       "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-3.1.0.tgz",
327 |       "integrity": "sha1-e6WuJCF4BKxwcHuWkiVnSGzD6Eo=",
328 |       "requires": {
329 |         "is-extglob": "^2.1.0"
330 |       }
331 |     },
332 |     "is-negated-glob": {
333 |       "version": "1.0.0",
334 |       "resolved": "https://registry.npmjs.org/is-negated-glob/-/is-negated-glob-1.0.0.tgz",
335 |       "integrity": "sha1-aRC8pdqMleeEtXUbl2z1oQ/uNtI="
336 |     },
337 |     "is-relative": {
338 |       "version": "1.0.0",
339 |       "resolved": "https://registry.npmjs.org/is-relative/-/is-relative-1.0.0.tgz",
340 |       "integrity": "sha512-Kw/ReK0iqwKeu0MITLFuj0jbPAmEiOsIwyIXvvbfa6QfmN9pkD1M+8pdk7Rl/dTKbH34/XBFMbgD4iMJhLQbGA==",
341 |       "requires": {
342 |         "is-unc-path": "^1.0.0"
343 |       }
344 |     },
345 |     "is-unc-path": {
346 |       "version": "1.0.0",
347 |       "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-1.0.0.tgz",
348 |       "integrity": "sha512-mrGpVd0fs7WWLfVsStvgF6iEJnbjDFZh9/emhRDcGWTduTfNHd9CHeUwH3gYIjdbwo4On6hunkztwOaAw0yllQ==",
349 |       "requires": {
350 |         "unc-path-regex": "^0.1.2"
351 |       }
352 |     },
353 |     "is-windows": {
354 |       "version": "1.0.2",
355 |       "resolved": "https://registry.npmjs.org/is-windows/-/is-windows-1.0.2.tgz",
356 |       "integrity": "sha512-eXK1UInq2bPmjyX6e3VHIzMLobc4J94i4AWn+Hpq3OU5KkrRC96OAcR3PRJ/pGu6m8TRnBHP9dkXQVsT/COVIA=="
357 |     },
358 |     "isarray": {
359 |       "version": "1.0.0",
360 |       "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
361 |       "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE="
362 |     },
363 |     "json-stable-stringify-without-jsonify": {
364 |       "version": "1.0.1",
365 |       "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
366 |       "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE="
367 |     },
368 |     "leven": {
369 |       "version": "2.1.0",
370 |       "resolved": "https://registry.npmjs.org/leven/-/leven-2.1.0.tgz",
371 |       "integrity": "sha1-wuep93IJTe6dNCAq6KzORoeHVYA="
372 |     },
373 |     "minimatch": {
374 |       "version": "3.1.2",
375 |       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
376 |       "integrity": "sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==",
377 |       "requires": {
378 |         "brace-expansion": "^1.1.7"
379 |       }
380 |     },
381 |     "minimist": {
382 |       "version": "1.2.6",
383 |       "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz",
384 |       "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q=="
385 |     },
386 |     "mqtt": {
387 |       "version": "3.0.0",
388 |       "resolved": "https://registry.npmjs.org/mqtt/-/mqtt-3.0.0.tgz",
389 |       "integrity": "sha512-0nKV6MAc1ibKZwaZQUTb3iIdT4NVpj541BsYrqrGBcQdQ7Jd0MnZD1/6/nj1UFdGTboK9ZEUXvkCu2nPCugHFA==",
390 |       "requires": {
391 |         "base64-js": "^1.3.0",
392 |         "commist": "^1.0.0",
393 |         "concat-stream": "^1.6.2",
394 |         "end-of-stream": "^1.4.1",
395 |         "es6-map": "^0.1.5",
396 |         "help-me": "^1.0.1",
397 |         "inherits": "^2.0.3",
398 |         "minimist": "^1.2.0",
399 |         "mqtt-packet": "^6.0.0",
400 |         "pump": "^3.0.0",
401 |         "readable-stream": "^2.3.6",
402 |         "reinterval": "^1.1.0",
403 |         "split2": "^3.1.0",
404 |         "websocket-stream": "^5.1.2",
405 |         "xtend": "^4.0.1"
406 |       }
407 |     },
408 |     "mqtt-packet": {
409 |       "version": "6.10.0",
410 |       "resolved": "https://registry.npmjs.org/mqtt-packet/-/mqtt-packet-6.10.0.tgz",
411 |       "integrity": "sha512-ja8+mFKIHdB1Tpl6vac+sktqy3gA8t9Mduom1BA75cI+R9AHnZOiaBQwpGiWnaVJLDGRdNhQmFaAqd7tkKSMGA==",
412 |       "requires": {
413 |         "bl": "^4.0.2",
414 |         "debug": "^4.1.1",
415 |         "process-nextick-args": "^2.0.1"
416 |       }
417 |     },
418 |     "ms": {
419 |       "version": "2.1.2",
420 |       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
421 |       "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
422 |     },
423 |     "next-tick": {
424 |       "version": "1.1.0",
425 |       "resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz",
426 |       "integrity": "sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ=="
427 |     },
428 |     "once": {
429 |       "version": "1.4.0",
430 |       "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
431 |       "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
432 |       "requires": {
433 |         "wrappy": "1"
434 |       }
435 |     },
436 |     "ordered-read-streams": {
437 |       "version": "1.0.1",
438 |       "resolved": "https://registry.npmjs.org/ordered-read-streams/-/ordered-read-streams-1.0.1.tgz",
439 |       "integrity": "sha1-d8DLN8QVJdZBZtmQ/61+xqDhNj4=",
440 |       "requires": {
441 |         "readable-stream": "^2.0.1"
442 |       }
443 |     },
444 |     "path-dirname": {
445 |       "version": "1.0.2",
446 |       "resolved": "https://registry.npmjs.org/path-dirname/-/path-dirname-1.0.2.tgz",
447 |       "integrity": "sha1-zDPSTVJeCZpTiMAzbG4yuRYGCeA="
448 |     },
449 |     "path-is-absolute": {
450 |       "version": "1.0.1",
451 |       "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
452 |       "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
453 |     },
454 |     "process-nextick-args": {
455 |       "version": "2.0.1",
456 |       "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.1.tgz",
457 |       "integrity": "sha512-3ouUOpQhtgrbOa17J7+uxOTpITYWaGP7/AhoR3+A+/1e9skrzelGi/dXzEYyvbxubEF6Wn2ypscTKiKJFFn1ag=="
458 |     },
459 |     "pump": {
460 |       "version": "3.0.0",
461 |       "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz",
462 |       "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
463 |       "requires": {
464 |         "end-of-stream": "^1.1.0",
465 |         "once": "^1.3.1"
466 |       }
467 |     },
468 |     "pumpify": {
469 |       "version": "1.5.1",
470 |       "resolved": "https://registry.npmjs.org/pumpify/-/pumpify-1.5.1.tgz",
471 |       "integrity": "sha512-oClZI37HvuUJJxSKKrC17bZ9Cu0ZYhEAGPsPUy9KlMUmv9dKX2o77RUmq7f3XjIxbwyGwYzbzQ1L2Ks8sIradQ==",
472 |       "requires": {
473 |         "duplexify": "^3.6.0",
474 |         "inherits": "^2.0.3",
475 |         "pump": "^2.0.0"
476 |       },
477 |       "dependencies": {
478 |         "pump": {
479 |           "version": "2.0.1",
480 |           "resolved": "https://registry.npmjs.org/pump/-/pump-2.0.1.tgz",
481 |           "integrity": "sha512-ruPMNRkN3MHP1cWJc9OWr+T/xDP0jhXYCLfJcBuX54hhfIBnaQmAUMfDcG4DM5UMWByBbJY69QSphm3jtDKIkA==",
482 |           "requires": {
483 |             "end-of-stream": "^1.1.0",
484 |             "once": "^1.3.1"
485 |           }
486 |         }
487 |       }
488 |     },
489 |     "readable-stream": {
490 |       "version": "2.3.7",
491 |       "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.7.tgz",
492 |       "integrity": "sha512-Ebho8K4jIbHAxnuxi7o42OrZgF/ZTNcsZj6nRKyUmkhLFq8CHItp/fy6hQZuZmP/n3yZ9VBUbp4zz/mX8hmYPw==",
493 |       "requires": {
494 |         "core-util-is": "~1.0.0",
495 |         "inherits": "~2.0.3",
496 |         "isarray": "~1.0.0",
497 |         "process-nextick-args": "~2.0.0",
498 |         "safe-buffer": "~5.1.1",
499 |         "string_decoder": "~1.1.1",
500 |         "util-deprecate": "~1.0.1"
501 |       }
502 |     },
503 |     "reinterval": {
504 |       "version": "1.1.0",
505 |       "resolved": "https://registry.npmjs.org/reinterval/-/reinterval-1.1.0.tgz",
506 |       "integrity": "sha1-M2Hs+jymwYKDOA3Qu5VG85D17Oc="
507 |     },
508 |     "remove-trailing-separator": {
509 |       "version": "1.1.0",
510 |       "resolved": "https://registry.npmjs.org/remove-trailing-separator/-/remove-trailing-separator-1.1.0.tgz",
511 |       "integrity": "sha1-wkvOKig62tW8P1jg1IJJuSN52O8="
512 |     },
513 |     "safe-buffer": {
514 |       "version": "5.1.2",
515 |       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
516 |       "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
517 |     },
518 |     "split2": {
519 |       "version": "3.2.2",
520 |       "resolved": "https://registry.npmjs.org/split2/-/split2-3.2.2.tgz",
521 |       "integrity": "sha512-9NThjpgZnifTkJpzTZ7Eue85S49QwpNhZTq6GRJwObb6jnLFNGB7Qm73V5HewTROPyxD0C29xqmaI68bQtV+hg==",
522 |       "requires": {
523 |         "readable-stream": "^3.0.0"
524 |       },
525 |       "dependencies": {
526 |         "readable-stream": {
527 |           "version": "3.6.0",
528 |           "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-3.6.0.tgz",
529 |           "integrity": "sha512-BViHy7LKeTz4oNnkcLJ+lVSL6vpiFeX6/d3oSH8zCW7UxP2onchk+vTGB143xuFjHS3deTgkKoXXymXqymiIdA==",
530 |           "requires": {
531 |             "inherits": "^2.0.3",
532 |             "string_decoder": "^1.1.1",
533 |             "util-deprecate": "^1.0.1"
534 |           }
535 |         }
536 |       }
537 |     },
538 |     "stream-shift": {
539 |       "version": "1.0.1",
540 |       "resolved": "https://registry.npmjs.org/stream-shift/-/stream-shift-1.0.1.tgz",
541 |       "integrity": "sha512-AiisoFqQ0vbGcZgQPY1cdP2I76glaVA/RauYR4G4thNFgkTqr90yXTo4LYX60Jl+sIlPNHHdGSwo01AvbKUSVQ=="
542 |     },
543 |     "string_decoder": {
544 |       "version": "1.1.1",
545 |       "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
546 |       "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
547 |       "requires": {
548 |         "safe-buffer": "~5.1.0"
549 |       }
550 |     },
551 |     "through2": {
552 |       "version": "2.0.5",
553 |       "resolved": "https://registry.npmjs.org/through2/-/through2-2.0.5.tgz",
554 |       "integrity": "sha512-/mrRod8xqpA+IHSLyGCQ2s8SPHiCDEeQJSep1jqLYeEUClOFG2Qsh+4FU6G9VeqpZnGW/Su8LQGc4YKni5rYSQ==",
555 |       "requires": {
556 |         "readable-stream": "~2.3.6",
557 |         "xtend": "~4.0.1"
558 |       }
559 |     },
560 |     "through2-filter": {
561 |       "version": "3.0.0",
562 |       "resolved": "https://registry.npmjs.org/through2-filter/-/through2-filter-3.0.0.tgz",
563 |       "integrity": "sha512-jaRjI2WxN3W1V8/FMZ9HKIBXixtiqs3SQSX4/YGIiP3gL6djW48VoZq9tDqeCWs3MT8YY5wb/zli8VW8snY1CA==",
564 |       "requires": {
565 |         "through2": "~2.0.0",
566 |         "xtend": "~4.0.0"
567 |       }
568 |     },
569 |     "to-absolute-glob": {
570 |       "version": "2.0.2",
571 |       "resolved": "https://registry.npmjs.org/to-absolute-glob/-/to-absolute-glob-2.0.2.tgz",
572 |       "integrity": "sha1-GGX0PZ50sIItufFFt4z/fQ98hJs=",
573 |       "requires": {
574 |         "is-absolute": "^1.0.0",
575 |         "is-negated-glob": "^1.0.0"
576 |       }
577 |     },
578 |     "type": {
579 |       "version": "1.2.0",
580 |       "resolved": "https://registry.npmjs.org/type/-/type-1.2.0.tgz",
581 |       "integrity": "sha512-+5nt5AAniqsCnu2cEQQdpzCAh33kVx8n0VoFidKpB1dVVLAN/F+bgVOqOJqOnEnrhp222clB5p3vUlD+1QAnfg=="
582 |     },
583 |     "typedarray": {
584 |       "version": "0.0.6",
585 |       "resolved": "https://registry.npmjs.org/typedarray/-/typedarray-0.0.6.tgz",
586 |       "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
587 |     },
588 |     "ultron": {
589 |       "version": "1.1.1",
590 |       "resolved": "https://registry.npmjs.org/ultron/-/ultron-1.1.1.tgz",
591 |       "integrity": "sha512-UIEXBNeYmKptWH6z8ZnqTeS8fV74zG0/eRU9VGkpzz+LIJNs8W/zM/L+7ctCkRrgbNnnR0xxw4bKOr0cW0N0Og=="
592 |     },
593 |     "unc-path-regex": {
594 |       "version": "0.1.2",
595 |       "resolved": "https://registry.npmjs.org/unc-path-regex/-/unc-path-regex-0.1.2.tgz",
596 |       "integrity": "sha1-5z3T17DXxe2G+6xrCufYxqadUPo="
597 |     },
598 |     "unique-stream": {
599 |       "version": "2.3.1",
600 |       "resolved": "https://registry.npmjs.org/unique-stream/-/unique-stream-2.3.1.tgz",
601 |       "integrity": "sha512-2nY4TnBE70yoxHkDli7DMazpWiP7xMdCYqU2nBRO0UB+ZpEkGsSija7MvmvnZFUeC+mrgiUfcHSr3LmRFIg4+A==",
602 |       "requires": {
603 |         "json-stable-stringify-without-jsonify": "^1.0.1",
604 |         "through2-filter": "^3.0.0"
605 |       }
606 |     },
607 |     "util-deprecate": {
608 |       "version": "1.0.2",
609 |       "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
610 |       "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8="
611 |     },
612 |     "websocket-stream": {
613 |       "version": "5.5.2",
614 |       "resolved": "https://registry.npmjs.org/websocket-stream/-/websocket-stream-5.5.2.tgz",
615 |       "integrity": "sha512-8z49MKIHbGk3C4HtuHWDtYX8mYej1wWabjthC/RupM9ngeukU4IWoM46dgth1UOS/T4/IqgEdCDJuMe2039OQQ==",
616 |       "requires": {
617 |         "duplexify": "^3.5.1",
618 |         "inherits": "^2.0.1",
619 |         "readable-stream": "^2.3.3",
620 |         "safe-buffer": "^5.1.2",
621 |         "ws": "^3.2.0",
622 |         "xtend": "^4.0.0"
623 |       }
624 |     },
625 |     "wrappy": {
626 |       "version": "1.0.2",
627 |       "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
628 |       "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
629 |     },
630 |     "ws": {
631 |       "version": "3.3.3",
632 |       "resolved": "https://registry.npmjs.org/ws/-/ws-3.3.3.tgz",
633 |       "integrity": "sha512-nnWLa/NwZSt4KQJu51MYlCcSQ5g7INpOrOMt4XV8j4dqTXdmlUmSHQ8/oLC069ckre0fRsgfvsKwbTdtKLCDkA==",
634 |       "requires": {
635 |         "async-limiter": "~1.0.0",
636 |         "safe-buffer": "~5.1.0",
637 |         "ultron": "~1.1.0"
638 |       }
639 |     },
640 |     "xtend": {
641 |       "version": "4.0.2",
642 |       "resolved": "https://registry.npmjs.org/xtend/-/xtend-4.0.2.tgz",
643 |       "integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ=="
644 |     }
645 |   }
646 | }
647 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "demo",
 3 |   "version": "1.0.0",
 4 |   "main": "main.js",
 5 |   "scripts": {
 6 |     "test": "echo \"Error: no test specified\" && exit 1"
 7 |   },
 8 |   "author": "",
 9 |   "license": "ISC",
10 |   "description": "",
11 |   "dependencies": {
12 |     "mqtt": "^3.0.0"
13 |   }
14 | }
15 | 


--------------------------------------------------------------------------------
/pages.json:
--------------------------------------------------------------------------------
 1 | {
 2 | 	"pages": [
 3 | 		{
 4 | 			"path": "pages/home/Home",
 5 | 			"style": {
 6 | 				"navigationBarTitleText": "MQTT",
 7 | 				"app-plus":{
 8 | 					"titleNView": false,
 9 | 					"bounce":"none"
10 | 				}
11 | 			}
12 | 		},
13 | 		{
14 | 			"path": "pages/index/index",
15 | 			"style": {
16 | 				"navigationBarTitleText": "MQTT",
17 | 				"app-plus":{
18 | 					"bounce":"none"
19 | 				}
20 | 			}
21 | 		}
22 | 	],
23 | 	"globalStyle": {
24 | 		"navigationBarTextStyle": "black",
25 | 		"navigationBarTitleText": "uni-app",
26 | 		"navigationBarBackgroundColor": "#FFFFFF",
27 | 		"backgroundColor": "#FFFFFF"
28 | 	}
29 | }
30 | 


--------------------------------------------------------------------------------
/pages/home/Home.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 | 	<view class="mqtt">
  3 | 		<view class="options">
  4 | 			<view class="title" :style="'padding-top:' + systemInfo.statusBarHeight + 'px;'">
  5 | 				<text>MQTT-调试</text>
  6 | 				<text class="title-btn" @click="switchOldPage">回到旧版页面</text>
  7 | 			</view>
  8 | 			<view class="info">
  9 | 				<view class="bar">
 10 | 					<text class="label">clientId:</text>
 11 | 					<input v-model="connectInfo.clientId" class="value" style="width:70%" :adjust-position="false" placeholder=""/>
 12 | 				</view>
 13 | 				<view class="flex-between">
 14 | 					<view class="bar">
 15 | 						<text class="label">username:</text>
 16 | 						<input v-model="connectInfo.username" class="value" :adjust-position="false" placeholder=""/>
 17 | 					</view>
 18 | 					<view class="bar" style="margin-left:4px;">
 19 | 						<text class="label">password:</text>
 20 | 						<input v-model="connectInfo.password" class="value" :adjust-position="false" placeholder=""/>
 21 | 					</view>
 22 | 				</view>
 23 | 				<view class="flex-between">
 24 | 					<view class="btn" @click="startConnect">连接</view>
 25 | 					<view class="btn" @click="endConnect">终止</view>
 26 | 					<view class="btn" @click="reConnect">重新连接</view>
 27 | 				</view>
 28 | 				<view class="flex-between">
 29 | 					<view class="bar" style="width:40%;">
 30 | 						<text class="label">topic</text>
 31 | 						<input v-model="subscribeInfo.topic" class="value" :adjust-position="false" placeholder=""/>
 32 | 					</view>
 33 | 					<view class="bar" @click="changeQos">
 34 | 						<text class="label">qos</text>
 35 | 						<text class="value">{{subscribeInfo.qos}}</text>
 36 | 					</view>
 37 | 					<view class="bar" @click="connectInfo.clean = !connectInfo.clean">
 38 | 						<text class="label">clean</text>
 39 | 						<text class="value">{{connectInfo.clean}}</text>
 40 | 					</view>
 41 | 				</view>
 42 | 				<view class="flex-row">
 43 | 					<view class="btn" @click="startSubscribe">订阅</view>
 44 | 					<view class="btn" style="margin-left:6px;" @click="endSubscribe">取消订阅</view>
 45 | 				</view>
 46 | 				<view class="tips">
 47 | 					<text class="tips-lab">操作日志：</text>
 48 | 					<text class="tips-reset" @click="clearConfig">清空配置</text>
 49 | 					<text class="tips-buffer" :style="isBuffer?'':'opacity:0.5'" @click="isBuffer=!isBuffer">打印Buffer</text>
 50 | 					<text class="tips-clear" @click="cealrLog">清空日志</text>
 51 | 				</view>
 52 | 			</view>
 53 | 		</view>
 54 | 		<scroll-view class="logs" scroll-y>
 55 | 			<view class="logs-list" v-for="(item,index) in logs" :key="index">
 56 | 				{{item.option + item.log}}
 57 | 			</view>
 58 | 		</scroll-view>
 59 | 		<view class="feet" :style="'bottom:' + (isSending?sendInfo.keyboard:0) + 'px;'">
 60 | 			<view class="inpbar">
 61 | 				<input v-model="sendInfo.msg" @focus="focusSend(true)" @blur="focusSend(false)" :adjust-position="false" :cursor-spacing="12" class="inp" type="text" placeholder="请输入内容" placeholder-style="color:#cccccc;"/>
 62 | 				<view v-if="sendInfo.msg==''" class="send send-dark">发送</view>
 63 | 				<view v-else @click="publish()" class="send">发送</view>
 64 | 			</view>
 65 | 		</view>
 66 | 	</view>
 67 | </template>
 68 | 
 69 | <script>
 70 | 	export default{
 71 | 		data(){
 72 | 			return{
 73 | 				/* 连接信息 */
 74 | 				connectInfo: {
 75 | 					clientId: 'Uniapp' + Date.parse(new Date()),
 76 | 					username: 'Mason',
 77 | 					password: '123456',
 78 | 					clean: false
 79 | 				},
 80 | 				/* 订阅信息 */
 81 | 				subscribeInfo: {
 82 | 					topic: 'testtopic',
 83 | 					qos: 1
 84 | 				},
 85 | 				/* 日志信息 */
 86 | 				isBuffer: false,
 87 | 				logs: [
 88 | 					{option:'环境配置：', log:'配置成功'},
 89 | 				],
 90 | 				/* 发送信息 */
 91 | 				isSending: false,
 92 | 				sendInfo: {
 93 | 					msg: '',
 94 | 					keyboard: 0
 95 | 				}
 96 | 			}
 97 | 		},
 98 | 		computed:{
 99 | 			/* system */
100 | 			systemInfo(){
101 | 				return uni.getSystemInfoSync()
102 | 			},
103 | 		},
104 | 		onLoad(){
105 | 			/* 即时通讯类键盘元素高度处理 */
106 | 			uni.onKeyboardHeightChange(res => {
107 | 				this.sendInfo.keyboard = res.height
108 | 			})
109 | 		},
110 | 		onUnload(){
111 | 			uni.offKeyboardHeightChange();
112 | 		},
113 | 		methods:{
114 | 			/* 连接 */
115 | 			async startConnect(){
116 | 				var _this = this
117 | 				let opts = {
118 | 					url: 'wx://你的通讯地址:你的通讯端口号/mqtt',
119 | 					clientId: this.connectInfo.clientId,
120 | 					username: this.connectInfo.username,
121 | 					password: this.connectInfo.password,
122 | 					clean: this.connectInfo.clean
123 | 				}
124 | 				var client = await this.$mqttTool.connect(opts);
125 | 				client.on('connect', function(res) {
126 | 					_this.logs.unshift({option:'mqtt：', log:'连接成功'})
127 | 				})
128 | 				client.on('reconnect', function(res) {
129 | 					_this.logs.unshift({option:'mqtt：', log:'重新连接'})
130 | 				})
131 | 				client.on('error', function(res) {
132 | 					_this.logs.unshift({option:'mqtt：', log:'连接错误'})
133 | 				})
134 | 				client.on('close', function(res) {
135 | 					_this.logs.unshift({option:'mqtt：', log:'关闭成功'})
136 | 				})
137 | 				client.on('message', function(topic, message, buffer) {
138 | 					if(_this.isBuffer){
139 | 						_this.logs.unshift({option:topic+' buffer：', log: JSON.stringify(buffer)})
140 | 					}
141 | 					_this.logs.unshift({option:topic+' message：', log: message.toString()})
142 | 				})
143 | 			},
144 | 			/* 终止连接 */
145 | 			endConnect(){
146 | 				var _this = this
147 | 				this.$mqttTool.end().then(res =>{
148 | 					_this.logs.unshift({option:'终止：', log:res})
149 | 				})
150 | 			},
151 | 			/* 重新连接 */
152 | 			reConnect(){
153 | 				var _this = this
154 | 				this.$mqttTool.reconnect().then(res =>{
155 | 					_this.logs.unshift({option:'重连：', log:res})
156 | 				})
157 | 			},
158 | 			/* 更改Qos */
159 | 			changeQos(){
160 | 				var _this = this
161 | 				if(this.subscribeInfo.qos >= 2){
162 | 					this.subscribeInfo.qos = 0
163 | 					this.logs.unshift({option:'Qos：', log:this.subscribeInfo.qos + ' Qos变更，订阅已取消，请重新发起订阅'})
164 | 					this.endSubscribe();
165 | 				}else{
166 | 					this.subscribeInfo.qos += 1
167 | 					this.logs.unshift({option:'Qos：', log:this.subscribeInfo.qos + ' Qos变更，订阅已取消，请重新发起订阅'})
168 | 					this.endSubscribe();
169 | 				}
170 | 			},
171 | 			/* 订阅 */
172 | 			startSubscribe(){
173 | 				if(this.subscribeInfo.topic == ''){
174 | 					uni.showToast({
175 | 						icon: 'none',
176 | 						title: '输入topic'
177 | 					})
178 | 					return;
179 | 				}
180 | 				var _this = this
181 | 				let opts = {
182 | 					topic: this.subscribeInfo.topic,
183 | 					qos: this.subscribeInfo.qos,
184 | 				}
185 | 				this.$mqttTool.subscribe(opts).then(res =>{
186 | 					_this.logs.unshift({option:'订阅' + opts.topic + '：', log:res})
187 | 				})
188 | 			},
189 | 			/* 取消订阅 */
190 | 			endSubscribe(){
191 | 				var _this = this
192 | 				let opts = {
193 | 					topic: this.subscribeInfo.topic
194 | 				}
195 | 				this.$mqttTool.unsubscribe(opts).then(res =>{
196 | 					_this.logs.unshift({option:'取消订阅：', log:res})
197 | 				})
198 | 			},
199 | 			/* 发送消息 */
200 | 			publish(){
201 | 				var _this = this
202 | 				let opts = {
203 | 					topic: this.subscribeInfo.topic,
204 | 					message: this.sendInfo.msg,
205 | 				}
206 | 				this.$mqttTool.publish(opts).then(res =>{
207 | 					_this.sendInfo.msg = ''
208 | 					_this.logs.unshift({option:'发送：', log:res})
209 | 				})
210 | 			},
211 | 			/* 清空配置 */
212 | 			clearConfig(){
213 | 				this.endConnect();
214 | 				this.connectInfo = {
215 | 					clientId: '',
216 | 					username: '',
217 | 					password: ''
218 | 				}
219 | 				this.subscribeInfo = {
220 | 					topic: '',
221 | 					qos: 1,
222 | 					sendMsg: ''
223 | 				}
224 | 				this.isBuffer = false
225 | 			},
226 | 			/* 清空日志 */
227 | 			cealrLog(){
228 | 				this.logs = [{option:'环境配置：', log:'配置成功'}]
229 | 			},
230 | 			/* ***********************MQTT无关事件*********************** */
231 | 			/* 回到旧版 */
232 | 			switchOldPage(){
233 | 				uni.navigateTo({
234 | 					url: '../index/index'
235 | 				})
236 | 			},
237 | 			/* 聚焦 */
238 | 			focusSend(val){
239 | 				this.isSending = val
240 | 			},
241 | 		}
242 | 	}
243 | </script>
244 | 
245 | <style lang="less" scoped>
246 | 	.flex-row{
247 | 		display: flex;
248 | 		flex-direction: row;
249 | 		align-items: center;
250 | 		justify-content: flex-start;
251 | 	}
252 | 	.flex-between{
253 | 		display: flex;
254 | 		flex-direction: row;
255 | 		align-items: center;
256 | 		justify-content: space-between;
257 | 	}
258 | 	.mqtt{
259 | 		width: 100vw;
260 | 		height: 100vh;
261 | 		background-color: #f8f8f8;
262 | 		.options{
263 | 			width: 100%;
264 | 			height: 316px;
265 | 			background-color: #ffffff;
266 | 			box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.1);
267 | 			font-size: 13px;
268 | 			color: #666666;
269 | 			.title{
270 | 				width: 710upx;
271 | 				margin: 0 auto;
272 | 				font-size: 15px;
273 | 				font-weight: 500;
274 | 				color: #333333;
275 | 				text-align: center;
276 | 				padding-bottom: 8px;
277 | 				display: flex;
278 | 				flex-direction: row;
279 | 				align-items: center;
280 | 				justify-content: space-between;
281 | 				.title-btn{
282 | 					font-size: 14px;
283 | 					font-weight: 400;
284 | 					color: #3F536E;
285 | 				}
286 | 			}
287 | 			.info{
288 | 				width: 710upx;
289 | 				margin: 0 auto;
290 | 				.bar{
291 | 					min-width: 160upx;
292 | 					margin-bottom: 8px;
293 | 					height: 30px;
294 | 					border-radius: 8px;
295 | 					box-shadow: inset 0px 0px 6px rgba(0, 0, 0, 0.1);
296 | 					border: 1px solid #cccccc;
297 | 					display: flex;
298 | 					flex-direction: row;
299 | 					align-items: center;
300 | 					justify-content: flex-start;
301 | 					font-size: 14px;
302 | 					.label{
303 | 						height: 30px;
304 | 						background-color: #f8f8f8;
305 | 						padding: 0px 10px;
306 | 						line-height: 30px;
307 | 						border-right: 1px solid #eeeeee;
308 | 						border-radius: 15px 0px 0px 15px;
309 | 					}
310 | 					.value{
311 | 						height: 30px;
312 | 						padding: 0px 12px;
313 | 						line-height: 30px;
314 | 						font-size: 14px;
315 | 						color: #3F536E;
316 | 					}
317 | 				}
318 | 				.btn{
319 | 					width: 30%;
320 | 					height: 32px;
321 | 					background-color: #3F536E;
322 | 					color: #ffffff;
323 | 					border-radius: 8px;
324 | 					margin-bottom: 8px;
325 | 					text-align: center;
326 | 					line-height: 32px;
327 | 				}
328 | 				.tips{
329 | 					width: 100%;
330 | 					height: 30px;
331 | 					margin-top: 6px;
332 | 					display: flex;
333 | 					flex-direction: row;
334 | 					align-items: center;
335 | 					position: relative;
336 | 					.tips-lab{
337 | 						font-size: 14px;
338 | 						color: #333333;
339 | 					}
340 | 					.tips-reset{
341 | 						font-size: 14px;
342 | 						font-weight: 500;
343 | 						color: #3F536E;
344 | 						position: absolute;
345 | 						right: 150px;
346 | 					}
347 | 					.tips-buffer{
348 | 						font-size: 14px;
349 | 						font-weight: 500;
350 | 						color: #3F536E;
351 | 						position: absolute;
352 | 						right: 70px;
353 | 					}
354 | 					.tips-clear{
355 | 						font-size: 14px;
356 | 						font-weight: 500;
357 | 						color: #3F536E;
358 | 						position: absolute;
359 | 						right: 0px;
360 | 					}
361 | 				}
362 | 			}
363 | 		}
364 | 		.logs{
365 | 			width: 100%;
366 | 			height: calc(100% - 396px);
367 | 			.logs-list{
368 | 				padding: 14upx 20upx;
369 | 				border-bottom: 1px solid #eeeeee;
370 | 				font-size: 13px;
371 | 				color: #3e3d3e;
372 | 				word-break: break-all;
373 | 			}
374 | 		}
375 | 		.feet{
376 | 			width: 100%;
377 | 			height: 80px;
378 | 			background-color: #ffffff;
379 | 			position: absolute;
380 | 			bottom: 0px;
381 | 			transition: all 0.35s;
382 | 			-webkit-transition: all 0.35s;
383 | 			&::before{
384 | 				position: absolute;
385 | 				content: '';
386 | 				top: 0px;
387 | 				background: rgba(0,0,0,0.2);
388 | 				width: 100%;
389 | 				height: 1px;
390 | 				transform: scaleY(0.5);
391 | 				transform-origin: 0 0;
392 | 				-webkit-transform: scaleY(0.5);
393 | 				-webkit-transform-origin: 0 0;
394 | 			}
395 | 			.inpbar{
396 | 				width: 710upx;
397 | 				height: 44px;
398 | 				background-color: #eeeeee;
399 | 				border-radius: 10px;
400 | 				position: absolute;
401 | 				left: 20upx;
402 | 				top: 10px;
403 | 				display: flex;
404 | 				flex-direction: row;
405 | 				align-items: center;
406 | 				justify-content: space-between;
407 | 				.img{
408 | 					width: 30px;
409 | 					height: 30px;
410 | 					margin-left: 12px;
411 | 				}
412 | 				.inp{
413 | 					width: calc(100% - 138px);
414 | 					height: 40px;
415 | 					margin: 0px 12px;
416 | 					font-size: 14px;
417 | 					color: #000000;
418 | 				}
419 | 				.send-dark{
420 | 					opacity: 0.7;
421 | 				}
422 | 				.send{
423 | 					width: 60px;
424 | 					height: 32px;
425 | 					background-color: #3F536E;
426 | 					border-radius: 6px;
427 | 					font-size: 14px;
428 | 					color: #ffffff;
429 | 					display: flex;
430 | 					align-items: center;
431 | 					justify-content: center;
432 | 					margin-right: 12px;
433 | 				}
434 | 			}
435 | 		}
436 | 	}
437 | </style>


--------------------------------------------------------------------------------
/pages/index/index.vue:
--------------------------------------------------------------------------------
  1 | <template>
  2 | 	<view class="mqtt-page">
  3 | 		<view class="book-bar">
  4 | 			<input class="inp-id" v-model="connectInfo.clientId" placeholder="clientId"></input>
  5 | 			<input class="inp-id" v-model="connectInfo.username" placeholder="username"></input>
  6 | 			<input class="inp-id" v-model="connectInfo.password" placeholder="password"></input>
  7 | 		</view>
  8 | 		<view class="book-bar">
  9 | 			<view class="btn-book" @click="startConnect">连接</view>
 10 | 			<view class="btn-book" @click="endConnect">终止</view>
 11 | 			<view class="btn-book" @click="reConnect">重连</view>
 12 | 			<view class="btn-qos" @click="connectInfo.clean = !connectInfo.clean">清除{{connectInfo.clean?' Yes':' No'}}</view>
 13 | 		</view>
 14 | 		<view class="book-bar">
 15 | 			<input class="inp-tpc" v-model="subscribeInfo.topic" placeholder="topic"></input>
 16 | 			<view class="btn-qos" @click="changeQos">Qos {{subscribeInfo.qos}}</view>
 17 | 			<view class="btn-book" @click="startSubscribe">订阅</view>
 18 | 			<view class="btn-book" @click="endSubscribe">取订</view>
 19 | 		</view>
 20 | 		<view class="book-bar">
 21 | 			<input class="inp-tpc" v-model="publishInfo.topic" placeholder="topic"></input>
 22 | 			<input class="inp-msg" v-model="publishInfo.message" placeholder="message"></input>
 23 | 			<view class="btn-book" @click="publish">发送</view>
 24 | 		</view>
 25 | 		<view class="tips-bar">
 26 | 			<text>操作日志：</text>
 27 | 			<view class="text-btn">
 28 | 				<text :style="isBuffer?'':'opacity:0.6'" @click="isBuffer=!isBuffer">打印Buffer</text>
 29 | 				<text @click="clearConfig">清空配置</text>
 30 | 				<text @click="cealrLog">清空日志</text>
 31 | 			</view>
 32 | 		</view>
 33 | 		<scroll-view scroll-y class="tips-panel">
 34 | 			<view class="panel-list" v-for="(item,index) in logs" :key="index">
 35 | 				{{item.option + item.log}}
 36 | 			</view>
 37 | 		</scroll-view>
 38 | 	</view>
 39 | </template>
 40 | 
 41 | <script>
 42 | 	export default {
 43 | 		data() {
 44 | 			return {
 45 | 				connectInfo: {
 46 | 					clientId: 'App_0109',
 47 | 					username: '',
 48 | 					password: '',
 49 | 					clean: false
 50 | 				},
 51 | 				subscribeInfo: {
 52 | 					topic: '',
 53 | 					qos: 1,
 54 | 				},
 55 | 				publishInfo: {
 56 | 					topic: '',
 57 | 					message: ''
 58 | 				},
 59 | 				isBuffer: false,
 60 | 				logs: [
 61 | 					{option:'环境配置：', log:'配置成功'},
 62 | 				]
 63 | 			}
 64 | 		},
 65 | 		onLoad() {
 66 | 			
 67 | 		},
 68 | 		methods: {
 69 | 			/* 连接 */
 70 | 			async startConnect(){
 71 | 				var _this = this
 72 | 				let opts = {
 73 | 					url: 'wx://你的通讯地址:你的通讯端口号/mqtt',
 74 | 					clientId: this.connectInfo.clientId,
 75 | 					username: this.connectInfo.username,
 76 | 					password: this.connectInfo.password,
 77 | 					clean: this.connectInfo.clean
 78 | 				}
 79 | 				var client = await this.$mqttTool.connect(opts);
 80 | 				client.on('connect', function(res) {
 81 | 					_this.logs.unshift({option:'mqtt：', log:'连接成功'})
 82 | 				})
 83 | 				client.on('reconnect', function(res) {
 84 | 					_this.logs.unshift({option:'mqtt：', log:'重新连接'})
 85 | 				})
 86 | 				client.on('error', function(res) {
 87 | 					_this.logs.unshift({option:'mqtt：', log:'连接错误'})
 88 | 				})
 89 | 				client.on('close', function(res) {
 90 | 					_this.logs.unshift({option:'mqtt：', log:'关闭成功'})
 91 | 				})
 92 | 				client.on('message', function(topic, message, buffer) {
 93 | 					if(_this.isBuffer){
 94 | 						_this.logs.unshift({option:topic+' buffer：', log: JSON.stringify(buffer)})
 95 | 					}
 96 | 					_this.logs.unshift({option:topic+' message：', log: message.toString()})
 97 | 				})
 98 | 			},
 99 | 			/* 终止连接 */
100 | 			endConnect(){
101 | 				var _this = this
102 | 				this.$mqttTool.end().then(res =>{
103 | 					_this.logs.unshift({option:'终止：', log:res})
104 | 				})
105 | 			},
106 | 			/* 重新连接 */
107 | 			reConnect(){
108 | 				var _this = this
109 | 				this.$mqttTool.reconnect().then(res =>{
110 | 					_this.logs.unshift({option:'重连：', log:res})
111 | 				})
112 | 			},
113 | 			/* 更改Qos */
114 | 			changeQos(){
115 | 				var _this = this
116 | 				if(this.subscribeInfo.qos >= 2){
117 | 					this.subscribeInfo.qos = 0
118 | 					this.logs.unshift({option:'Qos：', log:this.subscribeInfo.qos})
119 | 					this.startSubscribe();
120 | 				}else{
121 | 					this.subscribeInfo.qos += 1
122 | 					this.logs.unshift({option:'Qos：', log:this.subscribeInfo.qos})
123 | 					this.startSubscribe();
124 | 				}
125 | 			},
126 | 			/* 订阅 */
127 | 			startSubscribe(){
128 | 				if(this.subscribeInfo.topic == ''){
129 | 					uni.showToast({
130 | 						icon: 'none',
131 | 						title: '输入topic'
132 | 					})
133 | 					return;
134 | 				}
135 | 				var _this = this
136 | 				let opts = {
137 | 					topic: this.subscribeInfo.topic,
138 | 					qos: this.subscribeInfo.qos,
139 | 				}
140 | 				this.$mqttTool.subscribe(opts).then(res =>{
141 | 					_this.logs.unshift({option:'订阅' + opts.topic + '：', log:res})
142 | 				})
143 | 			},
144 | 			/* 取消订阅 */
145 | 			endSubscribe(){
146 | 				var _this = this
147 | 				let opts = {
148 | 					topic: this.subscribeInfo.topic
149 | 				}
150 | 				this.$mqttTool.unsubscribe(opts).then(res =>{
151 | 					_this.logs.unshift({option:'取消订阅：', log:res})
152 | 				})
153 | 			},
154 | 			/* 发送消息 */
155 | 			publish(){
156 | 				var _this = this
157 | 				let opts = {
158 | 					topic: this.publishInfo.topic,
159 | 					message: this.publishInfo.message,
160 | 				}
161 | 				this.$mqttTool.publish(opts).then(res =>{
162 | 					_this.logs.unshift({option:'发送：', log:res})
163 | 				})
164 | 			},
165 | 			/* 清空配置 */
166 | 			clearConfig(){
167 | 				this.endSubscribe();
168 | 				this.connectInfo = {
169 | 					clientId: '',
170 | 					username: '',
171 | 					password: ''
172 | 				}
173 | 				this.subscribeInfo = {
174 | 					topic: '',
175 | 					qos: 1,
176 | 				}
177 | 				this.publishInfo = {
178 | 					topic: '',
179 | 					message: ''
180 | 				}
181 | 				this.isBuffer = false
182 | 			},
183 | 			/* 清空日志 */
184 | 			cealrLog(){
185 | 				this.logs = [{option:'环境配置：', log:'配置成功'}]
186 | 			}
187 | 		}
188 | 	}
189 | </script>
190 | 
191 | <style lang="less" scoped>
192 | 	.mqtt-page {
193 | 		width: 100%;
194 | 		height: 100%;
195 | 		display: flex;
196 | 		flex-direction: column;
197 | 		align-items: center;
198 | 		justify-content: center;
199 | 		.book-bar{
200 | 			width: 710upx;
201 | 			height: 70upx;
202 | 			margin: 0 auto 20upx auto;
203 | 			display: flex;
204 | 			flex-direction: row;
205 | 			align-items: center;
206 | 			justify-content: flex-start;
207 | 			.btn-book{
208 | 				width: 150upx;
209 | 				height: 70upx;
210 | 				border-radius: 10px;
211 | 				background-color: #3F536E;
212 | 				text-align: center;
213 | 				line-height: 70upx;
214 | 				color: #ffffff;
215 | 				margin-right: 20upx;
216 | 			}
217 | 			.btn-qos{
218 | 				width: 150upx;
219 | 				height: 70upx;
220 | 				border-radius: 10px;
221 | 				background-color: #4c6b99;
222 | 				text-align: center;
223 | 				line-height: 70upx;
224 | 				color: #ffffff;
225 | 				margin-right: 20upx;
226 | 			}
227 | 			.inp-id{
228 | 				width: 160upx;
229 | 				height: 60upx;
230 | 				border-radius: 10px;
231 | 				border: 2px solid #3F536E;
232 | 				color: #3F536E;
233 | 				padding: 0upx 20upx;
234 | 				margin-right: 20upx;
235 | 			}
236 | 			.inp-tpc{
237 | 				width: 120upx;
238 | 				height: 60upx;
239 | 				border-radius: 10px;
240 | 				border: 2px solid #3F536E;
241 | 				color: #3F536E;
242 | 				padding: 0upx 20upx;
243 | 				margin-right: 20upx;
244 | 			}
245 | 			.inp-msg{
246 | 				width: 260upx;
247 | 				height: 60upx;
248 | 				border-radius: 10px;
249 | 				border: 2px solid #3F536E;
250 | 				color: #3F536E;
251 | 				padding: 0upx 20upx;
252 | 				margin-right: 20upx;
253 | 			}
254 | 		}
255 | 		.tips-bar{
256 | 			width: 710upx;
257 | 			height: 30upx;
258 | 			margin: 20upx auto;
259 | 			display: flex;
260 | 			flex-direction: row;
261 | 			align-items: center;
262 | 			justify-content: space-between;
263 | 			font-size: 14px;
264 | 			.text-btn{
265 | 				font-size: 12px;
266 | 				width: 320upx;
267 | 				display: flex;
268 | 				align-items: center;
269 | 				justify-content: space-between;
270 | 				color: #3F536E;
271 | 			}
272 | 		}
273 | 		.tips-panel{
274 | 			width: 100%;
275 | 			margin: 0 auto;
276 | 			height: calc(100vh - 430upx);
277 | 			font-size: 13px;
278 | 			color: #3e3d3e;
279 | 			word-break: break-all;
280 | 			.panel-list{
281 | 				padding: 10upx 20upx;
282 | 				border-bottom: 1px solid #eeeeee;
283 | 			}
284 | 		}
285 | 	}
286 | </style>
287 | 


--------------------------------------------------------------------------------
/static/logo.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/nameHulk/MQTT-uniapp/63159e5007cc1abfc86fc21782db3654a9579ab6/static/logo.png


--------------------------------------------------------------------------------
/uni.scss:
--------------------------------------------------------------------------------
 1 | /**
 2 |  * 这里是uni-app内置的常用样式变量
 3 |  *
 4 |  * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
 5 |  * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
 6 |  *
 7 |  */
 8 | 
 9 | /**
10 |  * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
11 |  *
12 |  * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
13 |  */
14 | 
15 | /* 颜色变量 */
16 | 
17 | /* 行为相关颜色 */
18 | $uni-color-primary: #007aff;
19 | $uni-color-success: #4cd964;
20 | $uni-color-warning: #f0ad4e;
21 | $uni-color-error: #dd524d;
22 | 
23 | /* 文字基本颜色 */
24 | $uni-text-color:#333;//基本色
25 | $uni-text-color-inverse:#fff;//反色
26 | $uni-text-color-grey:#999;//辅助灰色，如加载更多的提示信息
27 | $uni-text-color-placeholder: #808080;
28 | $uni-text-color-disable:#c0c0c0;
29 | 
30 | /* 背景颜色 */
31 | $uni-bg-color:#ffffff;
32 | $uni-bg-color-grey:#f8f8f8;
33 | $uni-bg-color-hover:#f1f1f1;//点击状态颜色
34 | $uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
35 | 
36 | /* 边框颜色 */
37 | $uni-border-color:#c8c7cc;
38 | 
39 | /* 尺寸变量 */
40 | 
41 | /* 文字尺寸 */
42 | $uni-font-size-sm:12px;
43 | $uni-font-size-base:14px;
44 | $uni-font-size-lg:16;
45 | 
46 | /* 图片尺寸 */
47 | $uni-img-size-sm:20px;
48 | $uni-img-size-base:26px;
49 | $uni-img-size-lg:40px;
50 | 
51 | /* Border Radius */
52 | $uni-border-radius-sm: 2px;
53 | $uni-border-radius-base: 3px;
54 | $uni-border-radius-lg: 6px;
55 | $uni-border-radius-circle: 50%;
56 | 
57 | /* 水平间距 */
58 | $uni-spacing-row-sm: 5px;
59 | $uni-spacing-row-base: 10px;
60 | $uni-spacing-row-lg: 15px;
61 | 
62 | /* 垂直间距 */
63 | $uni-spacing-col-sm: 4px;
64 | $uni-spacing-col-base: 8px;
65 | $uni-spacing-col-lg: 12px;
66 | 
67 | /* 透明度 */
68 | $uni-opacity-disabled: 0.3; // 组件禁用态的透明度
69 | 
70 | /* 文章场景相关 */
71 | $uni-color-title: #2C405A; // 文章标题颜色
72 | $uni-font-size-title:20px;
73 | $uni-color-subtitle: #555555; // 二级标题颜色
74 | $uni-font-size-subtitle:26px;
75 | $uni-color-paragraph: #3F536E; // 文章段落颜色
76 | $uni-font-size-paragraph:15px;
77 | 


--------------------------------------------------------------------------------