基于socket.io和node.js搭建即时通信系统


Posted in Javascript onJuly 30, 2014

使用socket.io和nodejs搭建websocket服务器端

socket.io不仅可以搭建客户端的websocket服务,而且支持nodejs服务器端的websocket。

下面让我来介绍一下怎么安装配置nodejs.

进入http://nodejs.org/#download下载msi文件。一直点next安装。最后文件会自动安装在C:\nodejs目录下。

安装完成后,会自动配置环境环境变量。如果没有自动配置,自己手动在path处加上 ;C:\nodejs\。

安装完成后,需要配置npm来管理node.js的模块。

在window下安装npm需要安装git。

安装完git后,打开gitbush。执行下面几步:

git config --system http.sslcainfo /bin/curl-ca-bundle.crt

git clone --recursive git://github.com/isaacs/npm.git

cd npm

node cli.js install npm -gf

第一个是设置不会有任何提示,第二步会到github上下载npm会有下载文件和进度,第四步是安装npm到node.js会复制几个文件cmd文件和mode_modules文件夹到nodejs目录。

这样就配置好了npm。

如果需要安装什么模块直接输入npm install ***。

没有npm的或者windows用户可以使用github下载socket.io并且放入到node_modules文件夹中,具体配置可以参考文章:《nodejs教程:配置nodejs.exe的windows目录结构》

nodejs安装socket.io

使用node插件管理包,运行下面的命令就可以安装成功socket.io

npm install socket.io

用socket.io 实现的一个例子

客户端代码:

<html> 

<head> 

  <title></title> 

  <script src="../js/socket.io.client.js"></script> 

  <script type="text/javascript"> 

    function doit() { 

      var socket = io.connect('http://localhost'); 

      socket.on('news', function (data) {//接收到服务器发送过来的名为'new'的数据 

        console.log(data.hello);//data为应服务器发送过来的数据。 

        socket.emit('my new event', { my:'new data' });//向服务器发送数据,实现双向数据传输 

      }); 

      socket.on('other', function (data) {//接收另一个名为'other'数据, 

        console.log(data.hello); 

        socket.emit('event1', { my:'other data' }); 

      }); 

    } 

  </script> 

</head> 

<body> 

<button id='btn' onclick="doit()">click me</button> 

</body> 

</html>

socket.io.client.js可以https://github.com/LearnBoost/socket.io-client下载到本地,在<script src="..">指向本机的js库。

服务器用nodejs实现

server2.js

var http= require('http'), io= require('socket.io'), express= require('express'); 

var app = express.createServer(), io = io.listen(app); 

app.listen(80); 

io.sockets.on('connection', function (socket) { 

 socket.emit('news', { hello: 'world' });//监听,一旦客户端连接上,即发送数据,第一个参数'new'为数据名,第二个参数既为数据 

 socket.on('my other event', function (data) {//捕获客户端发送名为'my other event'的数据 

  console.log(data.my); 

 }); 

 socket.emit('other', { hello: 'other world' });//发送另一个数据 

 socket.on('evnet1', function (data) {//捕获另外一个数据 

  console.log(data.my); 

 }); 

});

测试结果,客户端可正常显示

服务器端显示结果:

C:\java\Nodejs>node server2.js

注:代码要和npm_module在同一个目录下。不然会出现找不到socket.io module的错误。

Javascript 相关文章推荐
js时间比较示例分享(日期比较)
Mar 05 Javascript
JS实现兼容性好,自动置顶的淘宝悬浮工具栏效果
Sep 18 Javascript
js中flexible.js实现淘宝弹性布局方案
Jun 23 Javascript
深入理解JavaScript中Ajax
Aug 02 Javascript
Bootstrap中的fileinput 多图片上传及编辑功能
Sep 05 Javascript
JavaScript构建自己的对象示例
Nov 29 Javascript
基于javascript实现的快速排序
Dec 02 Javascript
基于JavaScript实现评论框展开和隐藏功能
Aug 25 Javascript
Popup弹出框添加数据实现方法
Oct 27 Javascript
快速了解Node中的Stream流是什么
Feb 13 Javascript
微信小程序时间戳转日期的详解
Apr 30 Javascript
js笔试题-接收get请求参数
Jun 15 Javascript
基于Jquery+Ajax+Json实现分页显示附效果图
Jul 30 #Javascript
JQuery实现表格动态增加行并对新行添加事件
Jul 30 #Javascript
jQuery修改CSS伪元素属性的方法
Jul 30 #Javascript
教你在heroku云平台上部署Node.js应用
Jul 30 #Javascript
浅析Node在构建超媒体API中的作用
Jul 30 #Javascript
JS实现图片无间断滚动代码汇总
Jul 30 #Javascript
使用jquery.upload.js实现异步上传示例代码
Jul 29 #Javascript
You might like
php微信开发之音乐回复功能
2018/06/14 PHP
Laravel基础-关于引入公共文件的两种方式
2019/10/18 PHP
javascript form 验证函数 弹出对话框形式
2009/06/23 Javascript
javascript 面向对象编程 function也是类
2009/09/17 Javascript
JavaScript 选中文字并响应获取的实现代码
2011/08/28 Javascript
利用javascript实现web页面中指定区域打印
2013/10/30 Javascript
JavaScript Array对象扩展indexOf()方法
2014/05/09 Javascript
与Math.pow 相反的函数使用介绍
2014/08/04 Javascript
jquery mobile页面跳转后样式丢失js失效的解决方法
2014/09/06 Javascript
jquery中show()、hide()和toggle()用法实例
2015/01/15 Javascript
js检测判断日期大于多少天的方法
2015/05/04 Javascript
jQuery链式操作实例分析
2015/11/16 Javascript
jQuery实现的小图列表,大图展示效果幻灯片示例
2016/10/25 Javascript
解决vue里碰到 $refs 的问题的方法
2017/07/13 Javascript
JavaScript实现单例模式实例分享
2017/12/22 Javascript
详解Vue This$Store总结
2018/12/17 Javascript
vue组件文档(.md)中如何自动导入示例(.vue)详解
2019/01/25 Javascript
vue实现购物车的监听
2020/04/20 Javascript
[01:14:55]EG vs Spirit Supermajor 败者组 BO3 第三场 6.4
2018/06/05 DOTA
解密Python中的描述符(descriptor)
2015/06/03 Python
python图片验证码生成代码
2016/07/02 Python
python数据封装json格式数据
2018/03/04 Python
详解Django之auth模块(用户认证)
2018/04/17 Python
Python中一些不为人知的基础技巧总结
2018/05/19 Python
Python类的继承、多态及获取对象信息操作详解
2019/02/28 Python
使用pyinstaller打包PyQt4程序遇到的问题及解决方法
2019/06/24 Python
用python解压分析jar包实例
2020/01/16 Python
python实现AdaBoost算法的示例
2020/10/03 Python
css3 transform 3d 使用css3创建动态3d立方体(html5实践)
2013/01/06 HTML / CSS
C语言编程题
2015/03/09 面试题
JPA的特点
2014/10/25 面试题
中层竞聘演讲稿
2014/01/09 职场文书
什么样的创业计划书可行性高?
2014/02/01 职场文书
新员工入职感想
2015/08/07 职场文书
小学六年级班主任工作经验交流材料
2015/11/02 职场文书
小学生优秀作文范文(六篇)
2019/07/10 职场文书