快捷搜索:  汽车  科技

websocket实现消息推送功能(WebSocket实现即时聊天功能)

websocket实现消息推送功能(WebSocket实现即时聊天功能)1:打开连接的方法,直接使用注解@Onopen标记第四步:配置接口第二步:新建一个类处理WebSocket配置注意@ServerEndpoint("/websocket/{user}")这个是设置WebSocket连接地址,就像mvc的@RequestMapping一样第三步:设置一个线程集合用于存储用户session,以便我们可以对所有用户发送消息

Java端代码

废话不多说,我使用的是maven项目,直接在pom.xml加入

websocket实现消息推送功能(WebSocket实现即时聊天功能)(1)

这个是json包,用户处理实体转json发送给前端的

websocket实现消息推送功能(WebSocket实现即时聊天功能)(2)

开始写代码,

第一步:配置bean,注入ServerEndpointExporter

websocket实现消息推送功能(WebSocket实现即时聊天功能)(3)

第二步:新建一个类处理WebSocket配置

注意@ServerEndpoint("/websocket/{user}")这个是设置WebSocket连接地址,就像mvc的@RequestMapping一样

websocket实现消息推送功能(WebSocket实现即时聊天功能)(4)

第三步:设置一个线程集合用于存储用户session,以便我们可以对所有用户发送消息

websocket实现消息推送功能(WebSocket实现即时聊天功能)(5)

第四步:配置接口

1:打开连接的方法,直接使用注解@Onopen标记

websocket实现消息推送功能(WebSocket实现即时聊天功能)(6)

2:接受客户端消息,使用注解@OnMessage标记

websocket实现消息推送功能(WebSocket实现即时聊天功能)(7)

3:关闭方法和WebSocket报错的接口方法

使用@OnClose和@OnError

这个连接是不需要我们手动关闭的,当用户浏览器或者页面关闭这个方法会自动执行

我们需要把退出的用户session从map集合中删除

websocket实现消息推送功能(WebSocket实现即时聊天功能)(8)

还有一个就是我自定义的一个接口,当用户连接和用法发送消息给其他在线用户发消息的接口

就是给在线用户推送消息

websocket实现消息推送功能(WebSocket实现即时聊天功能)(9)

这里我自定义了一个entity Message,用户存储消息

websocket实现消息推送功能(WebSocket实现即时聊天功能)(10)

移动端HTML

第一步:配置WebSocket的链接

websocket实现消息推送功能(WebSocket实现即时聊天功能)(11)

第二部:

1:调用open方法打开连接

2:接受服务器推送的消息

3:把消息发送给服务器

websocket实现消息推送功能(WebSocket实现即时聊天功能)(12)

里面还调用了几个方法添加HTML到页面上的。在这里,当受到推送动态添加HTML

下面是完成后的前端画面

websocket实现消息推送功能(WebSocket实现即时聊天功能)(13)

websocket实现消息推送功能(WebSocket实现即时聊天功能)(14)

这里发一下我发到线上的demo,

复制到浏览器就能玩了哟,demo仅供参考

http://qq.sulanyou.top/demo/static/html/login.html

猜您喜欢: