热门标签 | HotTags
当前位置:  开发笔记 > 前端 > 正文

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

这篇文章主要介绍了一篇文章带你使用SpringBoot基于WebSocket的在线群聊实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

一、添加依赖

在这里插入图片描述

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


      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的在线群聊实现的文章就介绍到这了,更多相关SpringBoot WebSocket在线群聊内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持!


推荐阅读
  • 本文详细解析了JSONP(JSON with Padding)的跨域机制及其工作原理。JSONP是一种通过动态创建``标签来实现跨域请求的技术,其核心在于利用了浏览器对``标签的宽松同源策略。文章不仅介绍了JSONP的产生背景,还深入探讨了其具体实现过程,包括如何构造请求、服务器端如何响应以及客户端如何处理返回的数据。此外,还分析了JSONP的优势和局限性,帮助读者全面理解这一技术在现代Web开发中的应用。 ... [详细]
  • Bootstrap 插件使用指南
    本文详细介绍了如何在 Web 前端开发中使用 Bootstrap 插件,包括自动触发插件的方法、插件的引用方式以及具体的实例。 ... [详细]
  • 作为一名新手开发者,我正在尝试使用 ASP.NET 和 Vue.js 构建一个单页面应用,涉及多个复杂组件(如按钮、图表等)。希望有经验的开发者能够提供指导。 ... [详细]
  • h5调用本地摄像头和麦克风一
    h5调用本地摄像头和麦克风一,Go语言社区,Golang程序员人脉社 ... [详细]
  • Framework7:构建跨平台移动应用的高效框架
    Framework7 是一个开源免费的框架,适用于开发混合移动应用(原生与HTML混合)或iOS&Android风格的Web应用。此外,它还可以作为原型开发工具,帮助开发者快速创建应用原型。 ... [详细]
  • Web开发框架概览:Java与JavaScript技术及框架综述
    Web开发涉及服务器端和客户端的协同工作。在服务器端,Java是一种优秀的编程语言,适用于构建各种功能模块,如通过Servlet实现特定服务。客户端则主要依赖HTML进行内容展示,同时借助JavaScript增强交互性和动态效果。此外,现代Web开发还广泛使用各种框架和库,如Spring Boot、React和Vue.js,以提高开发效率和应用性能。 ... [详细]
  • 本文介绍了 PHP 的基本概念、服务器与客户端的工作原理,以及 PHP 如何与数据库交互。同时,还涵盖了常见的数据库操作和安全性问题。 ... [详细]
  • 本文介绍了 jQuery 的基本使用方法,包括文档就绪函数和常用的鼠标事件处理,以及各种选择器的详细说明。 ... [详细]
  • 本文通过一个具体的案例,展示了如何使用 Python 爬虫技术从京东网站爬取手机的价格和参数。最近发布的 iPhone X 虽然价格昂贵,但不妨碍我们探索其他高性价比的国产手机。 ... [详细]
  • SvpplyTable: 实现可扩展和可折叠的菜单动画
    SvpplyTable 是一个示例项目,旨在实现类似 Svpply 应用程序中的可扩展和可折叠的菜单动画效果。该项目托管在 GitHub 上,地址为 https://github.com/liuminqian/SvpplyTable。 ... [详细]
  • 本文介绍了如何使用Postman构建和发送HTTP请求,包括四个主要部分:方法(Method)、URL、头部(Headers)和主体(Body)。特别强调了Body部分的重要性,并详细说明了不同类型的请求体。 ... [详细]
  • 本文汇集了我在网络上搜集以及在实际面试中遇到的前端开发面试题目,并附有详细解答。无论是初学者还是有一定经验的开发者,都应深入理解这些问题背后的原理,通过系统学习和透彻研究,逐步形成自己的知识体系和技术框架。 ... [详细]
  • 本文探讨了利用Java实现WebSocket实时消息推送技术的方法。与传统的轮询、长连接或短连接等方案相比,WebSocket提供了一种更为高效和低延迟的双向通信机制。通过建立持久连接,服务器能够主动向客户端推送数据,从而实现真正的实时消息传递。此外,本文还介绍了WebSocket在实际应用中的优势和应用场景,并提供了详细的实现步骤和技术细节。 ... [详细]
  • 基于Node.js的高性能实时消息推送系统通过集成Socket.IO和Express框架,实现了高效的高并发消息转发功能。该系统能够支持大量用户同时在线,并确保消息的实时性和可靠性,适用于需要即时通信的应用场景。 ... [详细]
  • PyQt5 QTextEdit:深入解析Python中多功能GUI库的应用与实现
    本文详细探讨了 PyQt5 中 QTextEdit 组件在 Python 多功能 GUI 库中的应用与实现。PyQt5 是 Qt 框架的 Python 绑定,提供了超过 620 个类和 6000 个函数及方法,广泛应用于跨平台应用程序开发。QTextEdit 作为其中的重要组件,支持丰富的文本编辑功能,如富文本格式、文本高亮和自定义样式等。PyQt5 的流行性不仅在于其强大的功能,还在于其易用性和灵活性,使其成为开发复杂用户界面的理想选择。 ... [详细]
author-avatar
pet宠物情缘
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有