nodejs如何结合socket.io实现的即时通讯功能-mile米乐体育

这篇文章主要为大家展示了“nodejs如何结合socket.io实现的即时通讯功能”，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下“nodejs如何结合socket.io实现的即时通讯功能”这篇文章吧。

具体如下：

动态web

在html5以前，web的设计上并没有考虑过动态，他一直是围绕着文档设计的，我们看以前比较老的网站，基本上都是某一刻用来显示单一的文档的，用户请求一次web页面，获取一个页面，但是随着时间的推移，人们想要web做更多的事情了，而不是简单的要显示文档，而javascript一直处于开发人员推动web页面功能的发展中心。

ajax无疑是动态web页面的一个重大发展，他不再需要我们即使更新一点内容，也需要刷新整个页面了，但是有些方面，又体现了他的不足。如果从服务器请求数据，他固然号，但是如果服务器想要将数据推送到浏览器呢。ajax技术无法很容易的支持将数据推送到客户，虽然可以，但是需要跨国很多的障碍才行，而且不同的浏览器工作方式也不同，例如ie和firebox他们的内核就不一样，从而工作方式也不一样。

websocket是在对服务器和客户端之间实现双向通信问题的相应。他的思想是，从头开始，设计一个开发人员可以使用的标准以便以一直的方式创建应用程序，而不是通过复杂的，并不总能设置所有浏览器的工作。他的思想是web服务器和浏览器之间保持持久打开，这就使得不管是服务器还是浏览器都可以在想要的时候推送数据。因为连接是持久的，所以数据的交换非常的快，也就成了实时的了。

socket.io

说了那么多，我们介绍一下正主，socket.io是node.js的一个模块，他提供通过websocket进行通信的一种简单方式，websocket协议很复杂，但是socket.io提供了服务器和客户端双方的组件，所以只需要一个模块就可以给应用程序加入对websocket的支持。而且还能支持不同的浏览器。

基础的socket.io

socket.io既能在服务端也能在客户端工作，要使用它，必须将其添加到服务器端的javascript(node.js)和客户端的javascript(jquery)中，这是以为内通信通常是双向的，所以sokcet.io需要能在两边工作。

varserver=http.createserver(function(req,res){ fs.readfile('./index.html',function(error,data){ res.writehead(200,{'content-type':'text/html'}); res.end(data,'utf-8'); }); }).listen(3000,"127.0.0.1"); console.log('serverrunningathttp://127.0.0.1:3000/');

而且必须将socket.io库包含起来，才能加入socket.io的功能。

vario=require('socket.io').listen(server);

然后加入一个事件来响应客户端到底是连接了，还是断开了。事件如下：

io.sockets.on('connection',function(socket){ console.log('userconnected'); socket.on('disconnect',function(){ console.log('userdisconnected'); }); });

是不是觉得非常的简单，下面我们看一下完整的代码实现是如何实现的吧：

简单socket.io应用

新建app.js

新建文件夹socket.io，在该文件夹下新建app.js，写如下代码：

varhttp=require('http'); varfs=require('fs'); varserver=http.createserver(function(req,res){ fs.readfile('./index.html',function(error,data){ res.writehead(200,{'content-type':'text/html'}); res.end(data,'utf-8'); }); }).listen(3000,"127.0.0.1"); console.log('serverrunningathttp://127.0.0.1:3000/'); vario=require('socket.io').listen(server); io.sockets.on('connection',function(socket){ console.log('userconnected'); socket.on('disconnect',function(){ console.log('userdisconnected'); }); });

新建index.html

新建index.html文件，代码如下：

       
socket.ioexample
    

新建package.json

新建package.json来引入模块。

{ "name":"socketio_example", "version":"4.13.2", "private":true, "dependencies":{ "socket.io":"1.4.5" } }

版本号大家可以输入自己的nodejs -v，或者socket.io -v来查看自己的版本号。

运行

如果大家没有安装socket.io，可以运行如下代码，如果安装了，自动跳过这一步。

npminstallsocket.io

从终端运行如下命令安装模块

npminstall

运行如下命令启动服务器

nodeapp.js

打开浏览器，输入http://127.0.0.1:3000/，多打开几个页签，都输入该网址，再任意关闭一个页签，然后看看我们的cmd命令窗口是不是如下：

这里会详细的记录又多少个用于连接了，也有多少个用户断开连接了，这样就能统计我们网页的访问量了。

