电脑知识|欧美黑人一区二区三区|软件|欧美黑人一级爽快片淫片高清|系统|欧美黑人狂野猛交老妇|数据库|服务器|编程开发|网络运营|知识问答|技术教程文章 - 好吧啦网

您的位置:首頁技術(shù)文章
文章詳情頁

vue中利用mqtt服務(wù)端實(shí)現(xiàn)即時通訊的步驟記錄

瀏覽:86日期:2022-09-28 13:52:47
MQTT協(xié)議

MQTT(Message Queuing Telemetry Transport,消息隊(duì)列遙測傳輸)是IBM開發(fā)的一個即時通訊協(xié)議,有可能成為物聯(lián)網(wǎng)的重要組成部分。該協(xié)議支持所有平臺,幾乎可以把所有聯(lián)網(wǎng)物品和外部連接起來,被用來當(dāng)做傳感器和制動器(比如通過Twitter讓房屋聯(lián)網(wǎng))的通信協(xié)議。

MQTT是輕量級基于代理的發(fā)布/訂閱的消息傳輸協(xié)議,它可以通過很少的代碼和帶寬和遠(yuǎn)程設(shè)備連接。例如通過衛(wèi)星和代理連接,通過撥號和醫(yī)療保健提供者連接,以及在一些自動化或小型設(shè)備上,而且由于小巧,省電,協(xié)議開銷小和能高效的向一和多個接收者傳遞信息,故同樣適用于稱動應(yīng)用設(shè)備上。

vue利用mqtt服務(wù)端實(shí)現(xiàn)即時通訊

在大部分項(xiàng)目中,前后端交互只是前端請求后端的接口,拿到數(shù)據(jù)后再處理,前段時間我手上的一個項(xiàng)目需要用到mqtt,使用后覺得真神奇,只需要訂閱就能實(shí)時獲取到數(shù)據(jù),廢話不多說,妹妹給你們上步驟!

1.在vue項(xiàng)目中安裝mqtt.js

npm install mqtt --save

2.在項(xiàng)目的main.js或者在需要用到的vue頁面上引用

import mqtt from ’mqtt’

3.在vue頁面的data中定義一個client對象,方便后面使用

client: {}

ok,接下來就是重點(diǎn)了,首先我們得連接mqtt,連接mqtt的方法有個回調(diào)函數(shù),我接下來就把訂閱的方法寫在連接成功后的回調(diào)里,這樣能保證不出錯,上代碼!

4.連接mqtt并訂閱

//連接服務(wù)器 connect() { let options = {username: 'xxx',password: 'xxxx',cleanSession : false,keepAlive:60,clientId: ’mqttjs_’ + Math.random().toString(16).substr(2, 8),connectTimeout: 4000 } this.client = mqtt.connect(’ws://192.168.xxx.xx:8083/mqtt’,options); this.client.on('connect', (e)=>{console.log('成功連接服務(wù)器:',e);//訂閱三個名叫’top/#’, ’three/#’和’#’的主題this.client.subscribe([’top/#’, ’three/#’, ’#’], { qos: 1 }, (err)=> { if (!err) { console.log('訂閱成功'); //向主題叫“pubtop”發(fā)布一則內(nèi)容為’hello,this is a nice day!’的消息 this.publish('pubtop', ’hello,this is a nice day!’) } else { console.log(’消息訂閱失??!’) }}); }); //重新連接 this.reconnect() //是否已經(jīng)斷開連接 this.mqttError() //監(jiān)聽獲取信息 this.getMessage() }

5.發(fā)布消息方法

//發(fā)布消息@topic主題 @message發(fā)布內(nèi)容 publish(topic,message) { if (!this.client.connected) {console.log(’客戶端未連接’)return } this.client.publish(topic,message,{qos: 1},(err) => {if(!err) { console.log(’主題為’+topic+ '發(fā)布成功')} }) }

6.監(jiān)聽并接收上面訂閱的三個主題的信息

//監(jiān)聽接收消息 getMessage() { this.client.on('message', (topic, message) => {if(message) { console.log(’收到來著’,topic,’的信息’,message.toString()) const res = JSON.parse(message.toString()) //console.log(res, ’res’) switch(topic) { case ’top/#’ : this.msg = res break; case ’three/#’ : this.msg = res break; case ’three/#’ : this.msg = res break; default: return this.msg = res } this.msg = message} }); },

7.監(jiān)聽服務(wù)器是否連接失敗

//監(jiān)聽服務(wù)器是否連接失敗 mqttError() { this.client.on(’error’,(error) => {console.log(’連接失?。骸?error)this.client.end() }) },

8.取消訂閱

//取消訂閱 unsubscribe() { this.client.unsubscribe(this.mtopic, (error)=> {console.log(’主題為’+ this.mtopic+’取消訂閱成功’,error) }) },

9.斷開連接

//斷開連接 unconnect() { this.client.end() this.client = null console.log(’服務(wù)器已斷開連接!’) },

10.監(jiān)聽服務(wù)器重新連接

//監(jiān)聽服務(wù)器重新連接 reconnect() { this.client.on(’reconnect’, (error) => { console.log(’正在重連:’, error) }); },總結(jié)

