Node.js(Express4.x)搭建聊天室2——消息发送与监听

0.目标与前置条件

这一节,我将实现用户修改昵称与收发消息。

修改昵称与收发消息

这一节内容是在上一节完成的情况下进行的,请先参照上一节完成基本框架的搭建:
Node.js(Express4.x)搭建聊天室1——基本框架


我把搭建聊天室的步骤分成了几个部分,请按顺序阅读:

获取代码
Node.js(Express4.x)搭建聊天室1——基本框架
Node.js(Express4.x)搭建聊天室2——消息发送与监听
Node.js(Express4.x)搭建聊天室3——完善网页


1. 服务端

接下来的代码,要添加到model/chatroom.js的“//在这里添加更多监听的消息”后面:

      /* *************** 更改昵称 *************** */
      socket.on('change_name', function (newname) {
        if (addedUser) {
            var oldname = socket.username;
            socket.username = newname;

            // 告知所有用户
            socket.broadcast.emit('name_changed', {
                username: newname,
                msg: "["+oldname+"] 改名为 ["+socket.username + "]",
                type: "BROADCAST",
                numUsers: guest_num
            });
        }
      });
      
      
      /* *************** 发送消息 *************** */
      socket.on('send_msg', function (msg) {
        if (addedUser) {

            // 广播消息
            socket.broadcast.emit('msg_sent', {
                username: socket.username,
                msg: msg,
                type: "BROADCAST",
            });
        }
      });

我在这里新增了两个监听接口:

  • change_name:当服务端接收到该消息时,会将一起传来的newname替换用户当前的username,并存储在socket.username中,然后广播告知所有用户。
  • send_msg:当服务端接收到该消息时,将把一起传来的msg广播给所有用户。

2. 客户端

在views/index.jade文件中,在“// 添加更多的消息发送或监听”后面添加如下代码:

//修改昵称
function change_name(name){
    socket.emit('change_name', name, function (data) {
        console.log(data);
    });
}
// 监听修改昵称后返回的消息
socket.on('name_changed', function (data) {
    console.log(data);
});

//发送消息
function send_msg(msg){
    socket.emit('send_msg', msg, function (data) {
        console.log(data);
    });
}
// 监听消息
socket.on('msg_sent', function (data) {
    console.log(data);
});

这里我们定义了两个函数:

  • change_name:调用后,客户端向服务端发送“change_name”消息,从而把自己的昵称修改为name。
  • send_msg:调用后,客户端向服务器端发送“send_msg”消息,服务端会把msg广播给所有用户。

对应的,我们还新增了两个监听:

  • name_changed:监听服务端发出的“name_changed”消息。当聊天室中有用户修改了昵称后,服务端会向所有人发出该消息。
  • msg_sent: 监听服务端发出的“msg_sent”消息。当聊天室中有用户发出消息,服务端会转发给所有人。

3.整理一下思路

当客户端1发出“change_name”消息给服务端后,服务端会修改该用户的昵称,并广播一条“name_changed”的消息给所有用户(这里是客户端2和客户端3),如下图所示:

修改昵称的流程

当客户端1发出“send_msg”消息给服务端后,服务端广播一条“msg_sent”的消息给所有用户(这里是客户端2和客户端3),如下图所示:

发送消息和监听消息

4.测试

分别打开两个浏览器A、B,访问http://127.0.0.1:3000。

在浏览器B的控制台中,输入change_name("Mike的读书季"),即把浏览器B的用户昵称改为“Mike的读书季”;执行后,在浏览器A中会收到“[Mike] 改名为 [Mike的读书季]”的消息。

在浏览器B的控制台中,输入send_msg("欢迎你们!"),即浏览器B的用户发送消息“欢迎你们!”;执行后,在浏览器A中会收到“欢迎你们!”的消息。

更改昵称和发送消息

5.小结

至此,一个聊天室的“骨架”就算搭好了。接下来,为了让这个聊天室真正可用,还要在客户端的页面上做一些处理;这个应该是前端工程师的工作,不过作为一个Node工程师,通吃前后端本来就是应该的,所以我打算越俎代庖,把前端也一起做了。

欢迎阅读下一节:
Node.js(Express4.x)搭建聊天室3——完善网页


原创文章,未经许可,请勿转载
作者:Mike的读书季
日期:2016.09.20
QQ:1139904786
Blog:http://blog.csdn.net/kkdestiny

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 151,688评论 1 330
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 64,559评论 1 273
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 101,749评论 0 226
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 42,581评论 0 191
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 50,741评论 3 271
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 39,684评论 1 192
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,122评论 2 292
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 29,847评论 0 182
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 33,441评论 0 228
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 29,939评论 2 232
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,333评论 1 242
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 27,783评论 2 236
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,275评论 3 220
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 25,830评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,444评论 0 180
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 34,553评论 2 249
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 34,618评论 2 249

推荐阅读更多精彩内容