从服务器发送数据到客户端

上边的实例我们已经实现了连接或者断开服务器做记录了，但是我们要是想要推送消息怎么办，例如我们好友的qq上线了，腾讯都会咳嗽一下来提醒我们有好友上线。下面我们来做一下这个功能功能。

发送给单个用户

io.sockets.on('connection',function(socket){ socket.emit('message',{text:'你上线了'}); });

发给所有用户

io.sockets.on('connection',function(socket){ socket.broadcast.emit('message',{'你的好某xxx上线了'}); });

无论是发送给单个用户还是所有用户，这个message是自己写的，但是要在客户端用，所以命名要注意。

客户端

在客户端我们可以添加侦听事件来接收数据。

varsocket=io.connect('http://127.0.0.1:3000'); socket.on('message',function(data){ alert(data.text); })

通过这些功能，我们就在第一个例子的基础上，实现用户数量的统计。这里只需要在服务端设置一个变量，count,如果有一个上线，那么就数量 1，并通知所有用户，最新的在线人数。

新建app.js

varhttp=require('http'); varfs=require('fs'); varcount=0; varserver=http.createserver(function(req,res){ fs.readfile('./index.html',function(error,data){ res.writehead(200,{'content-type':'text/html'}); res.end(data,'utf-8'); }); }).listen(3000,"127.0.0.1"); console.log('serverrunningathttp://127.0.0.1:3000/'); vario=require('socket.io').listen(server); io.sockets.on('connection',function(socket){ count  ; console.log('userconnected' count 'user(s)present'); socket.emit('users',{number:count}); socket.broadcast.emit('users',{number:count}); socket.on('disconnect',function(){ count--; console.log('userdisconnected'); socket.broadcast.emit('users',{number:count}); }); });

创建index.html文件

       
socket.ioexample
 
howmanyusersarehere?
      

创建package.json文件

{ "name":"socketio_example", "version":"4.13.2", "private":true, "dependencies":{ "socket.io":"1.4.5" } }

安装模块npm install

启动服务器node app.js

打开浏览器，输入http://127.0.0.1:3000,可以看到如下图片：

再打开一个连接http://127.0.0.1:3000，可以看到如下结果：

可以看到如果我们打开两个连接，那么两个页签都会显示当前又两个用户在线，如果关闭其中一个，我们可以看到又显示只有一个用户在线。

将数据广播给客户端

接下来我们来看看socket.io是如何实现客户端与客户端的通信呢。要想实现该功能，首先需要客户端将消息发送到服务端，·然后服务端发送给除自己之外的其他客户。服务器将消息发送给客户端的方法在上一个例子中我们已经实现了，那么我们需要的是客户端把接收到的消息发送给服务器。

下边的代码思想是利用表单来实现的。

实现的思想是,将jquery和socketio库包含进来，只是浏览器拦截127.0.0.1:3000的服务，使用jquery的submit方法加入侦听期，等候用户提交表单。

发送消息给socket>io服务器，文本区域的内容位消息发送。

添加return false ，防止表单在浏览器窗口提交。

在上边已经说过服务器如何广播消息，下边我们说一下客户端如何显示客户端发送的消息。

socket.on('pushmessage',function(data){ $('form').after('
' data.text '
'); })

实例实现

创建messaging的新文件夹

在文件夹下创建package.json文件，代码如下：

{ "name":"socketio_example", "version":"4.13.2", "private":true, "dependencies":{ "socket.io":"1.4.5" } }

创建app.js文件，代码如下：

varhttp=require('http'); varfs=require('fs'); varserver=http.createserver(function(req,res){ fs.readfile('./index.html',function(error,data){ res.writehead(200,{'content-type':'text/html'}); res.end(data,'utf-8'); }); }).listen(3000,"127.0.0.1"); console.log('serverrunningathttp://127.0.0.1:3000/'); vario=require('socket.io').listen(server); io.sockets.on('connection',function(socket){ socket.on('message',function(data){ socket.broadcast.emit('pushmessage',data); }); });

创建index.html

       
socket.ioexample
         

加载模块npm install

启动服务器node app.js

然后打开浏览器的多个页签，都输入http://127.0.0.1:3000

可以看到我们再任何一个窗口输入内容，都会在其他的页面显示我们输入的内容，效果如下：

以上是“nodejs如何结合socket.io实现的即时通讯功能”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注恰卡编程网行业资讯频道！