Node聊天程序实例01

作者: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程序,因此很多地方是使用异步回调函数的方法来写的,会出现一个回调套一个回调,里面再套一个回调的写法,这值得写惯了传统程序的程序员进行注意。

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

时间: 2024-11-05 18:27:33

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

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

作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. 这个程序在客户端浏览器运行.负责对UI操作的响应和与chat_server的通信.

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

作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. server.js 跟前文所说过的原因一样,我认为此处的cache可以不作为参数传进来.此处由于是传引用因此不影响.但若传的是形参则cache的值不是最新的,因为在后一个异步函数加入异步队列时,异步队列中前一个函数还没有运行:等它运行了将cache的值改变了,而后一个异步函数的形参值仍然是旧值,这就将造成多余的读硬盘.

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

作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. index.html style.css body { padding: 50px; font: 14px "Lucida Grande", Helvetica, Arial, sans-serif; } a { color: #00B7FF; } #content { width: 800px; m

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

作者:vousiu 出处:http://www.cnblogs.com/vousiu 本实例参考自Mike Cantelon等人的<Node.js in Action>一书. chat_server.js: 客户端和服务端就是不断通过socket.io事件来通信: chat_server ---------------> chat_ui chat_server <--------------- chat_ui 其中的这一段: socket.on('rooms', function(

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

前端一直是一块充满惊喜的土地,不仅是那些富有创造性的页面,还有那些惊赞的效果及不断推出的新技术.像node.js这样的后端开拓者直接将前端人员的能力扩大到了后端.瞬间就有了一统天下的感觉,来往穿梭于前后端之间代码敲得飞起,从此由前端晋升为'前后端'. 图片来自G+ 本文将使用Node.js加web socket协议打造一个网页即时聊天程序,取名为HiChat,中文翻过来就是'嗨聊',听中文名有点像是专为寂寞单身男女打造的~ 其中将会使用到express和socket.io两个包模块,下面会有介绍

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

// // chat_client.cpp // ~~~~~~~~~~~~~~~ // // Copyright (c) 2003-2013 Christopher M. Kohlhoff (chris at kohlhoff dot com) // // Distributed under the Boost Software License, Version 1.0. (See accompanying // file LICENSE_1_0.txt or copy at http://ww

详解Node.js API系列C/C++ Addons(3) 程序实例

http://blog.whattoc.com/2013/09/08/nodejs_api_addon_3/ 再续前文,前文介绍了node.js 的addon用法和google v8 引擎,下面,我们进入真正的编码,下面将会通过六个例子,学习node addon 范例,了解addon编程的特性 创建一个空项目 随机数模块 向模块传递参数 回调函数处理 线程处理 对象管理 创建一个空项目 vi modulename.cpp #include <node.h> void RegisterModul

微信小程序实例教程(一)

序言 开始开发应用号之前,先看看官方公布的「小程序」教程吧!(以下内容来自微信官方公布的「小程序」开发指南) 本文档将带你一步步创建完成一个微信小程序,并可以在手机上体验该小程序的实际效果.这个小程序的首页将会显示欢迎语以及当前用户的微信头像,点击头像,可以在新开的页面中查看当前小程序的启动日志. 1. 获取微信小程序的 AppID 首先,我们需要拥有一个帐号,如果你能看到该文档,我们应当已经邀请并为你创建好一个帐号.注意不可直接使用服务号或订阅号的 AppID. 利用提供的帐号,登录https

使用 Bluemix? Live Sync 快速更新 Bluemix 上运行的应用程序实例

如果您要构建 Node.js 应用程序,那么可以使用 IBM® Bluemix® Live Sync 快速更新 Bluemix 上的应用程序实例,并像在桌面上进行操作一样进行开发,而无需重新部署.执行更改后,您可以立即在运行中的 Bluemix 应用程序中看到该更改.Bluemix Live Sync 可从命令行以及在 Web IDE 中运行.您可以使用 Bluemix Live Sync 来调试以 Node.js 编写的应用程序. Bluemix Live Sync 由三个功能部件组成 桌面同