基于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 相关文章推荐
javascript支持firefox,ie7页面布局拖拽效果代码
Dec 20 Javascript
获取网站跟路径的javascript代码(站点及虚拟目录)
Oct 20 Javascript
js进行表单验证实例分析
Feb 10 Javascript
谈一谈javascript闭包
Jan 28 Javascript
javascript实现获取指定精度的上传文件的大小简单实例
Oct 25 Javascript
JS IOS/iPhone的Safari浏览器不兼容Javascript中的Date()问题如何解决
Nov 11 Javascript
JS实现太极旋转思路分析
Dec 09 Javascript
jQuery选择器实例应用
Jan 05 Javascript
JavaScript获取ul中li个数的方法
Feb 13 Javascript
微信小程序如何获取用户收货地址
Nov 27 Javascript
实例介绍JavaScript中多种组合继承
Jan 20 Javascript
nuxt框架中对vuex进行模块化设置的实现方法
Sep 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
新版PHP将向Java靠拢
2006/10/09 PHP
php实现指定字符串中查找子字符串的方法
2015/03/17 PHP
如何使用GDB调试PHP程序
2015/12/08 PHP
php文件上传的两种实现方法
2016/04/04 PHP
Javascript String.replace的妙用
2009/09/08 Javascript
理解Javascript_09_Function与Object
2010/10/16 Javascript
JavaScript基础语法让人疑惑的地方小结
2012/05/23 Javascript
jQuery学习笔记 操作jQuery对象 CSS处理
2012/09/19 Javascript
LABjs、RequireJS、SeaJS的区别
2014/03/04 Javascript
jquery实现效果比较好的table选中行颜色
2014/03/25 Javascript
基于JS代码实现当鼠标悬停表格上显示这一格的全部内容
2016/06/12 Javascript
Bootstrap编写一个在当前网页弹出可关闭的对话框 非弹窗
2016/06/30 Javascript
深入理解AngularJS中的ng-bind-html指令和$sce服务
2016/09/08 Javascript
jQuery中Find选择器用法示例
2016/09/21 Javascript
详谈ES6中的迭代器(Iterator)和生成器(Generator)
2017/07/31 Javascript
Vue数组更新及过滤排序功能
2017/08/10 Javascript
webstrom Debug 调试vue项目的方法步骤
2018/07/17 Javascript
微信小程序methods中定义的方法互相调用的实例代码
2018/08/07 Javascript
Json实现传值到后台代码实例
2020/06/30 Javascript
vue移动端弹起蒙层滑动禁止底部滑动操作
2020/07/22 Javascript
addEventListener()和removeEventListener()追加事件和删除追加事件
2020/12/04 Javascript
Vue3 实现双盒子定位Overlay的示例
2020/12/22 Vue.js
Python字典操作简明总结
2015/04/13 Python
python提取页面内url列表的方法
2015/05/25 Python
python调用xlsxwriter创建xlsx的方法
2018/05/03 Python
python opencv判断图像是否为空的实例
2019/01/26 Python
局域网内python socket实现windows与linux间的消息传送
2019/04/19 Python
python中正则表达式与模式匹配
2019/05/07 Python
美国在线珠宝商店:SZUL
2017/02/11 全球购物
极度干燥澳大利亚官方网站:Superdry澳大利亚
2019/03/28 全球购物
全球高级音频和视频专家:HiDef Lifestyle
2019/08/02 全球购物
Farfetch澳大利亚官网:Farfetch Australia
2020/04/26 全球购物
教师辞职报告范文
2014/01/20 职场文书
安全学习心得体会范文
2016/01/18 职场文书
创业计划书之DIY自助厨房
2019/09/06 职场文书
关于食品安全的演讲稿范文(三篇)
2019/10/21 职场文书