突袭html5之websocket入门开发框架express

1、为什么需要 express？express 是 node.js 的卓越 MVC 框架。它采用各种中间件，提供了相当易用的功能，比如路由，会话，配 置，页面模板，响应，重定向，视图等。安装在命令行中执行：npm install express 即可安装到当前目录下。如果要在命令行中直接使用 express，则 执行：npm install -g express。注意：在 Windows 环境下(XP, Win7 都试过)，目前的版本(2.5.5)不能直接用 express 生成简单的程序框架。而在 linux 系统中，直接使用 express 去创建程序框架吧。框架结构使用 express 创建

2、的框架基本结构如下，在 Windows 下面自己写也不是太麻烦：这里比较特别的是 jade 文件，这个是生成页面的模板文件，需要靠渲染引擎渲染生成页面。express 支持许多模板引擎，常用的有：Haml haml 的实现Jade haml.js者，同时也是 express 的默认模板引擎JS 嵌入 JavaScript 模板CoffeeKup 基于 CoffeeScript 的模板引擎jQuery Templates 的 NodeJS 版本视图(也就是模板文件)的文件名默认需遵循“.”的形式，这里是要被加载的渲 染模块的名字。例如下面使用Jade 引擎来渲染index.html，默认情况下由

3、于没有设置layout:false，index.jade渲染后的内容将被作为 body 本地变量传入 layout.jade。res.render(index.jade, title: Express ););代码app.get(/, function(req, res)当前目录：|-app.js 服务器程序|-router.json 路由配置：关联路径，视图和内容|-views 目录：存放视图模板|-layout.jade 通用模板|-index.jade 首页模板|-404.jade 错误页面模板|-public 目录：存放静态资源|-js 目录：存放js 文件|-.js 文件|-css

4、目录：存放 css 文件|-.css 文件|-images 目录：存放|-.png 等资源文件代码这样设置以后，渲染模板的时候就不用指定文件扩展名了，也就是说 res.render(index)等价于res.render(index.jade)。程序结构使用 express 开发比较简单，基本过程就是启动服务器，配置运行环境，配置中间件。就比如下面这个常见的 server.js: app.use(express.bodyParser();/将 cnt 提交过来的t 请求放入request.body 中 app.use(express.errorHandler( dumpExceptions:

5、true, showStack: true );注意：1. 配置路中间件以及环境那几句顺序是不能随便动的，比如 app.use(express.bodyParser()一定要在app.use(express.methodOverride()前面，因为后者需要利用 request.body，这个是前者设置完才有的。如果不是太清楚依赖关系，文档。);/配置生产环境app.configure(production, function()app.use(express.errorHandler(););/路由app.get(/, function(req, res)res.render(index,t

6、itle: Test Page););app.listen(3000);代码app.use(express.methodOverride(); /PUT,DELETE 请求app.use(express.sic(_dirname + /public); /设置静态文件路径app.use(app.router); /设置路由中间件，可有可无);/配置调试环境，需要显示异常app.configure(development, function()var express = require(express),app = express.createServer();/配置中间件以及环境app.con

7、figure(function()app.set(views, _dirname + /views); /设置模板路径，比如 index.jadeapp.set(view engine, jade); /配置模板引擎app.set(view engine, jade);新版本中新增的 view engine 设置可以指定默认模板引擎，如果想使用 jade 可以这样设置：2. express 支持多工作环境，比如生产环境和开发环境等。开发者可以使用 configure()方法根据当前环境的需 要进行设置，当 configure()没有传入环境名称时，它会在各环境之前被调用。一般情况下，不同的工作

8、环境主要是异常显示信息不一样，比如开发环境下，是需要显示异常信息的。Ses的支持大多数的功能参考文档就可以了，这里重点说一下会话 ses，这个用的比较多。下面的描述出自官方文档：可以在 express 中通过增加 connect 的 ses 中间件来开启 ses 支持，当然前提是需要在这之前使Parser 中间件，用于分析和处理 req.s 的 数据(ses 进行通信)。用 利用app.use(express.ses( secret: secret );代码默认 ses中间件使用 connect 绑定的内存，但也可以使用其他的实现方式。比如 connect-redis就提供了一个 Redis

9、的 ses方案：var RedisStore = require(connect-redis);app.use(express.Parser();app.use(express.ses( secret: secret, store: new RedisStore );代码这样配置以后，req.ses和req.sesStore 属性就可以被所有路由及下级中间件所，req.ses的属性会伴随着每一次响应发送给客户端，下面是一个购物车的例子：var RedisStore = require(connect-redis);app.use(express.bodyParser();app.use(exp

10、ress.Parser();app.use(express.ses( secret: keyboard cat, store: new RedisStore );app.t(/add-to-cart, function(req, res) var items = req.body.items; req.ses.items = items; res.redirect(back););app.get(/add-to-cart, function(req, res) /可以检查req.ses.items & req.ses.items.length，然后将信息打印到页面 if (req.ses.it

11、ems & req.ses.items.length) req.flash(info, You have %s items in your cart, req.ses.items.length); res.render(shop-cart);但是通常都是采用 socket.io 开发的，它并不是路由中间件的下级中间件，这种情况下，如何让 socket知道ses的存在呢？当socket 连接上的时候socket.io 并不知道当前连接的socket 的sesID 是多少。那如何获得这个信息呢？毕竟对很多应用来说，ses信息还是很重要的。从 socket.io 版本 0.7 以后的版本，这个信息都

12、可以通过“握手/”机制获得，这个机制放到下面说。使用握手数据的例子如下：);代码/ 当页面回到返回并通过 GET 请求/add-to-cart 时/ 利用 bodyParser()中间件处理T 提交的表单数据app.use(express.Parser();MemoryStore = require(./node_modules/expreode_modules/connect/lib/middleware/ses/memorio.set(authorization, function(handshakeData, callback)handshakeDookie = parse(handsh

13、akeData.headers.)var connect_sid = handshakeDookieconnect.sid;if (connect_sid) storeMemory.get(connect_sid, function(error, ses)if (error) / if we cannot grab a ses, turn down the connectioncallback(error.message, false);else / save the sesdata and accept the connectionhandshakeData.ses = ses;callba

14、ck(null, true););else callback(noses);/ 通过客户端的字符串来获取其 ses数据y),storeMemory = new MemoryStore(),app = express.createServer();app.configure(function()app.use(express.bodyParser();app.use(express.Parser();app.use(express.ses(secret: secret,store:storeMemory);app.use(express.methodOverride();app.use(app.

15、router);app.set(views, _dirname + /views);app.set(view engine, jade);app.use(express.sic(_dirname + /public););var io = sio.listen(app);var express = require(express),sio = require(socket.io),parse = require(./node_modules/expreode_modules/connect).utils.parse,socket.io 握手/握手过程当客户端想要与 socket.io 服务器建

16、立一个实时的持久化的连接时，它需要开始一个握手流程。握手以一个 XHR 或者 JSONP 请求(跨域请求)开始。当服务端收到这个连接请求时，它开始从这个请求收集后面可能用到数据，这样做有很多原因：比如当给客户端时，是需要这些信息中的headers 和IP 数据的；还有并不是每次建立实时连接的请求都会携带headers机制数据，所以在 handshake 数据，这样能确保当客户端连上以后，能重用这些数据。例如，你可能想从 中读出 ses id 信息并为连接上的 socket 初始化一个 express ses。生成的 handshakeData 对象含有下面的数据： , headers: req

17、.headers/ the headers of the request , time: (new Date) +/ date time of the connection , address: socket.address() / remoteAddress and remotePort object , ied: +date/ EPOCH of when the handshake was created , path: request.url/ the entrance path of the request , query: data.query/ the result of url.

18、parse().query or a empty object当获取到这些信息后，检查程序是不是配置了全局函数。如果已经配置了的话，把这个handshakeData 以及一个 callback 回调函数传给这个函数。当这个回调函数 callback 执行的时候，基于 callback 回调函数的结果，可以发送 403,500 或者 200 响应。在 handshakeData 数据，这样这些数据就可以在连接建立后，通过 sockendshake 属性来。代码 , secure: socket.secure/ https connection , x: !headers.origin / was

19、 it a cross request?/.socket.on(disconnect, function()/.););app.listen(8080);代码var name = ;);app.get(/,function(req,res)/.);io.sockets.on(connection, function (socket)/取得 ses数据var ses = sockendshake.ses;Global io.set(authorization, function (handshakeData, callback) ););代码在上面的函数有 2 个参数：1.han

20、dshakeData:是在握手过程中产生的。2.callback:它需要两个参数，第一个参数 error 可以用 undefined 或者 String，来代表错误；第二个参数authorized 是 类型的，用于指示客户端是否被了。发送一个 error 或者设置 authorized 为 false 都会导致客户端连不上服务器。因为 handshakeData 是在后的，所以可以在方法中增加/删除一些数据。需要注意的是Global与 Namespace是共享 handshakeData 的，所以在这两个方法任何一个中都可以修改了这个数据。客户端如何响应全局客户端两个事件：error 和 co

21、nnect 就可以了。 console.error(Unable to connect Socket.IO, reason); (sucsfully established a working connection o/););代码Namespace多条独立通信的通道，而不是建立多次连接。比如可以提供 public 性质的 namespace 给未用户来聊天，同时也可以提供只对用户开发的聊天工具。所有的 namespace 都附带 ahthorization 方法。这个可以串成链的方法可以用于为 namespace一个方法。这个方法的参数与 global是一样的。(这方面的例子也可以参看前面介

22、绍 socket.io 中namespace 的内容)io.of(/private).authorization(function (handshakeData, callback) );console.dir(handshakeData);handshakeData.foo = baz;callback(null, true);).on(connection, function (socket) console.dir(sockendshake.foo);var io = require(socket.io).listen(80);也可以根据每个 namespace 进行，这样更灵活。通常这么做的原因是想在一次连接中，建立);sio.on(connect,