基于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 相关文章推荐
actionscript与javascript的区别
May 25 Javascript
functional继承模式 摘自javascript:the good parts
Jun 20 Javascript
js滚动条回到顶部的代码
Dec 06 Javascript
通过js动态操作table(新增,删除相关列信息)
May 23 Javascript
Node.js编写组件的三种实现方式
Feb 25 Javascript
jquery插件uploadify多图上传功能实现代码
Aug 12 Javascript
基于JavaScript实现本地图片预览
Feb 08 Javascript
jquery实现侧边栏左右伸缩效果的示例
Dec 19 jQuery
浅谈React Native Flexbox布局(小结)
Jan 08 Javascript
vue实现简单的日历效果
Sep 24 Javascript
jQuery实现简单聊天室
Feb 08 jQuery
JavaScript中ES6规范中let和const的用法和区别
Aug 06 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
MySQL数据源表结构图示
2008/06/05 PHP
一个PHP缓存类代码(附详细说明)
2011/06/09 PHP
php预定义变量使用帮助(带实例)
2013/10/30 PHP
编写PHP脚本来实现WordPress中评论分页的功能
2015/12/10 PHP
php生成短网址/短链接原理和用法实例分析
2020/05/29 PHP
jQuery异步加载数据并添加事件示例
2014/08/24 Javascript
在Google 地图上实现做的标记相连接
2015/01/05 Javascript
Javascript调用函数方法的几种方式介绍
2015/03/20 Javascript
使用console进行性能测试
2015/04/27 Javascript
jQuery密码强度验证控件使用详解
2017/01/05 Javascript
微信小程序-getUserInfo回调的实例详解
2017/10/27 Javascript
vue2 router 动态传参,多个参数的实例
2017/11/10 Javascript
详细教你微信公众号正文页SVG交互开发技巧
2019/07/25 Javascript
vue3实现v-model原理详解
2019/10/09 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
2019/11/15 Javascript
JS浏览器BOM常见操作实例详解
2020/04/27 Javascript
vue 解决IOS10低版本白屏的问题
2020/11/17 Javascript
python进阶教程之循环对象
2014/08/30 Python
Python3.4实现从HTTP代理网站批量获取代理并筛选的方法示例
2017/09/26 Python
对Python 2.7 pandas 中的read_excel详解
2018/05/04 Python
flask应用部署到服务器的方法
2019/07/12 Python
浅谈Python中的异常和JSON读写数据的实现
2020/02/27 Python
Python post请求实现代码实例
2020/02/28 Python
python求numpy中array按列非零元素的平均值案例
2020/06/08 Python
Python虚拟环境库virtualenvwrapper安装及使用
2020/06/17 Python
Python 防止死锁的方法
2020/07/29 Python
简述python Scrapy框架
2020/08/17 Python
实习教师个人的自我评价
2013/11/08 职场文书
现金会计岗位职责
2013/12/05 职场文书
师范毕业生自我鉴定
2014/01/15 职场文书
烹调加工管理制度
2014/02/04 职场文书
解除财产保全担保书
2014/05/20 职场文书
乡镇个人对照检查材料
2014/08/22 职场文书
高中生国庆节演讲稿范文2014
2014/09/21 职场文书
走群众路线学习心得体会
2014/10/31 职场文书
店铺转让协议书
2015/01/29 职场文书