简单的WebSocket客户端和服务器端的例子，以帮助理解WebSocket如何工作。

最新推荐文章于 2024-07-29 13:58:45 发布

JiuSanS

最新推荐文章于 2024-07-29 13:58:45 发布

阅读量72

点赞数 3

本文链接：https://blog.csdn.net/qq_38045525/article/details/139621354

版权

<!DOCTYPE html>
<html>
<head>
    <title>WebSocket Client</title>
    <script>
        // 创建WebSocket连接
        var socket = new WebSocket("ws://your-server-url:port");

        // 连接打开时触发
        socket.addEventListener('open', function (event) {
            console.log("我们连接成功啦.");
            // 发送消息到服务器
            socket.send("Hello, Server!");
        });

        // 接收到服务器消息时触发
        socket.addEventListener('message', function (event) {
            console.log("服务端传来数据啦: " + event.data);
        });

        // 连接关闭时触发
        socket.addEventListener('close', function (event) {
            console.log("连接关闭了.");
        });

        // 连接出错时触发
        socket.addEventListener('error', function (event) {
            console.error("连接发生错误.");
        });
    </script>
</head>
<body>
    <h1>WebSocket 客户端实例</h1>
    <p>请查看浏览器的控制台输出。</p>
</body>
</html>

 // npm install ws
 // 然后，创建一个名为server.js的文件，编写如下代码：


const WebSocket = require('ws');

const server = new WebSocket.Server({ port: 3000 });

server.on('connection', (socket) => {
    console.log("有客户端连接.");

    // 监听客户端发来的消息
    socket.on('message', (message) => {
        console.log("收到客户端消息: " + message);
        // 向客户端发送消息
        socket.send("你好，客户端！你刚才说了: " + message);
    });

    // 当客户端断开连接时触发
    socket.on('close', () => {
        console.log("客户端已断开连接.");
    });

    // 发送一条欢迎消息给新连接的客户端
    socket.send("欢迎连接到WebSocket服务器！");
});

console.log("WebSocket服务器正在监听端口3000...");