基于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数据分享
May 12 Javascript
JS格式化数字金额用逗号隔开保留两位小数
Oct 18 Javascript
SuperSlide2实现图片滚动特效
Jun 20 Javascript
vue组件如何被其他项目引用
Apr 13 Javascript
webpack搭建vue 项目的步骤
Dec 27 Javascript
详解Vue 全局引入bass.scss 处理方案
Mar 26 Javascript
如何以Angular的姿势打开Font-Awesome详解
Apr 22 Javascript
实例详解Vue项目使用eslint + prettier规范代码风格
Aug 20 Javascript
vue的.vue文件是怎么run起来的(vue-loader)
Dec 10 Javascript
vue实现随机验证码功能的实例代码
Apr 30 Javascript
jQuery表单选择器用法详解
Aug 22 jQuery
详解JavaScript中Arguments对象用途
Aug 30 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
openPNE常用方法分享
2011/11/29 PHP
简单的php中文转拼音的实现代码
2014/02/11 PHP
Yii2框架dropDownList下拉菜单用法实例分析
2016/07/18 PHP
解决php写入数据库乱码的问题
2019/09/17 PHP
JS 建立对象的方法
2007/04/21 Javascript
JavaScript入门之基本函数详解
2011/10/21 Javascript
javascript数组快速打乱重排的方法
2014/01/02 Javascript
JQuery中使用Ajax赋值给全局变量异常的解决方法
2014/01/10 Javascript
按下回车键指向下一个位置的一个函数代码
2014/03/10 Javascript
用jquery模仿的a的title属性的例子
2014/10/22 Javascript
js进行表单验证实例分析
2015/02/10 Javascript
Javascript实现网络监测的方法
2015/07/31 Javascript
jquery使用ul模拟select实现表单美化的方法
2015/08/18 Javascript
快速学习jQuery插件 Form表单插件使用方法
2015/12/01 Javascript
jQuery操作json常用方法示例
2017/01/04 Javascript
js cookie实现记住密码功能
2017/01/17 Javascript
微信小程序教程系列之视图层的条件渲染(10)
2017/04/19 Javascript
微信小程序websocket聊天室的实现示例代码
2019/02/12 Javascript
JavaScript中继承原理与用法实例入门
2020/05/09 Javascript
在vue中使用Echarts利用watch做动态数据渲染操作
2020/07/20 Javascript
[03:09]2014DOTA2国际邀请赛 赛场上的美丽风景线 中国Coser也爱DOTA2
2014/07/20 DOTA
python翻译软件实现代码(使用google api完成)
2013/11/26 Python
Python使用Scrapy爬取妹子图
2015/05/28 Python
python自动结束mysql慢查询会话的实例代码
2019/10/27 Python
Pytorch根据layers的name冻结训练方式
2020/01/06 Python
Ubuntu权限不足无法创建文件夹解决方案
2020/11/14 Python
办理暂住证介绍信
2014/01/11 职场文书
《地震中的父与子》教学反思
2014/04/10 职场文书
小学模范班主任事迹材料
2014/05/13 职场文书
2014年小学美术工作总结
2014/12/20 职场文书
学习保证书100字
2015/02/26 职场文书
2015年行政工作总结范文
2015/04/09 职场文书
2015年行政人事部工作总结
2015/05/13 职场文书
小学主题班会教案
2015/08/17 职场文书
一文了解MySQL二级索引的查询过程
2022/02/24 MySQL
python模板入门教程之flask Jinja
2022/04/11 Python