当前位置：首页 > 文章列表 > 文章 > 前端 > JS与Spring消息队列集成教程

JS与Spring消息队列集成教程

2025-11-17 22:45:25 0浏览收藏

一分耕耘，一分收获！既然打开了这篇文章《JS与Spring消息队列集成方法详解》，就坚持看下去吧！文中内容包含等等知识点...希望你能在阅读本文后，能真真实实学到知识或者帮你解决心中的疑惑，也欢迎大佬或者新人朋友们多留言评论，多给建议！谢谢！

Spring通过REST API和WebSocket作为中间层，实现JavaScript与RabbitMQ的消息交互：1. Spring集成RabbitMQ并提供POST接口接收前端请求；2. JavaScript调用该接口发送消息，Spring将其转发至队列；3. 消费者处理后通过WebSocket将结果推送给前端，完成双向通信。

JS如何与Spring消息队列集成_JavaScript与Spring消息队列集成的实现方法

JavaScript本身运行在浏览器或Node.js环境中，无法直接与Spring框架的消息队列（如RabbitMQ、Kafka）进行通信。但可以通过中间层实现前后端协同处理消息。常见的做法是：Spring作为后端服务使用消息队列进行异步通信，前端JavaScript通过HTTP或WebSocket与Spring后端交互，间接完成消息的发送与接收。

1. Spring集成消息队列（以RabbitMQ为例）

在Spring Boot项目中集成RabbitMQ，用于接收和发送消息：

添加依赖（Maven）：

org.springframework.boot
spring-boot-starter-amqp

配置application.yml：

spring:
  rabbitmq:
    host: localhost
    port: 5672
    username: guest
    password: guest

创建消息生产者：

@Service
public class MessageProducer {
  @Autowired
  private RabbitTemplate rabbitTemplate;

  public void sendMessage(String message) {
    rabbitTemplate.convertAndSend("myQueue", message);
  }
}

创建消息消费者：

@Service
public class MessageConsumer {
  @RabbitListener(queues = "myQueue")
  public void receive(String message) {
    System.out.println("Received: " + message);
  }
}

2. 提供REST API供JavaScript调用

Spring提供一个REST接口，供前端JavaScript发送消息请求：

@RestController
public class MessageController {
  @Autowired
  private MessageProducer messageProducer;

  @PostMapping("/send")
  public ResponseEntity sendMessage(@RequestBody Map payload) {
    messageProducer.sendMessage(payload.get("msg"));
    return ResponseEntity.ok("Message sent!");
  }
}

3. JavaScript通过HTTP发送消息

前端JavaScript通过fetch调用Spring的REST接口：

async function sendMsg() {
  const res = await fetch('http://localhost:8080/send', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ msg: 'Hello from JS!' })
  });
  const data = await res.json();
  console.log(data);
}

4. 使用WebSocket实现实时消息推送

若需从Spring向JavaScript实时推送消息（例如消费队列后的结果），可使用WebSocket：

Spring配置WebSocket：

@Configuration
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
  @Override
  public void registerStompEndpoints(StompEndpointRegistry registry) {
    registry.addEndpoint("/ws").withSockJS();
  }

  @Override
  public void configureMessageBroker(MessageBrokerRegistry registry) {
    registry.enableSimpleBroker("/topic");
    registry.setApplicationDestinationPrefixes("/app");
  }
}

控制器推送消息：

@Controller
public class WsController {
  @Autowired
  private SimpMessagingTemplate messagingTemplate;

  public void sendMessageToClient(String message) {
    messagingTemplate.convertAndSend("/topic/messages", message);
  }
}