Node.js 和Socket.IO 实现chat WEBIM
socket官方: http://socket.io/
需求:实现WEB IM功能,数据从服务器PUSH 不是PULL
websocket是基于HTML5的新特性,不兼容IE6,7,8 。。。兼容性不好
使用 Node.js 和 Socket.IO 构建简单的聊天程序
在node.js根目录下创建文件夹chat,里面添加两个文件:app.js和index.html
app.js

var fs = require('fs')
, http = require('http')
, socketio = require('socket.io');
var server = http.createServer(function(req, res) {
res.writeHead(200, { 'Content-type': 'text/html'});
res.end(fs.readFileSync(__dirname + '/index.html'));
}).listen(8080, function() {
console.log('Listening at: http://localhost:8080');
});
socketio.listen(server).on('connection', function (socket) {
socket.on('message', function (msg) {
console.log('Message Received: ', msg);
socket.broadcast.emit('message', msg);
});
});

index.html

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script>
$(function(){
var iosocket = io.connect(); iosocket.on('connect', function () {
$('#incomingChatMessages').append($('<li>Connected</li>')); iosocket.on('message', function(message) {
$('#incomingChatMessages').append($('<li></li>').text(message));
});
iosocket.on('disconnect', function() {
$('#incomingChatMessages').append('<li>Disconnected</li>');
});
}); $('#outgoingChatMessage').keypress(function(event) {
if(event.which == 13) {
event.preventDefault();
iosocket.send($('#outgoingChatMessage').val());
$('#incomingChatMessages').append($('<li></li>').text($('#outgoingChatMessage').val()));
$('#outgoingChatMessage').val('');
}
});
});
</script>
</head>
<body>
Incoming Chat: <ul id="incomingChatMessages"></ul>
<br />
<input type="text" id="outgoingChatMessage">
</body>
</html>

开启服务器
node chat/app.js
打开两个chrome输入localhost:8080

这样就看到效果了,然后你可以慢慢研究代码了,再然后就洗洗睡吧。
使用的源码来自http://www.open-open.com/lib/view/open1337216216557.html
Node.js 和Socket.IO 实现chat WEBIM的更多相关文章
- node.js和socket.io纯js实现的即时通讯实例分享
在这个例子中,其实node.js并没有真正起到服务器的作用,因为我们这里可以直接运行client.html文件,而不用输入url请求,当 然,要想输入url请求页面内容还需要加入请求静态文件的代码.这 ...
- node.js和socket.io实现im
im——Instant Messaging 即时通讯 基本技术原理 (1)通过IM服务器登陆或注销 (2)用户A通过列表找到B,用户B获得消息并与之交谈 (3)通过IM服务器指引建立与B单独的通讯通道 ...
- [Node.js] 基于Socket.IO 的私聊
原文地址:http://www.moye.me/2015/01/02/node_socket-io/ 引子 最近听到这么一个问题:Socket.IO 怎么实现私聊?换个提法:怎么定位到人(端),或者说 ...
- 使用Node.js的socket.io模块开发实时web程序
首发:个人博客,更新&纠错&回复 今天的思维漫游如下:从.net的windows程序开发,摸到nodejs的桌面程序开发,又熟悉了一下nodejs,对“异步”的理解有了上上周对操作系统 ...
- Node.js + Web Socket 打造即时聊天程序嗨聊
前端一直是一块充满惊喜的土地,不仅是那些富有创造性的页面,还有那些惊赞的效果及不断推出的新技术.像node.js这样的后端开拓者直接将前端人员的能力扩大到了后端.瞬间就有了一统天下的感觉,来往穿梭于前 ...
- Node+Express+MongoDB + Socket.io搭建实时聊天应用
Node+Express+MongoDB + Socket.io搭建实时聊天应用 前言 本来开始写博客的时候只是想写一下关于MongoDB的使用总结的,后来觉得还不如干脆写一个node项目实战教程实战 ...
- Node+Express+MongoDB + Socket.io搭建实时聊天应用实战教程(二)--node解析与环境搭建
前言 本来开始写博客的时候只是想写一下关于MongoDB的使用总结的,后来觉得还不如干脆写一个node项目实战教程实战.写教程一方面在自己写的过程中需要考虑更多的东西,另一方面希望能对node入门者有 ...
- Node+Express+MongoDB+Socket.io搭建实时聊天应用实战教程(一)--MongoDB入门
前言 本文并不是网上流传的多少天学会MongoDB那种全面的教程,而意在总结这几天使用MongoDB的心得,给出一个完整的Node+Express+MongoDB+Socket.io搭建实时聊天应用实 ...
- node中的socket.io制作命名空间
如果开发者想在一个特定的应用程序中完全控制消息与事件的发送,只需要使用一个默认的"/"命名空间就足够了.但是如果开发者需要将应用程序作为第三方服务提供给其他应用程序,则需要为一个用 ...
随机推荐
- c# splitter控件使用简介
摘自:http://blog.itpub.net/26221264/viewspace-735903 1.先在窗体上放置部分一的控件,这里是TreeView控件,然后把它的 Dock 属性设置为 Le ...
- WPF多线程问题
最近碰到这种多线程问题都是在WPF项目中. 1. 问题是这样.有个一主界面线程,然后background线程启动,这个background线程试图去修改主界面里面的数据. 造成死锁. 调用过程,主界面 ...
- 合并多个excel工作簿
合并多个Excel工作簿,会出现电话号码以科学计数法显示,如果想要以字符串方式处理,要按如下完整代码 public static void mergeWorkBook() throws Excepti ...
- [Err] 1449 - The user specified as a definer ('admin_isbox'@'localhost') does not exist
晚上加班调用一个远程拷贝的本地Mysql的储存过程,报错:[Err] 1449 - The user specified as a definer ('admin_isbox'@'localhost' ...
- [Redux] Extracting Presentational Components -- AddTodo
The code to be refactored: let nextTodoId = 0; class TodoApp extends Component { render() { const { ...
- c#基础: 线程的初级用法总结
启动一个线程的两种方法: a.使用无参的方法 Thread thread1 = new Thread(new ThreadStart("调用的方法名")): ...
- css布局详解(一)——盒模型
一.网页布局的几种情况 今天让我们总结一下在css布局的各种情况做一个总结,为我们以后布局网页时做一个参考. 先看一张图,这是去年cssConf大会时阿里的 @寒冬winter 老师放出来的: 如图所 ...
- Enable-Migrations 在应用程序配置文件中找不到xx连接字符串
在解决方案中有多个项目时,使用Enable-Migrations 命令进行数据迁移时,出现以下错误: 尝试在Enable-Migrations 命令中指定-projectName也不行,最后将要操作的 ...
- Easyui 排序时 自动向后排传sort order 你妹真坑爹
request 的时候 发现 sort 竟然是个数组!
- angular 指令梳理 —— checkBox
checkBox 持久化数据为 逗号分割 /** * 功能说明: * htCheckbox 指令用于收集checkbox数据. * 在页面中使用 * 属性指令:ht-checkbox * 对应的值为s ...