vue 中如何使用rabbitMQ 監聽消息隊列

一、先安裝依賴插件

// 先安裝stompjs
npm install stompjs

二、組件中的使用

import Stomp from "stompjs";
import { MQTT_SERVICE, MQTT_USERNAME, MQTT_PASSWORD } from "../config/mqtt";

config文件中的mqtt.js內容：

export const MQTT_SERVICE = 'ws://25.30.9.137:15674/ws' // mqtt服務地址
export const MQTT_USERNAME = 'guest' // mqtt連接用戶名
export const MQTT_PASSWORD = 'guest' // mqtt連接密碼
 

組件中代碼：

export default {
    data() {
        return {
            client: Stomp.client(MQTT_SERVICE)
        };
      },
      created() {
        this.connect();
    },
    methods: {
        onConnected: function(frame) {
          //訂閱頻道
          const topic = "/exchange/BaseDataExchange/routeData.alarm.65";
          this.client.subscribe(topic, this.responseCallback, this.onFailed);
        },
        onFailed: function(frame) {
          console.log("MQ Failed: " + frame);
        },
        responseCallback: function(frame) {
          console.log("MQ msg=>" + frame.body);
          //接收消息處理
        },
        connect: function() {
          //初始化mqtt客戶端，並連接mqtt服務
          const headers = {
            login: MQTT_USERNAME,
            passcode: MQTT_PASSWORD
          };
          this.client.connect(headers, this.onConnected, this.onFailed);
        }
    }
};

 

https://blog.csdn.net/laipengfei19/article/details/93747608 親測有效