前期准备工作:安装完rabbitMq后需要启动stomp插件：
rabbitmq-plugins enable rabbitmq_web_stomp rabbitmq_stomp rabbitmq_web_stomp_examples
讯享网打开mq查看stomp服务是否配置成功
1.install stomps 依赖
讯享网npm install stomps2.script
<script> import Stomp from 'stompjs'; import { MQTT_SERVICE, MQTT_USERNAME, MQTT_PASSWORD,MQTT_host,MQTT_topic } from '@/utils/mqtt' export default { name: "index", data() { return{ client: Stomp.client(MQTT_SERVICE) } }, mounted(){ this.connect(); }, methods:{ onConnected:function(){ //订阅的频道 const topic = MQTT_topic; this.client.subscribe(topic,this.responseCallback,this.onFailed); }, onFailed:function(msg){ console.log("MQ Failed:" + msg); }, //成功时的回调函数 responseCallback:function(msg){ //接收消息的处理 console.log("MQ msg=>" + msg.body); }, //连接 connect:function(){ const headers = { login: MQTT_USERNAME, password: MQTT_PASSWORD }; this.client.connect(headers,this.onConnected,this.onFailed); }, }, watch:{ } } </script>3.mtt.js
讯享网export const MQTT_SERVICE = 'ws://你的ip:15674/ws' // mqtt服务地址 export const MQTT_USERNAME = 'admin' // mqtt连接用户名 export const MQTT_PASSWORD = 'admin' // mqtt连接密码 export const MQTT_topic = '/queue/demand.msg'//主题
2025年Vue 连接rabbitmq实现消息实时通信
Vue 连接rabbitmq实现消息实时通信前期准备工作 安装完 rabbitMq 后需要启动 stomp 插件 rabbitmq plugins enable rabbitmq web stomp rabbitmq stomp rabbitmq web stomp examples 打开 mq 查看 stomp 服务是否配置成功 1 install stomps 依赖 npm install
大家好，我是讯享网，很高兴认识大家。
2025年Kanzi Shader入门
上一篇
2025-02-23 10:19
2025年小学阅读方法六种_小学语文阅读理解的12条方法技巧
下一篇
2025-01-17 20:27
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/118466.html