脚本宝典收集整理的这篇文章主要介绍了Node.js和Socket.IO搭建Web Chat application,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
WebSocket与Socket.IO
WebSocket是一种协议,有了它就可以在TCP协议的基础上在浏览器和服务器之间建立起了一种全双工的通道,它完全兼容HTTP协议,有了它使得Web应用程序可以在浏览器和服务器之间进行实时的交互,现在主流浏览器都支持这种协议。
Socket.IO是JavaScript library,是Node.js的module,它可以建立起一个基于事件的实时的双向交流方式,极大的简化了WebSocket的处理过程。在这个Chat application中将会用到它。
开始Chat application
搭建这个应用几乎只需要Node.js和Socket.IO最初级的知识,因为只搭建一个基本的程序。
web 框架
最初的构想是一个简单的HTML页面,由一个表单和消息列表组成,要使用Node.js和exPress框架,首先确保Node.js已经安装好了。
首先创建项目目录chat-example文件夹,然后在里边创建package.json文件来描述项目信息以及依赖。
{
"name": "socket-chat-example",
"version": "0.0.1",
"description": "my First socket.io app",
"dePEndencies": {}
}
然后到命令行cd到项目目录安装exPRess,npm install --save express
--save参数可以把自动把express添加到package.json的dependencies中。
express安装好后创建一个index.js,来配置应用。
//index.js
var app = require('express')();
var http = require('http').Server(app);
app.get('/', function(req, res){
res.send('<h1>Hello world</h1>');
});
http.listen(3000, function(){
console.log('listening on *:3000');
});
上边代码可以这样翻译一下:
Express初始化了一个函数句柄可以应用于HTTP server于第2行
定义一个路由来访问网站首页
开启http服务监听3000端口
在命令行中node index.js得到如下结果:
到浏览器中访问http://localhost:3000结果如下:
之前我们使用res.send('<h1>Hello world</h1>');来传递htML字符串,如果文档内容多了这样做就有点low了,换种方式新建一个index.html文件,访问它就可以了。
首先来重构之前的路由:
app.get('/', function(req, res){
res.sendfile(__dirname + '/index.html');
});
然后创建index.html