SpringBoot+Websocket实现一个简单的网页聊天功能代码

SpringBoot+Websocket实现一个简单的网页聊天功能代码

最近做了一个SpringBoot的项目，被SpringBoot那简介的配置所迷住。刚好项目中，用到了websocket。于是，我就想着，做一个SpringBoot+websocket简单的网页聊天Demo。

效果展示：

当然，项目很简单，没什么代码，一眼就能明白

导入websocket的包。

通过使用SpringBoot导入包的时候，我们可以发现，很多包都是以 spring-boot-starter 开头的，对于我这种强迫症 ，简直是福音

org.springframework.boot

spring-boot-starter-websocket

配置websocket

服务端

首先新建一个WebSocketConfig的类，添加 @Component 注解 注入一个bean

@Component

public class WebSocketConfig {

@Bean

public ServerEndpointExporter serverEndpointExporter() {

return new ServerEndpointExporter();

}

CIbiuHjt}

新建一个service，本来觉得是新建一个控制器，但是我觉得这也不是控制器，但是也不太是service。最后还是选择新建一个servece。这里你如果有更好的想法可以按照你的来。

这个service里面有4个方法，这些方法很简单，通过名称就可以看出是什么意思。

@Component

@ServerEndpoint("/webSocket")

@Slf4j

public class WebSocket {

private Session session;

private static CopyOnWriteArraySet webSockets = new CopyOnWriteArraySet<>();

private MessageVO messageVO = new MessageVO();

@OnOpen

public void onOpen(Session session) {

this.session = session;

webSockets.add(this);

messageVO.setType(1);

messageVO.setUserNum(webSockets.size());

messageVO.setMessage("有新的连接");

ObjectMapper mapper = new ObjectMapper();

String json = "";

try {

Json = mapper.writeValueAsString(messageVO);

} catch (Exception ex) {

log.error(ex.getMessage());

}

this.sendMessage(Json);

log.info("【websocket消息】有新的连接, 总数:{}", webSockets.size());

}

@OnClose

public void onClose() {

webSockets.remove(this);

messageVO.setType(2);

messageVO.setUserNum(webSockets.size());

messageVO.setMessage("有用户离开");

ObjectMapper mapper = new ObjectMapper();

String Json = "";

try {

Json = mapper.writeValueAsString(messageVO);

} catch (Exception ex) {

log.error(ex.getMessage());

}

this.sendMessage(Json);

log.info("【websocket消息】连接断开, 总数:{}", webSockets.size());

}

@OnMessage

public void onMessage(String message) {

messageVO.setType(3);

messageVO.setUserNum(webSockets.size());

messageVO.setMessage(message);

ObjectMapper mapper = new ObjectMapper();

String Json = "";

try {

Json = mapper.writeValueAsString(messageVO);

} catch (Exception ex) {

log.error(ex.getMessage());

}

this.sendMessage(Json);

log.info("【websocket消息】收到客户端发来的消息:{}", message);

}

public void sendMessage(String message) {

for (WebSocket webSocket : webSockets) {

log.info("【websocket消息】广播消息, message={}", message);

try {

webSocket.session.getBasicRemote().sendText(message);

} catch (Exception e) {

e.printStackTrace();

}

}

}

}

客户端

客户端也就是我们的html，我用的是原生html5的websocket ,不需要其他的js。直接在html中写js就可以

这个就是全都的功能，非常简单，没什么特别的功能和代码。

最后附上github的源代码传送门

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。