nodejs通过websocket部署建议聊天室

最新推荐文章于 2024-03-29 12:59:04 发布

种一棵树Tree

最新推荐文章于 2024-03-29 12:59:04 发布

阅读量174

点赞数 1

文章标签： websocket 网络协议网络

本文链接：https://blog.csdn.net/weixin_45302013/article/details/135957809

版权

1、安装nodejs。

2、进入项目文件夹执行命令行，安装nodejs-websocket

npm init ‐y
npm install nodejs‐websocket

3、服务端 server.js

var ws = require("nodejs-websocket")
var port = 3000;
var user = 0;

// 创建一个连接
var server = ws.createServer(function (conn) {
    console.log("创建一个新的连接‐‐‐‐‐‐‐‐");
    user++;
    conn.nickname = "user" + user;
    conn.fd = "user" + user;
    var mes = {};
    mes.type = "enter";
    mes.data = conn.nickname + " 进来啦"
    broadcast(JSON.stringify(mes)); // 广播

    //向客户端推送消息
    conn.on("text", function (str) {
        console.log("回复 " + str)
        mes.type = "message";
        mes.data = conn.nickname + " 说: " + str;
        broadcast(JSON.stringify(mes));
    });

    //监听关闭连接操作
    conn.on("close", function (code, reason) {
        console.log("关闭连接");
        mes.type = "leave";
        mes.data = conn.nickname + " 离开了"
        broadcast(JSON.stringify(mes));
    });

    //错误处理
    conn.on("error", function (err) {
        console.log("监听到错误");
        console.log(err);
    });
}).listen(port);

function broadcast(str) {
    server.connections.forEach(function (connection) {
        connection.sendText(str);
    })
}

4、客户端

<html>

<body>
    <h1>Websocket简易聊天</h1>
    <div id="app">
        <input id="sendMsg" type="text" />
        <button id="submitBtn">发送</button>
    </div>
</body>
<script type="text/javascript">
    //在页面显示聊天内容
    function showMessage(str, type) {
        var div = document.createElement("div");
        div.innerHTML = str;
        if (type == "enter") {
            div.style.color = "blue";
        } else if (type == "leave") {
            div.style.color = "red";
        }
        document.body.appendChild(div);
    }

    //新建一个websocket
    var websocket = new WebSocket("ws://10.250.1.118:3000");
    //打开websocket连接
    websocket.onopen = function () {
        console.log("已经连上服务器‐‐‐‐");
        document.getElementById("submitBtn").onclick = function () {
            var txt = document.getElementById("sendMsg").value;
            if (txt) {
                //向服务器发送数据
                websocket.send(txt);
            }
        };
    };
    //关闭连接
    websocket.onclose = function () {
        console.log("websocket close");
    };
    //接收服务器返回的数据
    websocket.onmessage = function (e) {
        var mes = JSON.parse(e.data); // json格式
        showMessage(mes.data, mes.type);
    };
</script>

</html>