vue项目集成stomp.js接收artemis消息推送

这里写目录标题

1.安装依赖
2. 新建连接需要的配置文件linkparam.js文件
3.在所需要的vue页面引入
4.在组件中应用stomp.js
5. 创建成功

1.安装依赖

npm install stompjs
npm install --save net

2. 新建连接需要的配置文件linkparam.js文件

/*** 配置文件，记录系统中固定的参数*/
export const MQTT_SERVICE = 'ws://127.0.0.1:61623/stomp' // mqtt服务地址
export const MQTT_USERNAME = 'admin' // mqtt连接用户名
export const MQTT_PASSWORD = 'admin' // mqtt连接密码

3.在所需要的vue页面引入

import Stomp from 'stompjs'
---在linkparam.js配置文件中配置mqtt的服务端地址，账号等信息
import { MQTT_SERVICE, MQTT_USERNAME, MQTT_PASSWORD } from '@/config/linkparam.js'

4.在组件中应用stomp.js

data () {return {client: Stomp.client(MQTT_SERVICE)}},created () {// 调用连接的方法this.connect()},methods: {// 连接connect: function () {---初始化mqtt客户端，并连接mqtt服务var headers = {'login': MQTT_USERNAME,'passcode': MQTT_PASSWORD,}this.client.connect(headers, this.onConnected, this.onFailed)},// 连接成功，onConnected: function (frame) {console.log('Connected: ' + frame)var topic = '/topic/AllCustomer' // 订阅频道this.client.subscribe(topic, this.responseCallback, this.onFailed) },// 连接失败onFailed: function (frame) {console.log('Failed: ' + frame)},responseCallback: function (frame) {console.log('responseCallback msg=>' + frame.body)---接收消息},},beforeDestoryed(){this.client.disconnect()}
}

5. 创建成功

注意：
不要忘记了写发布的代码，上图中只是简单的订阅了。

// 这只是一个demo，send()方法里的根据你具体需要的参数决定
this.client.send("topic-"+item.id,{},id +"|"+item.name)

vue项目集成stomp.js接收artemis消息推送相关推荐

js基于GoEasy消息推送
GoEasy介绍 GoEasy专注于服务器与浏览器,浏览器与浏览器之间消息推送,完美兼容世界上的绝大多数浏览器,包括IE6, IE7之类的非常古老的浏览器.支持Uniapp,各种小程序,react,v ...
node.js解析微信消息推送xml格式加密的消息
之前写过一个解密json格式加密的,我以为xml的和json的差不多,是上上个星期五吧,我的同事也是在做微信公众号里面的消息推送解密,发现好像只能使用xml加密格式的发送到服务器,我们去年也做过企业微 ...
持续集成之群聊机器人消息推送：钉钉 vs 企业微信
企业微信和钉钉都有面向群的消息推送机器人,两者的使用非常相近,也有一些细节上的特性的区别,这篇文章将结合前面的使用示例进行总结. 使用方式不同点企业微信:先创建群,然后在群中添加机器人,可添加多个 ...
vue项目使用webSocket前后端建立连接推送消息
<!DOCTYPE html> <html> <head><meta charset="utf-8"><title>we ...
微信三方开发平台开发模式下接收事件消息推送
了解更多内容可观看我的学院视频
SpringBoot如何集成MQTT消息推送
1.需求分析近期笔者项目需要用到mqtt实现消息推送,笔者选择emq作为mqtt服务器载体,上篇笔者讲解了如何在linux中安装mqtt服务:https://blog.csdn.net/zhangx ...
Worktile中的实时消息推送服务实现
在团队协同工具worktile的使用过程中,你会发现无论是右上角的消息通知,还是在任务面板中拖动任务,还有用户的在线状态,都是实时刷新.Worktile中的推送服务是采用的是基于xmpp协议.erla ...
Worktile 中百万级实时消息推送服务的实现
Worktile 中百万级实时消息推送服务的实现转自:http://www.360doc.com/content/15/0907/19/1073512_497529854.shtml 这是一个创建于 ...
Android 消息推送框架详解
消息推送的概念消息推送,是指绕过手机运营商,通过TCP/IP网络传输的方式,向应用程序发送数据,这些数据包括简单的文本,图片,或者其他多媒体数据. 与手机运营商发送短信的方式相比,消息推送普及性和可 ...

vue项目集成stomp.js接收artemis消息推送

这里写目录标题

1.安装依赖

2. 新建连接需要的配置文件linkparam.js文件

3.在所需要的vue页面引入

4.在组件中应用stomp.js

5. 创建成功

vue项目集成stomp.js接收artemis消息推送相关推荐

最新文章

热门文章