用Springboot&WebScoket再造一个类似微信的聊天小程序(附源码)

2023-05-16

基于Springboot和WebScoket写的一个在线聊天小程序

基于Springboot和WebScoket写的一个在线聊天小程序(附源码)

 

项目说明

  • 此项目为一个聊天的小demo,采用springboot+websocket+vue开发。
  • 其中有一个接口为添加好友接口,添加好友会判断是否已经是好友。
  • 聊天的时候:A给B发送消息如果B的聊天窗口不是A,则B处会提醒A发来一条消息。
  • 聊天内容的输入框采用layui的富文本编辑器,目前不支持回车发送内容。
  • 聊天可以发送图片,图片默认存储在D:/chat/目录下。
  • 点击聊天内容中的图片会弹出预览,这个预览弹出此条消息中的所有图片。
  • 在发送语音的时候,语音默认发送给当前聊天窗口的用户,所以录制语音的时候务必保证当前聊天窗口有选择的用户。
  • 知道用户的账号可以添加好友,目前是如果账号存在,可以直接添加成功

老规矩,还是先看看项目的目录结构:

基于Springboot和WebScoket写的一个在线聊天小程序(附源码)

 

一、先引入pom文件

这里就只放了一点点代码(代码太长了)

<dependency>            <groupId>commons-io</groupId>            <artifactId>commons-io</artifactId>            <version>2.4</version>        </dependency>        <dependency>            <groupId>org.projectlombok</groupId>            <artifactId>lombok</artifactId>        </dependency>        <dependency>            <groupId>net.sf.json-lib</groupId>            <artifactId>json-lib</artifactId>            <version>2.4</version>            <classifier>jdk15</classifier>        </dependency>        <!-- https://mvnrepository.com/artifact/org.springframework.boot/spring-boot-starter-thymeleaf -->        <dependency>            <groupId>org.springframework.boot</groupId>            <artifactId>spring-boot-starter-thymeleaf</artifactId>            <version>2.2.4.RELEASE</version>        </dependency>        <dependency>            <groupId>com.alibaba</groupId>            <artifactId>fastjson</artifactId>            <version>1.2.60</version>        </dependency>        <dependency>            <groupId>org.springframework.boot</groupId>            <artifactId>spring-boot-starter-test</artifactId>            <scope>test</scope>        </dependency>

二、创建对应的yml配置文件

spring:
  profiles:
    active: prod
spring:
  datasource:    username: root    password: root    url: jdbc:mysql://localhost:3306/chat?useUnicode=true&characterEncoding=utf8&autoReconnect=true&useSSL=false&serverTimezone=UTC
    driver-class-name: com.mysql.jdbc.Driver    #指定数据源    type: com.alibaba.druid.pool.DruidDataSource
    # 数据源其他配置    initialSize: 5
    minIdle: 5
    maxActive: 20
    maxWait: 60000
    timeBetweenEvictionRunsMillis: 60000
    minEvictableIdleTimeMillis: 300000
    validationQuery: SELECT 1
    testWhileIdle: true
    testOnBorrow: false
    testOnReturn: false
    poolPreparedStatements: true
    #   配置监控统计拦截的filters,去掉后监控界面sql无法统计,'wall'用于防火墙
    filters: stat,log4j    maxPoolPreparedStatementPerConnectionSize: 20
    useGlobalDataSourceStat: true
    connectionProperties: druid.stat.mergeSql=true;druid.stat.slowSqlMillis=500
  thymeleaf:    suffix: .html    prefix:      classpath: /templates/    cache: false
  jackson: #返回的日期字段的格式    date-format: yyyy-MM-dd HH:mm:ss
    time-zone: GMT+8
    serialization:      write-dates-as-timestamps: false # true 使用时间戳显示时间
  http:    multipart:      max-file-size: 1000Mb
      max-request-size: 1000Mb
#配置文件式开发mybatis:  #全局配置文件的位置  config-location: classpath:mybatis/mybatis-config.xml
  #所有sql映射配置文件的位置  mapper-locations: classpath:mybatis/mapper/**/*.xmlserver:  session:    timeout: 7200

三、创建实体类

