温馨提示×

java socketio如何配合前端使用

小樊
163
2024-07-20 19:32:58
栏目: 编程语言

要在前端使用Java Socket.IO,首先需要在前端引入Socket.IO的客户端库。可以通过以下方式引入:

<script src="https://cdn.socket.io/socket.io-3.0.3.js"></script>

然后,前端代码可以像以下这样使用Socket.IO:

// 连接到Socket.IO服务器
const socket = io('http://localhost:3000');

// 监听来自服务器的消息
socket.on('message', data => {
    console.log(data);
});

// 发送消息给服务器
socket.emit('message', 'Hello, server!');

在后端,需要使用Java实现Socket.IO服务器。可以使用Java的Socket.IO库,例如com.corundumstudio.socketio:netty-socketio

以下是一个简单的Java Socket.IO服务器示例:

import com.corundumstudio.socketio.Configuration;
import com.corundumstudio.socketio.SocketIOServer;
import com.corundumstudio.socketio.annotated.OnConnect;
import com.corundumstudio.socketio.annotated.OnEvent;
import com.corundumstudio.socketio.annotated.OnDisconnect;

public class SocketIOServerExample {

    public static void main(String[] args) {
        Configuration config = new Configuration();
        config.setHostname("localhost");
        config.setPort(3000);

        SocketIOServer server = new SocketIOServer(config);
        
        server.addListeners(new SocketEventListener());

        server.start();
    }

    public static class SocketEventListener {

        @OnConnect
        public void onConnect() {
            System.out.println("Client connected");
        }

        @OnEvent("message")
        public void onMessage(SocketIOClient client, String message) {
            System.out.println("Received message from client: " + message);
            client.sendEvent("message", "Hello, client!");
        }

        @OnDisconnect
        public void onDisconnect() {
            System.out.println("Client disconnected");
        }
    }
}

在这个例子中,我们创建了一个Socket.IO服务器,并定义了一个事件监听器SocketEventListener,用于处理客户端连接、消息接收和断开连接事件。

通过在前端和后端分别实现Socket.IO的客户端和服务器,可以实现实时双向通信功能。

0