一,效果展示

1,打开首页会有登录提示

IO网页聊天 JAVA javaweb聊天系统_p2p

2,点击确定自动跳转到登录页面

IO网页聊天 JAVA javaweb聊天系统_IO网页聊天 JAVA_02

3,在登录页面如果没有账号可以点击注册,自动跳转到注册页面

IO网页聊天 JAVA javaweb聊天系统_linq_03

4,注册或者登陆成功会自动跳转到聊天页面

IO网页聊天 JAVA javaweb聊天系统_gnu_04

        聊天页面右侧有群成员展示,只有在线成员头像是明亮的,且优先展示

5,发送且接收消息

IO网页聊天 JAVA javaweb聊天系统_数据库_05

具体的代码我都放到了gitee中,项目地址:AQAQian/group_chatroom

二,后端整体结构

IO网页聊天 JAVA javaweb聊天系统_gnu_06

 后端通过websocket和前端进行通信,只要建立一个websocket连接,就会生成一个endpoint对象,每个对象维护自己的在线用户信息

1,(黑色线)发送/保存消息:当有人发送消息时,前端通过websocket把数据提供给对应的endpoint,endpoint就会把消息发送给后端,找到所有在线用户,然后针对每个在线用户再把消息发送回去,同时通过messageDao层把消息保存到数据库里;

2,(蓝色线)上线:记录在线用户有哪些(进行在线用户管理),同时在数据库里查询自上次退出之后有多少历史消息,查询出来后把他们作为历史消息统一发送给对应的用户

3,(红色线)下线:需要在在线用户列表中把该用户删除,同时通过UserDao更新用户下线时间,记录到数据库中,这样等该用户下次上线的时候我们才可以根据她的下线时间以及消息时间查询到属于该用户的历史消息,一起发送出去

核心:websocket机制

三,后端代码逻辑

IO网页聊天 JAVA javaweb聊天系统_linq_07

1, 功能场景分析:

        1,一个人发送的消息在线的所有人 都能收到(核心功能)

        2,针对离线的人(注册过但目前没有登录),等他再次登录时可以看到之前的历史消息

        3,首次注册的人看不到之前的消息

        4,系统的所有人都在一个群里

2,代码逻辑分析:

        endpoint:负责接入,相当于后端的入口,每有一个用户会有一个自己的endpoint

        service:业务工作,相当于后端的中间部分,处理相关业务

        dao:负责数据库相关处理

        usercenter:管理在线用户

        除了endpoint,其余的三个对象都使用了单例,其中usercenter必须使用单例对象,因为只有这样才能实现所有的用户在一个地方进行管理。至于什么时候用单例,只要对象和对象的状态无关都可以考虑单例

3,建数据库:

        此项目一共需要两张数据库表,分别用来处理用户信息和消息

    

IO网页聊天 JAVA javaweb聊天系统_p2p_08

 

四,可能遇到的错误

        第一次写这个项目的时候还是遇到了很多Bug的,这里记录下印象深刻的几个错误

        1,静态资源相关:

IO网页聊天 JAVA javaweb聊天系统_linq_09

        原因:静态资源文件 放错了位置,应该放在webapp根目录下

2,方法定义错误,tomcat调用的是无参的构造方法

IO网页聊天 JAVA javaweb聊天系统_p2p_10

 3,空指针异常错误:

IO网页聊天 JAVA javaweb聊天系统_p2p_11

 这个问题困扰了最久,一层一层的打断点,后来发现我在登录的动态资源那儿把获取session的代码不小心注释了,所以才会一直显示空指针异常

IO网页聊天 JAVA javaweb聊天系统_IO网页聊天 JAVA_12

 还有一些其他的小错误以及一些前端代码的错误,这里就不一一赘述了