作者:vousiu

出处:http://www.cnblogs.com/vousiu

本实例参考自Mike Cantelon等人的《Node.js in Action》一书。

本实例要实现如下一个聊天App。左上的“Winter”为显示的房间的名字。中间为聊天消息,斜体字为系统消息,非斜体为聊天内容。右侧为房间列表,点击房间名可以进入房间。在下方输入框输入内容后,点击“提交”则可以发送聊天信息,或者发送更改昵称和更换房间的指令。

整个程序的架构图如下:

文件目录结构如下所示:

其中,socket.io包提供了一些webSocket方法,它可以跟http服务器在同一个端口进行监听,socket服务器可以对用户的连接和事件以回掉函数的方式进行响应。

chat_server.js用socket.io写了一个聊天服务器,处理与聊天相关的事件。它有一系列变量来存储每个socket所对应的名字、房间号还有系统已占用的名字。在每个用户与其建立connection时,它用回调函数为这个用户赋一个名字和房间,然后为这个用户的每个socket设置一个回调。有的回调就对发出的用户进行响应,有的则需要对一批用户进行响应(比如有人进了他们的房间),就像下图所示:

chat_server监听 <--------- connect ---------- 用户上线

chat_server处理 <--------- socket.io --------- 用户界面命令(chat.js中的函数)

处理完毕 ----------- socket.io--------> 界面更新(chat_ui.js中的回调函数来处理)

----- (broadcast) socket.io --------> 一批用户的界面

chat_server监听 <-------- disconnect -------- 用户下线

这个chat_server同时对多个用户的connection进行相应,那会不会造成在多线程中经常出现的问题:给多个用户分配同一个名字呢?按我的理解是不会的,因为它是一个connection一个connection的处理,对一个用户的connection回调函数执行完前,另一个用户的包含在connection回调函数中的名字分配函数不会进入node队列。

chat.js中定义了向一个socket发送各种消息和指令的函数。

chat_ui.js定义了在界面加载完时执行的一个回调,该回调注册了:对于用户界面操作的相应函数 和 对于socket.io的响应函数。

index.html和style.css则提供了用户界面。

最后,server.js在3000端口进行监听和文件传输,默认传输index.html文件。它还有一个对于文件的缓存功能。然后启动了chat_server服务器。

除了对于功能的实现,对于这个实例的一个关注点就是,它是一个Node程序,因此很多地方是使用异步回调函数的方法来写的,会出现一个回调套一个回调,里面再套一个回调的写法,这值得写惯了传统程序的程序员进行注意。

对于这些文件中代码的具体内容,将在接下来的文章中做具体介绍。

Node聊天程序实例01的更多相关文章

  1. Node聊天程序实例04:chat_ui.js

    作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. 这个程序在客 ...

  2. Node聊天程序实例03:chat.js

    作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. chat.j ...

  3. Node聊天程序实例06:server.js

    作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. server ...

  4. Node聊天程序实例05:index.html和style.css

    作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. index. ...

  5. Node聊天程序实例02:chat_server.js

    作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. chat_s ...

  6. WinSocket聊天程序实例(多线程)

    #pragma comment(lib,"Ws2_32.lib") #include <stdio.h> #include <Winsock2.h> SOC ...

  7. boost asio异步读写网络聊天程序client 实例具体解释

    boost官方文档中聊天程序实例解说 数据包格式chat_message.hpp <pre name="code" class="cpp">< ...

  8. boost asio异步读写网络聊天程序客户端 实例详解

    boost官方文档中聊天程序实例讲解 数据包格式chat_message.hpp <pre name="code" class="cpp">< ...

  9. Node.js + Web Socket 打造即时聊天程序嗨聊

    前端一直是一块充满惊喜的土地,不仅是那些富有创造性的页面,还有那些惊赞的效果及不断推出的新技术.像node.js这样的后端开拓者直接将前端人员的能力扩大到了后端.瞬间就有了一统天下的感觉,来往穿梭于前 ...

随机推荐

  1. [原创]java WEB学习笔记108:Spring学习---基于配置文件的形式实现AOP

    本博客的目的:①总结自己的学习过程,相当于学习笔记 ②将自己的经验分享给大家,相互学习,互相交流,不可商用 内容难免出现问题,欢迎指正,交流,探讨,可以留言,也可以通过以下方式联系. 本人互联网技术爱 ...

  2. Web攻防之XSS,CSRF,SQL注入

    摘要:对Web服务器的攻击也可以说是形形色色.种类繁多,常见的有挂马.SQL注入.缓冲区溢出.嗅探.利用IIS等针对Webserver漏洞进行攻击.本文结合WEB TOP10漏洞中常见的SQL注入,跨 ...

  3. sublime text3 前端编译神器,浏览器实时显示

    前端编译器有很多,Dreamweaver,sublime text ,webstorm,但在使用之后感觉sublime text3就是前端的编译神器 首先sublime text3最好使用英文原版,虽 ...

  4. swift基础:第二部分:函数和闭包

    今天本来想利用上午的时间本来打算将swift基础部分学习完的,不巧的是,后台来和我讨论用户评价的接口,讨论过后,商讨出一种可行的方案,十几分钟时间过去了,我拿到将接口介入到已经完成的页面中,完美,终于 ...

  5. FORM中需要反复选择LOV

    注意:1.字段长度问题 2.提示显示样式:第一条记录 3.那些不现实的返回项,或者是只读的返回项可以  将从列表中验证 改为 否    比如一个LOV 返回2个值 但是其实只用选择前一个就可以带出后一 ...

  6. java关键字 super 和 this

    简单粗暴的说就是: super: 是指父类,想要在子类方法中调用父类的实例变量或方法可以通过super 来访问 this:是指当前类,想要访问当前类的实例变量和方法可以使用this,同时可以省略

  7. Canvas绘图中的路径描边与填充

    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博客地址为http://www.cnblogs.com/jasonnode/ .网站上有对应每一 ...

  8. font-family:“微软雅黑” OR font-family:Microsoft Yahei

    sublime对中文编码支持的不好,可以考虑用后者.

  9. python之计算器(第四天)

    作业: 使用正则表达式和递归实现计算器功能. 实现: 1.实现带括号的计算 2.实现指数.加减乘除求余等功能 一.实例说明: 本实例自己写了个版本,但依旧存在一点bug,例:-2-2等计算问题,故最后 ...

  10. GirdView 追忆学生时代的百思不得解

    临近年关,越多越多的园友开始了对工作.生活的总结,以及对来年目标的确立.这很励志,人是一根能思想的苇草,想来想去,我实在没什么惊天地.泣鬼神的英勇事迹,16年毕业季,按部就班的在时间的马车上颠簸,阅读 ...