前言

自己想折腾一下消息中间，需要知道简单学一下RabbitMQ（java），RabbitMQ不是只是java可以使用。

一 RabbitMQ五分钟简单学习

<一> 名词解释：

  • 生产者（Producer）：发送消息的应用。
  • 消费者（Consumer）：接收消息的应用。
  • 队列（Queue）：存储消息的缓存。
  • 消息（Message）：由生产者通过RabbitMQ发送给消费者的信息。
  • 连接（Connection）：连接RabbitMQ和应用服务器的TCP连接。
  • 通道（Channel）：连接里的一个虚拟通道。当你通过消息队列发送或者接收消息时，这个操作都是通过通道进行的。
  • 交换机（Exchange）：交换机负责从生产者那里接收消息，并根据交换类型分发到对应的消息列队里。要实现消息的接收，一个队列必须到绑定一个交换机。
  • 绑定（Binding）：绑定是队列和交换机的一个关联连接。
  • 路由键（Routing Key）：路由键是供交换机查看并根据键来决定如何分发消息到列队的一个键。路由键可以说是消息的目的地址。

<二> 工作流程：

图片说明
粗略看一下OK了，画高深，我不是怕你看不懂，我怕我看不懂

<三> 四种交换机类型：

  • 直接（Direct）：直接交换机通过消息上的路由键直接对消息进行分发。
  • 扇出（Fanout）：一个扇出交换机会将消息发送到所有和它进行绑定的队列上。
  • 主题（Topic）：这个交换机会将路由键和绑定上的模式进行通配符匹配。
  • 消息头（Headers）：消息头交换机使用消息头的属性进行消息路由。

<四> Java代码实现：

  1. 添加的依赖
    <dependency>
   <groupId>org.springframework.boot</groupId>
   <artifactId>spring-boot-starter-amqp</artifactId>
</dependency>
  2. 目录结构
    图片说明
    config/定义了四种交换机类型
  3. 给源码：
    链接：https://pan.baidu.com/s/1c5o89G8CQJaEVqmjUVY7IA
    提取码：g655
    我把消费者和生产者规制到一个maven项目中，这两个模块可以抽离。

二 CentOS7安装RabbitMQ

参考文档：https://blog.csdn.net/qq_39007083/article/details/104977840
安装的步骤可以跟着他的博文来做后面还是需要追加步骤的

#安装页面客户端
[root@localhost /]# rabbitmq-plugins enable rabbitmq_management
[root@localhost /]# cd  /usr/local/rabbitmq_server-3.8.3/ebin
[root@localhost /]# vim rabbit.app
39行 替换成 {loopback_users, []}
wq!

http://你的ip地址:15672/
我省略很多重要操作，在引入的博文中已经解释了

三 Vue-element-admin

安装vue ，需要nodejs，这都没有，马上右上角关闭，拜拜

# 克隆项目
git clone https://github.com/PanJiaChen/vue-element-admin.git

# 进入项目目录
cd vue-element-admin

# 安装依赖
npm install

# 建议不要用 cnpm 安装 会有各种诡异的bug 可以通过如下操作解决 npm ***慢的问题
npm install --registry=https://registry.npm.taobao.org

# 本地开发 启动项目
npm run dev

安装stompjs插件

图片说明
上面安装后，必须要检查这个15674 这是实时通信的端口
如果没有

#执行这两个命令
rabbitmq-plugins enable rabbitmq_web_stomp
rabbitmq-plugins enable rabbitmq_web_stomp_examples
重启RabbitMQ

这边需要安装stompjs插件
1、doc进入vue目录下，
2、npm install stompjs
3、可能会出现你的npm未登录，这时候就继续执行
4、npm config set registry https://registry.npmjs.org
5、npm adduser
6、npm login
7、exit
8、重新打开dos进入vue路径下，重复第2步即可

在vue-element-admin\src\utils 新建mqtt.js

export const MQTT_SERVICE = 'ws://ip:15674/ws' // mqtt服务地址
export const MQTT_TOPIC = '队列名称' // 订阅频道
export const MQTT_USERNAME = 'guest' // mqtt连接用户名
export const MQTT_PASSWORD = 'guest' // mqtt连接密码

这是我随便在页面写的

<template>
  <div class="dashboard-container">
    <component :is="currentRole" />
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import adminDashboard from './admin'
import editorDashboard from './editor'
**import Stomp from 'stompjs'**
**import { MQTT_SERVICE, MQTT_TOPIC, MQTT_USERNAME, MQTT_PASSWORD } from **'@/utils/mqtt'

export default {
  name: 'Dashboard',
  components: { adminDashboard, editorDashboard },
  data() {
    return {
      client: Stomp.client(MQTT_SERVICE),
      currentRole: 'adminDashboard'
    }
  },
  computed: {
    ...mapGetters([
      'roles'
    ])
  },
  created() {
    this.connect()
    if (!this.roles.includes('admin')) {
      this.currentRole = 'editorDashboard'
    }
  },
  methods: {
    onConnected: function(frame) {
      // 订阅频道
      const topic = MQTT_TOPIC
      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)
    }
  }
}
</script>

图片说明

OK