使用WebSocket模塊
- 導入
spring-boot-starter-websocket
依賴
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
package cn.java2016.demo.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.server.standard.ServerEndpointExporter;
@Configuration
public class WebSocketConfiguration {
@Bean
public ServerEndpointExporter serverEndpointExporter() {
return new ServerEndpointExporter();
}
}
package cn.java2016.demo.component;
import java.io.IOException;
import javax.websocket.OnClose;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;
import org.springframework.stereotype.Component;
@ServerEndpoint("/websocket") // 訪問路徑: ws://localhost:8080/websocket
@Component
public class WebSocketServer {
// 第一次連接調用
@OnOpen
public void open(Session session) throws IOException {
System.out.println("connect..");
session.getBasicRemote().sendText("server: 登陸成功!");
}
// 關閉連接調用
@OnClose
public void close() {
System.out.println("disconnect..");
}
// 接收消息
@OnMessage
public void message(String message, Session session) {
System.out.println("client send: " + message);
}
}
// 判斷瀏覽器是否支持WebSocket
if ('WebSocket' in window) {
var socket = new WebSocket("ws://localhost:8080/websocket")
// 第一次連接
socket.onopen = function (ev) {
console.log(ev)
// 向服務器發送消息
socket.send('sfsd')
}
// 連接被關閉: 瀏覽器刷新 | 瀏覽器關閉 | 服務器關閉
socket.onclose = function (ev) {
console.log(ev)
}
// 連接錯誤
socket.onerror = function (ev) {
console.log(ev)
}
// 接收消息
socket.onmessage = function (ev) {
// 打印消息
console.log(ev.data)
}
}
使用SocketIO模塊
<dependency>
<groupId>com.corundumstudio.socketio</groupId>
<artifactId>netty-socketio</artifactId>
<version>1.7.16</version>
</dependency>
package cn.java2016.demo.config;
import org.springframework.boot.CommandLineRunner;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import com.corundumstudio.socketio.SocketIOServer;
import com.corundumstudio.socketio.annotation.SpringAnnotationScanner;
@Configuration
public class SocketIOConfiguration implements CommandLineRunner{
@Bean
public SocketIOServer socketIOServer() {
com.corundumstudio.socketio.Configuration conf = new com.corundumstudio.socketio.Configuration();
// 設置ip地址和端口
conf.setHostname("localhost");
conf.setPort(8081);
return new SocketIOServer(conf);
}
@Bean
public SpringAnnotationScanner springAnnotationScanner(SocketIOServer socketIOServer) {
return new SpringAnnotationScanner(socketIOServer);
}
@Override
public void run(String... args) throws Exception {
// 啟動socket服務
socketIOServer().start();
}
}
package cn.java2016.demo.component;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Component;
import com.corundumstudio.socketio.SocketIOClient;
import com.corundumstudio.socketio.SocketIOServer;
import com.corundumstudio.socketio.annotation.OnConnect;
import com.corundumstudio.socketio.annotation.OnDisconnect;
import com.corundumstudio.socketio.annotation.OnEvent;
import cn.java2016.demo.pojo.User;
/**
* WebSocket服務不會熱加載,需要手動重啟
* @author Administrator
*/
@Component
public class SocketServer {
@Autowired
public SocketIOServer socketServer;
// 連接打開
@OnConnect
public void connect(SocketIOClient client) {
System.out.println("socketio connect..");
client.sendEvent("data", "連接成功!");
// socketServer.getClient(client.getSessionId()).sendEvent("data", "sdfsdf");
// System.out.println(client.getSessionId());
}
// 連接關閉
@OnDisconnect
public void disconnect(SocketIOClient client) {
System.out.println("socketio disconnect..");
}
// 監聽login事件
@OnEvent("login")
public void login(SocketIOClient client, String name) {
System.out.println("login.." + name);
// socketServer.getClient(uuid)socketClient.sendEvent("data", new User(name, age));
client.sendEvent("data", "login success2..");
}
// 監聽register事件, 自動注入pojo類,用法和SpringMvc基本一致
@OnEvent("register")
public void register(User user, SocketIOClient client) {
System.out.println("register..");
System.out.println(user);
// 發送消息
client.sendEvent("data", new User(user.getName(), user.getAge()).toString());
// socketServer.getClient(client.getSessionId()).sendEvent("data", new User(user.getName(), user.getAge()));
}
}
<script src="https://cdn.bootcss.com/socket.io/2.1.1/socket.io.dev.js"></script>
var socket = io("ws://localhost:8081")
// 監聽連接事件
socket.on('connect', function () {
console.log('connection..')
})
// 關閉連接
socket.on('disconnect', function () {
console.log('connection close..')
})
// 監聽data事件
socket.on('data', function (data) {
console.log(data)
})
// 觸發事件,並傳遞json數據,在后台會自動被注入成User對象
socket.emit("register", {name: "張三", age: 18})
socket.emit('login')