当前位置：首页 > JavaScript

js实现scoket

2026-02-02 07:48:59JavaScript

使用 WebSocket API 实现 Socket 通信

WebSocket 是 HTML5 提供的一种在单个 TCP 连接上进行全双工通信的协议，适合实时应用场景。

创建 WebSocket 连接

const socket = new WebSocket('ws://your-websocket-server.com');

替换 ws://your-websocket-server.com 为实际的 WebSocket 服务器地址，安全连接使用 wss://。

监听连接事件

socket.onopen = function(event) {
    console.log('连接已建立');
    socket.send('Hello Server!');
};

当连接成功建立时触发 onopen 事件，可以在此发送初始消息。

接收消息处理

socket.onmessage = function(event) {
    console.log('收到消息: ' + event.data);
};

服务器发送消息时会触发 onmessage 事件，通过 event.data 获取消息内容。

js实现scoket

错误处理

socket.onerror = function(error) {
    console.error('WebSocket 错误: ', error);
};

连接或通信过程中发生错误时触发 onerror 事件。

关闭连接处理

socket.onclose = function(event) {
    console.log('连接已关闭', event);
};

连接关闭时触发 onclose 事件，可通过 event.code 和 event.reason 获取关闭原因。

发送消息

function sendMessage(message) {
    if (socket.readyState === WebSocket.OPEN) {
        socket.send(message);
    } else {
        console.error('连接未就绪');
    }
}

确保连接处于打开状态（WebSocket.OPEN）时发送消息。

js实现scoket

关闭连接

function closeConnection() {
    socket.close(1000, '正常关闭');
}

可以指定关闭代码和原因，1000 表示正常关闭。

使用 Socket.io 库实现

对于更复杂的需求，可以使用 Socket.io 库，它提供了更多功能和更好的兼容性。

安装 Socket.io 客户端

npm install socket.io-client

基本使用

import io from 'socket.io-client';

const socket = io('http://your-server.com');

socket.on('connect', () => {
    console.log('已连接');
});

socket.on('chat message', (msg) => {
    console.log('消息: ' + msg);
});

socket.emit('chat message', 'Hello Server');

Socket.io 使用事件驱动模式，支持自定义事件和自动重连等功能。