一对一聊天室 socket.io + node

最新推荐文章于 2024-01-16 21:09:37 发布

Fade Away

最新推荐文章于 2024-01-16 21:09:37 发布

阅读量1.7k

点赞数

分类专栏： NODEJS

本文链接：https://blog.csdn.net/qq_26239917/article/details/90489000

版权

NODEJS 专栏收录该内容

32 篇文章 2 订阅

订阅专栏

var fs = require('fs')
var http = require('http')
var socketIO = require('socket.io')
var express = require("express");
var path = require("path");


var app = express();
app.use(express.static(path.join(__dirname, '/'))); //设置 express  static 静态文件 

app.get("/chat", (req, res) => {
    fs.readFile("./client.html", (err, data) => {
        if (err) throw err;
        res.write(data);
        res.end();
    })
})

var server = http.createServer(app);

var users = {};//  sid  socket
var reflect = {};//  name  sid
var io = socketIO.listen(server);
io.on('connection', function (socket) {
    console.log(socket.id + "已经连接完成")
    // console.log(socket.id+"已经连接完成")
    //每次连接都对应一个  sid
    //每一个用户都有一个socket  对应一个 sid  对应一个  username
    // console.log(socket.id);
    io.sockets.emit('connectSucc', socket.id);

    //
    //发送私密消息
    socket.on('private message', function (from, to, msg) {
        // from -->sid
        //to -->sid
        for (const key in reflect) {
            console.log(key, ":", reflect[key])
        }
        // console.log('I received a private message by ', reflect[from],from, ' say to ', reflect[to],to, msg);
        if (reflect[to] in users) {
            // console.log('to :' + to);
            //to 222
            // users[reflect[to]].emit('to' + to, { mess: msg });
            users[reflect[to]].emit('to' + to, { person: from, content: msg });
            console.log('to' + to);
            console.log(reflect[to]);
            //
            // console.log(reflect[to],to+'_to');
            // xor  <--> 222
        }
    });

    //新增用户
    socket.on('new user', function (data) {
        reflect[data] = socket.id;
        // var sidList =
        //data 是 from 谁发的 添加到这个  users列表  登陆的用户

        if (socket.id in users) {
            socket.emit("userHasLogin");
        } else {
            // var nickname = data;
            users[socket.id] = socket;
            console.log(data, socket.id, "已经登录！")
            // users["aaa"] = socket
            //每一个登陆的用户有一个自己的socket
        }
        // console.info(users);
    });
    //断开连接
    socket.on('disconnect', function () {
        console.log('user' + socket.id + ' disconnected');
    });
});


server.listen(8080, function () {
    console.log('Listening at: http://localhost:8080');
});

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!-- <link rel='stylesheet' href='/stylesheets/style.css' /> -->
    <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
    <link href="https://v3.bootcss.com/assets/css/docs.min.css" rel="stylesheet">
    <script src="bootstrap/js/jquery-1.10.1.js"></script>
    <script src="bootstrap/js/bootstrap.min.js"></script>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        #message_list li {
            list-item: none;
        }
        .box {
            width: 300px;
        }

        #message_list {
            width: 300px;
            height: 500px;
            background: #29A3F1;
            overflow: auto;
            border: 1px solid #666666;
        }
    </style>
</head>

<body>
    <div class="box">
        <div class="in_box">
            姓名:<input id="user_name" type="text"> <button class="login">登录</button>
        </div>
         <div class="in_box">
            发送给：<input type="text" id="to">
        </div>
         <div class="in_box">
            消息内容:<input type="text" id="message"><button type="button" id="send" data-toggle="modal"
                data-target="#myModal">发送</button>
        </div>
    </div>

       
    <ul id="message_list">
    </ul>
     
</body>
<script src="./js/jquery.js"></script>
<script src="./js/socket.io.js"></script>
<script>

    $(function () {
        var socket;
        var flag = 1;
        var from, msg, to;
        $message_list = $('#message_list');
        $(".login").click(() => {
            socket = io.connect("http://localhost:8080");
            from = $('#user_name').val();
            console.log('from', from);
            socket.emit('new user', user_name.value);

            socket.on('connectSucc', function (data) {
                console.log("from", from);
                //undefined
                $('#message_list').append('<li>' + data + '已经上线！</li><li>');
            });
            $("#send").click(function (e) {
                from = $('#user_name').val(),
                    msg = $('#message').val(),
                    to = $('#to').val(),
                    socket.emit('private message', from, to, msg);
            });
            socket.on('to' + from, function (data) {
                console.log('to' + from);
                $('#message_list').append('<li>' + data.person + '说' + data.content + '</li><li>');
            });
            //不是以某一个函数为前提的函数要单独放在外面
            socket.on('userHasLogin', function () {
                // alert("");
                console.log(`该用户已经登录`);
            });
        })
    });
</script>

</html>