一篇文章带你使用SpringBoot基于WebSocket的在线群聊实现

一、添加依赖

一篇文章带你使用SpringBoot基于WebSocket的在线群聊实现_第1张图片

加入前端需要用到的依赖:


      org.webjars
      sockjs-client
      1.1.2
    
    
      org.webjars
      jquery
      3.4.1
    
    
      org.webjars
      stomp-websocket
      2.3.3
    
    
      org.webjars
      webjars-locator-core
    

二、配置 WebSocketConfig

@Configuration
//开启使用STOMP协议来传输基于代理的消息,Broker就是代理的意思
@EnableWebSocketMessageBroker
public class WebSocketConfig implements WebSocketMessageBrokerConfigurer {
  /**
   * 配置消息代理
   * @param registry
   */
  @Override
  public void configureMessageBroker(MessageBrokerRegistry registry) {
    //定义消息代理的前缀
    registry.enableSimpleBroker("/topic");
    //配置一个或者多个前缀,过滤出需要代理方法处理的消息
    registry.setApplicationDestinationPrefixes("/app");
  }

  /**
   * 注册STOMP协议的节点,并指定映射的URL
   * @param registry
   */
  @Override
  public void registerStompEndpoints(StompEndpointRegistry registry) {
    //注册STOMP协议节点,同时指定使用 SockJS 协议
    registry.addEndpoint("/chat").withSockJS();
  }
}

三、配置 Message 类

Message 类用来接收浏览器发送的信息

public class Message {
  private String name;
  private String content;

  public String getName() {
    return name;
  }

  public void setName(String name) {
    this.name = name;
  }

  public String getContent() {
    return content;
  }

  public void setContent(String content) {
    this.content = content;
  }
}

四、配置控制器 GreetingController

@Controller
public class GreetingController {
  /**
   * 这个方法用来处理浏览器发送来的消息,对其进行处理
   * @param message
   * @return
   */
  //@MessageMapping 类似 @RequestMapping
  @MessageMapping("/hello")
  //处理完之后对其进行转发到 SendTo 中的路径
  @SendTo("/topic/greetings")
  public Message greeting(Message message) {
    return message;
  }
}

这里也可以使用 SimpMessagingTemplate 来进行设置:

@Controller
public class GreetingController {
  @Autowired
  SimpMessagingTemplate simpMessagingTemplate;
  @MessageMapping("/hello")
  public void greeting(Message message) {
    simpMessagingTemplate.convertAndSend("/topic/greetings", message);
  }
}

SimpMessagingTemplate这个类主要是实现向浏览器发送消息的功能。

五、设置前端页面 chat.html




  
  群聊
  
  
  



请输入用户名

六、登录测试

打开两个浏览器,实现群聊功能:

一篇文章带你使用SpringBoot基于WebSocket的在线群聊实现_第2张图片

到此这篇关于一篇文章带你使用SpringBoot基于WebSocket的在线群聊实现的文章就介绍到这了,更多相关SpringBoot WebSocket在线群聊内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

你可能感兴趣的:(一篇文章带你使用SpringBoot基于WebSocket的在线群聊实现)