利用socket.io实现多人聊天室(基于Nodejs)

最新推荐文章于 2024-08-19 16:53:37 发布

Newpidian

最新推荐文章于 2024-08-19 16:53:37 发布

阅读量9k

点赞数 1

分类专栏： Node 文章标签： nodejs 聊天 websocket

本文链接：https://blog.csdn.net/Newpidian/article/details/51043415

版权

本文档介绍了如何使用Node.js和socket.io构建一个多人聊天室。首先，讲解了socket.io的基本概念，它是一个用于处理浏览器间通信的库，尤其在WebSocket不被支持时提供降级策略。接着，详细阐述了服务器端的实现，包括安装socket.io和express模块，以及运行服务器程序。然后，介绍了客户端的实现，包括HTML、JavaScript和CSS文件的创建和内容。最后，展示了运行结果，包括用户的加入、发送消息和退出操作。

摘要由CSDN通过智能技术生成

socket.io简介

在Html5中存在着这样的一个新特性，引入了websocket，关于websocket的内部实现原理可以看这篇文章，这篇文章讲述了websocket无到有，根据协议，分析数据帧的头，进行构建websocket。虽然代码短，但可以很好地体现websocket的原理。

http://blog.csdn.net/newpidian/article/details/50850670

，这个特性提供了浏览器端和服务器端的基于TCP连接的双向通道。但是并不是所有的浏览器都支持websocket特性，故为了磨平浏览器间的差异，为开发者提供统一的接口，引入了socket.io模块。在不支持websoket的浏览器中，socket.io可以降级为其他的通信方式，比如有AJAX long polling ，JSONP Polling等。
模块安装
新建一个package.json文件，在文件中写入如下内容：

{
  "name": "socketiochatroom",
  "version": "0.0.1",
  "dependencies": {
    "socket.io": "*",
    "express":"*"
  }
}

npm install

执行完这句，node将会从npm处下载socket.io和express模块。

服务器端的实现

在文件夹中添加index.js文件，并在文件中写入如下内容：

/**
 * Created by bamboo on 2016/3/31.
 */

var app = require('express')();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.get('/', function (req, res) {
   
    "use strict";
    res.end("<h1>socket server</h1>")
});

/*在线人员*/
var onLineUsers = {};
/* 在线人数*/
var onLineCounts = 0;

/*io监听到存在链接，此时回调一个socket进行socket监听*/
io.on('connection', function (socket) {
   
    console.log('a user connected');
    /*监听新用户加入*/
    socket.on('login', function (user) {
   
        "use strict";
        //暂存socket.name 为user.userId;在用户退出时候将会用到
        socket.name = user.userId;
        /*不存在则加入 */
        if (!onLineUsers.hasOwnProperty(user.userId)) {
            //不存在则加入
            onLineUsers[user.userId] = user.userName;
            onLineCounts++;
        }
        /*一个用户新加入，向所有客户端监听login的socket的实例发送响应，响应内容为一个对象*/
        io.emit('login', {onLineUsers: onLineUsers, onLineCounts: onLineCounts, user: user});
        console.log(user.userName, "加入了聊天室");//在服务器控制台中打印么么么用户加入到了聊天室
    });
    /*监听用户退出聊天室*/
    socket.on('disconnect', function () {
   
        "use strict";
        if (onLineUsers.hasOwnProperty(socket.name)) {
            var user = {userId: socket.name, userName: onLineUsers[socket.name]};
            delete onLineUsers[socket.name];
            onLineCounts--;

            /*向所有客户端广播该用户退出群聊*/
            io.emit('logout', {onLineUsers: onLineUsers, onLineCounts: onLineCounts, user: user});
            console.log(user.userName, "退出群聊");
        }
    })
    /*监听到用户发送了消息，就使用io广播信息，信息被所有客户端接收并显示。注意，如果客户端自己发送的也会接收到这个消息，故在客户端应当存在这的判断，是否收到的消息是自己发送的，故在emit时，应该将用户的id和信息封装成一个对象进行广播*/
    socket.on('message', function (obj) {
   
        "use strict";
        /*监听到有用户发消息，将该消息广播给所有客户端*/
        io.emit('message', obj);
        console.log(obj.userName, "说了:", obj.content);
    });
});
/*监听3000*/
http.listen(3000, function () {