这里就不再多说了,有 Login,Userinfo,ChatMsg,ChatFriends

基于Springboot和WebScoket写的一个在线聊天小程序(附源码)

 

四、创建对应的mapper(即dao层)还有对应的mapper映射文件

(这里就举出了一个,不再多说)

public interface ChatFriendsMapper {
    //查询所有的好友
    List<ChatFriends> LookUserAllFriends(String userid);
    //插入好友
    void InsertUserFriend(ChatFriends chatFriends);
    //判断是否加好友
    Integer JustTwoUserIsFriend(ChatFriends chatFriends);
    //查询用户的信息
    Userinfo LkUserinfoByUserid(String userid);
}
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.chat.mapper.ChatFriendsMapper">
    <select id="LookUserAllFriends" resultType="com.chat.bean.ChatFriends" parameterType="java.lang.String">
      select userid,nickname,uimg from userinfo where userid in (select a.fuserid from chat_friends a where a.userid=#{userid})    </select>
    <insert id="InsertUserFriend" parameterType="com.chat.bean.ChatFriends">
        insert into chat_friends (userid, fuserid) value (#{userid},#{fuserid})    </insert>
    <select id="JustTwoUserIsFriend" parameterType="com.chat.bean.ChatFriends" resultType="java.lang.Integer">
        select id from chat_friends where userid=#{userid} and fuserid=#{fuserid}    </select>
    <select id="LkUserinfoByUserid" parameterType="java.lang.String" resultType="com.chat.bean.Userinfo">
        select * from userinfo where userid=#{userid}    </select>
</mapper>

五、创建对应的业务类(即service)

(同样的业务层这里也就指出一个)

@Service
public class ChatFriendsService {
    @Autowired
    ChatFriendsMapper chatFriendsMapper;    public List<ChatFriends> LookUserAllFriends(String userid){
        return chatFriendsMapper.LookUserAllFriends(userid);
    }    public void InsertUserFriend(ChatFriends chatFriends){
        chatFriendsMapper.InsertUserFriend(chatFriends);    }    public Integer JustTwoUserIsFriend(ChatFriends chatFriends){
        return chatFriendsMapper.JustTwoUserIsFriend(chatFriends);
    }    public Userinfo LkUserinfoByUserid(String userid){
        return chatFriendsMapper.LkUserinfoByUserid(userid);
    }}

六、创建对应的控制器

这里再说说项目的接口

  1. /chat/upimg 
    聊天图片上传接口
  2. /chat/lkuser 
    这个接口用来添加好友的时候:查询用户,如果用户存在返回用户信息,如果不存在返回不存在
  3. /chat/adduser/ 
    这个接口是添加好友接口,会判断添加的好友是否是自己,如果添加的好友已经存在则直接返回
  4. /chat/ct 
    跳转到聊天界面
  5. /chat/lkfriends 
    查询用户的好友
  6. /chat/lkuschatmsg/ 
    这个接口是查询两个用户之间的聊天信息的接口,传入用户的userid,查询当前登录用户和该用户的聊天记录。
  7. /chat/audio 
    这个接口是Ajax上传web界面js录制的音频数据用的接口

(同样就只写一个)

@Controller
public class LoginCtrl {
    @Autowired
    LoginService loginService;    @GetMapping("/")
    public String tologin(){
        return "user/login";
    }    /**
     * 登陆
     * */
    @PostMapping("/justlogin")
    @ResponseBody
    public R login(@RequestBody Login login, HttpSession session){
        login.setPassword(Md5Util.StringInMd5(login.getPassword()));        String userid = loginService.justLogin(login);        if(userid==null){
            return R.error().message("账号或者密码错误");
        }        session.setAttribute("userid",userid);
        return R.ok().message("登录成功");
    }}

七、创建对应的工具类以及自定义异常类

  1. 表情过滤工具类
public class EmojiFilter {
    private static boolean isEmojiCharacter(char codePoint) {
        return (codePoint == 0x0) || (codePoint == 0x9) || (codePoint == 0xA)
                || (codePoint == 0xD)
                || ((codePoint >= 0x20) && (codePoint <= 0xD7FF))
                || ((codePoint >= 0xE000) && (codePoint <= 0xFFFD))
                || ((codePoint >= 0x10000) && (codePoint <= 0x10FFFF));
    }    @Test
    public void testA(){
        String s = EmojiFilter.filterEmoji("您好:smile:,你好啊");
        System.out.println(s);    }
  1. Md5数据加密类
static String[] chars = {"0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"};
    /**
     * 将普通字符串用md5加密,并转化为16进制字符串
     * @param str
     * @return
     */
    public static String StringInMd5(String str) {        // 消息签名(摘要)
        MessageDigest md5 = null;        try {            // 参数代表的是算法名称
            md5 = MessageDigest.getInstance("md5");
            byte[] result = md5.digest(str.getBytes());            StringBuilder sb = new StringBuilder(32);
            // 将结果转为16进制字符  0~9 A~F
            for (int i = 0; i < result.length; i++) {
                // 一个字节对应两个字符
                byte x = result[i];                // 取得高位
                int h = 0x0f & (x >>> 4);
                // 取得低位
                int l = 0x0f & x;
                sb.append(chars[h]).append(chars[l]);            }            return sb.toString();
        } catch (NoSuchAlgorithmException e) {            throw new RuntimeException(e);        }    }
  1. 测试数据加密类
public class TestUtil {
    @Test
    public void testA(){
        String s = Md5Util.StringInMd5("123456");
        System.out.println(s);
    }}

八、引入对应的静态资源文件(这个应该一开始就做的)

基于Springboot和WebScoket写的一个在线聊天小程序(附源码)

 

九、自定义一些配置并且注入到容器里面

  1. Druid数据源
@Configuration
public class DruidConfig {    @ConfigurationProperties(prefix = "spring.datasource")
    @Bean    public DataSource druid(){        return new DruidDataSource();
    }    //配置Druid的监控    //1.配置要给管理后台的Servlet
    @Bean    public ServletRegistrationBean servletRegistrationBean(){        ServletRegistrationBean bean=new ServletRegistrationBean(new StatViewServlet(),"/druid/*");
        Map<String,String> initParams=new HashMap<>();        initParams.put("loginUsername","admin");
        initParams.put("loginPassword","admin233215");
        initParams.put("allow","");//默认允许ip访问
        initParams.put("deny","");
        bean.setInitParameters(initParams);        return bean;
    }    //2.配置一个监控的filter
    @Bean    public FilterRegistrationBean webStarFilter(){        FilterRegistrationBean bean=new FilterRegistrationBean();        bean.setFilter(new WebStatFilter());        Map<String,String> initParams=new HashMap<>();        initParams.put("exclusions","*.js,*.css,/druid/*");
        bean.setInitParameters(initParams);        bean.setUrlPatterns(Arrays.asList("/*"));
        return bean;
    }}
  1. 静态资源以及拦截器
@Configuration
public class MyConfig extends WebMvcConfigurerAdapter {
    //配置一个静态文件的路径 否则css和js无法使用,虽然默认的静态资源是放在static下,但是没有配置里面的文件夹
    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry) {
        registry.addResourceHandler("/static/**").addResourceLocations("classpath:/static/");
    }    @Bean    public WebMvcConfigurerAdapter WebMvcConfigurerAdapter() {        WebMvcConfigurerAdapter adapter = new WebMvcConfigurerAdapter() {            @Override            public void addResourceHandlers(ResourceHandlerRegistry registry) {                //registry.addResourceHandler("/pic/**").addResourceLocations("file:D:/chat/");
                registry.addResourceHandler("/pic/**").addResourceLocations("file:D:/idea_project/SpringBoot/Project/Complete&&Finish/chat/chatmsg/");
                super.addResourceHandlers(registry);
            }        };        return adapter;
    }    @Override    public void addInterceptors(InterceptorRegistry registry) {        //注册TestInterceptor拦截器
        InterceptorRegistration registration = registry.addInterceptor(new AdminInterceptor());        registration.addPathPatterns("/chat/*");
    }}
  1. WebSocketConfigScokt通信配置
@Configuration
@EnableWebSocket
public class WebSocketConfig {
     @Bean
    public ServerEndpointExporter serverEndpointExporter() {        return new ServerEndpointExporter();
    }}

十、进行测试

这是两个不同的用户

基于Springboot和WebScoket写的一个在线聊天小程序(附源码)

 

基于Springboot和WebScoket写的一个在线聊天小程序(附源码)

 

当然了,还可以进行语音,添加好友

今天的就写到这里吧!喜欢的话随手点个关注吧谢谢!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

用Springboot&WebScoket再造一个类似微信的聊天小程序(附源码) 的相关文章

  • TLSF 内存分配算法详解

    文章目录 1 DSA 背景介绍1 1 mmheap1 2 mmblk 2 TLSF 原理2 1 存储结构2 2 内存池初始化2 3 free2 4 malloc 参考资料 1 DSA 背景介绍 动态内存管理算法 DSA xff0c Dyna
  • 史上最全采样方法详细解读与代码实现

    项目github地址 xff1a bitcarmanlee easy algorithm interview and practice 欢迎大家star xff0c 留言 xff0c 一起学习进步 1 什么是采样 在信号系统 数字信号处理中
  • Linux Kdump 机制详解

    文章目录 1 简介1 1 安装1 2 触发 kdump1 3 调试 kdump1 3 1 安装 debuginfo vmlinux1 3 2 编译 kernel 1 4 kdump tools service 流程分析 2 原理分析2 1
  • Buildroot 用户手册 (中文)

    文章目录 I Getting started1 About Buildroot2 System requirements2 1 Mandatory packages2 2 Optional packages 3 Getting Buildr
  • 正则表达式 (学习笔记)

    正则表达式的难度不在于难懂 xff0c 而在于对它的表述没有恰当的分类和组织 xff0c 所以弄得很零散难以记忆 按照自己的理解和归纳记录一份笔记 xff0c 以备遗忘时查看 正则表达式 regular expressions 是一种用来匹
  • Linux usb 2. 协议分析

    文章目录 0 背景1 USB 协议传输格式1 1 Packet1 1 1 Token Packet1 1 2 Data Packet1 1 3 Handshake Packet1 1 4 Special Packet 1 2 Transac
  • RISCV 入门 (学习笔记)

    文章目录 1 risv 相关背景1 1 arm 授权费1 2 riscv 发展历史1 3 riscv 风险 2 指令集2 1 可配置的通用寄存器组2 2 规整的指令编码2 3 简洁的存储器访问指令2 4 高效的分支跳转指令2 5 简洁的子程
  • Linux usb 1. 总线简介

    文章目录 1 USB 发展历史1 1 USB 1 0 2 01 2 USB 3 01 3 速度识别1 4 OTG1 5 phy 总线1 6 传输编码方式 2 总线拓扑2 1 Device 内部的逻辑关系2 2 Compound Compos
  • Linux usb 3. Host 详解

    文章目录 1 简介2 Usb Core 驱动设备模型2 1 Usb Device Layer2 1 1 device struct usb device 2 1 2 driver struct usb device driver 2 1 3
  • Linux usb 4. Device 详解

    文章目录 1 简介2 Platform Layer2 1 Platform Device2 2 Platform Driver 3 UDC Gadget Layer3 1 Gadget Bus3 2 Gadget Device3 2 1 E
  • Linux USB (目录)

    1 USB 总线简介 2 USB 协议分析 3 USB Host 详解 4 USB Device 详解 5 usbip USB Over IP 使用实例 6 USB HC UDC 测试 7 Linux 配置 ADBD
  • Linux usb 5. usbip (USB Over IP) 使用实例

    文章目录 0 简介1 Server 配置2 Client 配置参考资料 0 简介 USB Over IP 是一种应用很多的场景 xff0c 目前已经有现成的解决方案 usbip linux 和 windows 环境下都有配套软件 xff0c
  • 最全随机抽样算法(从N个数中抽取M个等)集合

    项目github地址 xff1a bitcarmanlee easy algorithm interview and practice 欢迎大家star xff0c 留言 xff0c 一起学习进步 1 从N个数中等概率抽取M个数 从N个样本
  • Linux usb 6. HC/UDC 测试

    文章目录 1 背景介绍2 Device gadget zero 2 1 96 gadget zero 96 创建2 2 SourceSink Function2 3 Loopback Function 3 Host usbtest ko 3
  • Linux usb 7. Linux 配置 ADBD

    文章目录 1 简介2 ADBD 源码3 Gadget Device 配置3 1 functionfs3 2 legacy 方式配置 functionfs3 3 configfs 方式配置 functionfs3 4 adb 使用配置 参考资
  • HW-RTOS 概述

    文章目录 1 背景介绍1 1 OS 实时难题1 2 Linux 实时补丁1 3 Xenomai 43 Linux 双内核1 4 HW RTOS1 5 More 2 优化点1 xff1a API2 1 原理介绍2 1 1 Software A
  • RISCV MMU 概述

    1 背景简介 Linux 内存管理包含很多内容 xff0c 主要知识点可以参考 Linux Mem 本文只描述其中的一个知识点 Paging and MMU 本文以全志 D1 为例 xff0c 包含了平头哥出品的一颗 Riscv64 的 C
  • 主流 RTOS 评估

    1 RT Thread RT Thread 是国内出产的一款非常优秀的 RTOS 它和 FreeRTOS uCos 等经典 RTOS 最大的不同是 xff1a 它不仅仅是一个实时内核 xff0c 还具备丰富的中间层组件 它提供了一个完整的软
  • Linux mem 2.8 Kfence 详解

    1 原理介绍 Kfence Kernel Electric Fence 是 Linux 内核引入的一种低开销的内存错误检测机制 xff0c 因为是低开销的所以它可以在运行的生产环境中开启 xff0c 同样由于是低开销所以它的功能相比较 KA
  • Linux Phy 驱动解析

    文章目录 1 简介2 phy device2 1 mdio bus2 2 mdio device2 3 mdio driver2 4 poll task2 4 1 自协商配置2 4 2 link 状态读取2 4 3 link 状态通知 3

随机推荐

  • 程序媛工作几年后的感受!体验?

    黑客技术 点击右侧关注 xff0c 了解黑客的世界 xff01 Java开发进阶 点击右侧关注 xff0c 掌握进阶之路 xff01 Python开发 点击右侧关注 xff0c 探讨技术话题 xff01 作者 xff1a hq nuan 来
  • ubuntu 通过 apt-get 安装软件失败时的解决方案

    最近在 vmware上的ubuntu系统下安装 软件时出现安装失败情况 xff0c 在网上搜了一通 xff0c 终于找到了解决方案 遇到的问题和解决方案如下 xff1a 一 apt get install vim二 apt get upda
  • JAVA自学之路 三:要动手

    原创 尚学堂科技 马士兵老师 JAVA自学之路 三 要动手 转载请注明出处 http www bjsxt com zixue zixuezhilu 3 html 无论如何 xff0c 请坚持不懈的动手实验 xff01 学习Java要动手 x
  • Eigen库的安装

    运行命令 xff1a sudo apt get install libeigen3 dev 假设默认安装到 usr local include里 可在终端中输入locate eigen3查看位置 xff0c 若实际中默认安装到了 usr i
  • 搭建自己的简易服务器(公网)

    大部分时候做嵌入式开发的 xff0c 如果是wifi 可以工作在局域网 xff0c 至于物联网设备 xff0c 插手机卡的那种就需要公网ip 测试起来相对比较麻烦 xff0c 电信宽带用户有的可以映射使用 xff0c 但是ip会改变 xff
  • CPP服务器08--http请求响应实现

    http服务设计 对于静态页面服务器来说 xff0c 其工作流程如下 xff1a 接收客户端消息 解析出http请求报文 业务逻辑 xff0c 拼装响应报文 发送给客户端结果 http连接类 设计目标 xff1a 将客户端唯一文件描述符封装
  • Linux C Socket 编程

    以下内容转载自 https www cnblogs com PikapBai p 13964866 html 闪念基因2020 11 20 12 01 20 本文作者 xff1a 她爱喝水 本文链接 xff1a https www cnbl
  • Linux中ROS风格的物理PWM引脚控制,C++代码

    背景 xff1a 拿到一个舵机 xff0c 一个安装了linux和ROS的 小黑盒子 以及一个干干净净啥也不会的脑子 xff0c 然后我从零开始学的 xff0c 总算找到了个能操作舵机的程序 现在只是能跑的状态 xff0c 提供一种思路 x
  • ROS二次开发需要用到的大部分Linux命令

    背景 xff1a 拿到了一架有机载电脑的全部开源的无人机 xff0c 机载电脑安装了ubuntu20 04 xff0c ROS1 xff0c 上面已经在运行了一些程序 我以前只是听过linux xff0c 根本不知道ROS 那么现在需要快速
  • 【技巧】如何为开源社区做贡献

    预计阅读时间 xff1a 6 分钟 Github 这东西怎么用 xff1f 相信有很多人还没有自己操作过 xff0c 这下面给大家推荐一位大佬的文章 xff0c 希望有所帮助 之前有幸参与到一个开源项目中 xff0c 该项目是一个算法知识的
  • MLK | 机器学习采样方法大全

    MLK xff0c 即Machine Learning Knowledge xff0c 本专栏在于对机器学习的重点知识做一次梳理 xff0c 便于日后温习 xff0c 内容主要来自于 百面机器学习 一书 xff0c 结合自己的经验与思考做的
  • python爬虫实战:之爬取京东商城实例教程!(含源代码)

    前言 xff1a 本文主要介绍的是利用python爬取京东商城的方法 xff0c 文中介绍的非常详细 xff0c 下面话不多说了 xff0c 来看看详细的介绍吧 主要工具 scrapyBeautifulSouprequests 分析步骤 1
  • 明面上是个歌手!暗地里是个程序员的明星你只知道许嵩和潘玮柏?

    在5月9日 xff0c 知名演员刘涛在社交平台发文公布 xff1a 已正式入职聚划算成官方优选官了 xff0c 而且还有花名叫刘一刀 xff0c 以后就专职给大家挑好物了 当然 xff0c 刘涛在5 14号已经开始上班了 xff0c 还邀请
  • 如何使用Python实现支付宝在线支付?商家:我人傻了

    windows系统安装Python虚拟环境 首先保证你的系统已经安装好了Python 安装virtualenv C WINDOWS system32 gt pip3 install virtualenv Collecting virtual
  • Mavros Client md5sum Error

    Mavros Client md5sum Error 运行阿木实验室px4 commander包里vio fly sh的 roslaunch px4 command px4 pos estimator launch 时报错 xff1a ER
  • 几行代码实现简单的网络象棋游戏,看看Java大牛是怎么做到的?

    游戏规则 xff1a 1 将 帅 xff1a 不能出田字格 xff0c 不能走斜线 xff0c 只能前进后退向左向右 xff0c 每次只走一格 xff1b 2 士 仕 xff1a 不能出田字格 xff0c 只能走斜线 xff0c 每次只走一
  • 深入理解什么是端口(port)

    每当看到有人的简历上写着熟悉 tcp ip http 等协议时 我就忍不住问问他们 你给我说说 端口是啥吧 可惜 很少有人能说得让人满意 所以这次就来谈谈端口 port 这个熟悉的陌生人 在此过程中 还会谈谈间接层 naming servi
  • 怒爬某破Hub站资源,只为撸这个鉴黄平台

    黄色已经是我们所不容然而却防不胜防的 xff0c 尤其是对于做内容的工具和平台 xff0c 所以花了30分钟搭建了一个鉴黄平台 xff0c 分享给大家 数据准备 找了 N 多资源都不能解决问题 xff0c 于是怒爬某 Bub资料 xff0c
  • 面试官:你简历中写用过docker,能说说容器和镜像的区别吗?

    这篇文章希望能够帮助读者深入理解Docker的命令 xff0c 还有容器 xff08 container xff09 和镜像 xff08 image xff09 之间的区别 xff0c 并深入探讨容器和运行中的容器之间的区别 当我对Dock
  • 用Springboot&WebScoket再造一个类似微信的聊天小程序(附源码)

    基于Springboot和WebScoket写的一个在线聊天小程序 项目说明 此项目为一个聊天的小demo xff0c 采用springboot 43 websocket 43 vue开发 其中有一个接口为添加好友接口 xff0c 添加好友