到此這篇關(guān)于vue中利用mqtt服務(wù)端實(shí)現(xiàn)即時通訊的文章就介紹到這了,更多相關(guān)vue用mqtt即時通訊內(nèi)容請搜索好吧啦網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持好吧啦網(wǎng)!

標(biāo)簽: Vue
相關(guān)文章:
主站蜘蛛池模板: 数显水浴恒温振荡器-分液漏斗萃取振荡器-常州市凯航仪器有限公司 | 双齿辊破碎机-大型狼牙破碎机视频-对辊破碎机价格/型号图片-金联机械设备生产厂家 | 旋振筛_不锈钢旋振筛_气旋筛_旋振筛厂家—新乡市大汉振动机械有限公司 | 福兰德PVC地板|PVC塑胶地板|PVC运动地板|PVC商用地板-中国弹性地板系统专业解决方案领先供应商! 福建成考网-福建成人高考网 | ORP控制器_ORP电极价格-上优泰百科 | 琉璃瓦-琉璃瓦厂家-安徽盛阳新型建材科技有限公司 | 德国EA可编程直流电源_电子负载,中国台湾固纬直流电源_交流电源-苏州展文电子科技有限公司 | 医疗仪器模块 健康一体机 多参数监护仪 智慧医疗仪器方案定制 血氧监护 心电监护 -朗锐慧康 | 船用锚链|专业锚链生产厂家|安徽亚太锚链制造有限公司 | 合肥白癜风医院_合肥治疗白癜风医院_合肥看白癜风医院哪家好_合肥华研白癜风医院 | 济南玻璃安装_济南玻璃门_济南感应门_济南玻璃隔断_济南玻璃门维修_济南镜片安装_济南肯德基门_济南高隔间-济南凯轩鹏宇玻璃有限公司 | 深圳高新投三江工业消防解决方案提供厂家_服务商_园区智慧消防_储能消防解决方案服务商_高新投三江 | 热回收盐水机组-反应釜冷水机组-高低温冷水机组-北京蓝海神骏科技有限公司 | 无线对讲-无线对讲系统解决方案-重庆畅博通信| 蓝莓施肥机,智能施肥机,自动施肥机,水肥一体化项目,水肥一体机厂家,小型施肥机,圣大节水,滴灌施工方案,山东圣大节水科技有限公司官网17864474793 | b2b网站大全,b2b网站排名,找b2b网站就上地球网 | 档案密集柜_手动密集柜_智能密集柜_内蒙古档案密集柜-盛隆柜业内蒙古密集柜直销中心 | 大型工业风扇_工业大风扇_大吊扇_厂房车间降温-合昌大风扇 | 杭州代理记账费用-公司注销需要多久-公司变更监事_杭州福道财务管理咨询有限公司 | 恒温油槽-恒温水槽-低温恒温槽厂家-宁波科麦仪器有限公司 | 上海皓越真空设备有限公司官网-真空炉-真空热压烧结炉-sps放电等离子烧结炉 | 橡胶弹簧|复合弹簧|橡胶球|振动筛配件-新乡市永鑫橡胶厂 | 南京泽朗生物科技有限公司 | 拖鞋定制厂家-品牌拖鞋代加工厂-振扬实业中国高端拖鞋大型制造商 | WF2户外三防照明配电箱-BXD8050防爆防腐配电箱-浙江沃川防爆电气有限公司 | 机制砂选粉机_砂石选粉机厂家-盐城市助成粉磨科技有限公司 | 合肥升降机-合肥升降货梯-安徽升降平台「厂家直销」-安徽鼎升自动化科技有限公司 | 气密性检测仪_气密性检测设备_防水测试仪_密封测试仪-岳信仪器 | 深圳市索富通实业有限公司-可燃气体报警器 | 可燃气体探测器 | 气体检测仪 | 工业PH计|工业ph酸度计|在线PH计价格-合肥卓尔仪器仪表有限公司 济南画室培训-美术高考培训-山东艺霖艺术培训画室 | 400电话_400电话申请_888元包年_400电话办理服务中心_400VIP网 | 桥架-槽式电缆桥架-镀锌桥架-托盘式桥架 - 上海亮族电缆桥架制造有限公司 | 智能风向风速仪,风速告警仪,数字温湿仪,综合气象仪(气象五要素)-上海风云气象仪器有限公司 | 北京工业设计公司-产品外观设计-产品设计公司-千策良品工业设计 北京翻译公司-专业合同翻译-医学标书翻译收费标准-慕迪灵 | 杰恒蠕动泵-蠕动泵专业厂家-19年专注蠕动泵 | 卷筒电缆-拖链电缆-特种柔性扁平电缆定制厂家「上海缆胜」 | 震动筛选机|震动分筛机|筛粉机|振筛机|振荡筛-振动筛分设备专业生产厂家高服机械 | 玻璃瓶厂家_酱菜瓶厂家_饮料瓶厂家_酒瓶厂家_玻璃杯厂家_徐州东明玻璃制品有限公司 | 一体式钢筋扫描仪-楼板测厚仪-裂缝检测仪-泰仕特(北京) | 信阳网站建设专家-信阳时代网联-【信阳网站建设百度推广优质服务提供商】信阳网站建设|信阳网络公司|信阳网络营销推广 | 氧化铁红厂家-淄博宗昂化工 |