WebSocket
webSocket
用于页面与逻辑代码的消息传递,且连接是全双工通信。在pom.xml
文件中引入spring-boot-starter-websocket
依赖。 在需要进行消息展示的页面插入以下代码。 一般页面使用modal
组件显示消息内容。
<script>
if('WebSocket' in window){
//链接地址
var websocket=new WebSocket("ws://localhost:8080/sell/websocket");
websocket.onopen=function (ev) {
console.log("建立websocket链接");
}
websocket.onclose=function (ev) {
console.log("连接取消");
}
websocket.onmessage=function (ev) {
console.log("获取信息:" + ev.data);
$('#messageModal').html(ev.data);
$('#myModal').modal('show');
document.getElementById('message_mp3').play();
console.log("发送消息");
}
websocket.onbeforeunload=function (ev) {
console.log("链接建立之前先关闭之前的链接");
}
}else{
alert("您的浏览器不支持WebSocket");
}
</script>
/**
* websocket配置类 注入对象
*/
@Component
public class WebSocketConfig {
@Bean
public ServerEndpointExporter WebServEndpoint(){
return new ServerEndpointExporter();
}
}
/**
* 消息服务
*/
@Component
@ServerEndpoint("/websocket")//访问路径
public class WebSocketService {
private Session session;//一次会话
//用于接收所有的链接请求
private static CopyOnWriteArraySet<WebSocketService> webSockets=new CopyOnWriteArraySet<WebSocketService>();
@OnOpen
public void onOpen(Session session){
this.session=session;
webSockets.add(this);//请求接收同时建立链接,将当前WebSocketService加入集合
}
@OnClose
public void onClose(){
webSockets.remove(this);//取消链接,将当前WebSocketService移出集合
}
@OnMessage
public void onMessage(String message){
System.out.println(message);//消息获取
}
/**
* 发送消息给页面
* @param message
*/
public void sendMessage(String message){
//广播发送消息
for(WebSocketService webSocketService:webSockets){
try {
webSocketService.session.getBasicRemote().sendText(message);
}catch (Exception e){
e.printStackTrace();
}
}
}
}
在需要进行消息通信的地方调用WebSocketService
类的sendMessage
方法即可。