Node.js笔记（三）路由和socket.io

本文参考了《Node应用程序构建——使用MongoDB和backbone》的第二章
————————————————————————————————

路由

依赖于ConnectHTTP服务器框架，Express提供了视图渲染和一种描述路由的语言

要使用express，首先要安装express，安装过程不再描述，
看下面一段示例代码：

var express = require(‘express‘);
var app = express();

app.get(‘/stooges/:name?‘, function(req, res, next) {
    var name = req.params.name;

    switch ( name ? name.toLowerCase() : ‘‘ ) {
        case ‘larry‘:
        case ‘curly‘: 
        case ‘moe‘:
          res.send(name + ‘ is my favourite stooge.‘);
          break;

        default:
          next();
    }
});

app.get(‘/stooges/*?‘, function(req, res){
  res.send(‘no stooges listed‘);
});

app.get(‘/?‘, function(req, res){
  res.send(‘hello worldss‘);
});

var port = 8080;
app.listen(port);
console.log(‘Listening on port ‘ + port);

应用初始化的时候，定义了三个路由
/stooges/[name] 等待一个伙伴的名字输入
/stooges/ 上一个路由提供的1名字没找到，给出反馈信息
/ 一个默认的路由，用于访问主页

在第一个路由，express会匹配三个名字，如果对应上了就会显示相应信息
比如运行后浏览器输入：

localhost:8080/stooges/larry

就会显示相应的信息

第一个路由中的next参数：
next函数只是express尝试处理匹配当前请求的下一个路由。
如果输入localhost:8080/stooges会被第一个路由处理，但没有提供名字，switch调用next函数，然后跳到下一个路由

使用模板

jade在概念上类似css，能产生清晰简洁的代码，用于制作网页
使用jade前要先安装：

npm install jade

还是刚才的路由代码，加上了jade代码

var express = require(‘express‘);
var app = express();
/*加载jade*/
app.set(‘view engine‘, ‘jade‘);
app.set(‘view options‘, { layout: true });
app.set(‘views‘, __dirname + ‘/views‘);
/**/
app.get(‘/stooges/:name?‘, function(req, res, next) {
    var name = req.params.name;

    switch ( name ? name.toLowerCase() : ‘‘ ) {
        case ‘larry‘:
        case ‘curly‘: 
        case ‘moe‘:
          res.render(‘stooges‘, {stooge: name});
          break;

        default:
          next();
    }
});

app.get(‘/stooges/*?‘, function(req, res){
  res.render(‘stooges‘, {stooge: null});
});

app.get(‘/?‘, function(req, res){
  res.render(‘index‘);
});

var port = 8080;
app.listen(port);
console.log(‘Listening on port ‘ + port);

新增了

app.set(‘view engine‘, ‘jade‘);
app.set(‘view options‘, { layout: true });
app.set(‘views‘, __dirname + ‘/views‘);

三行代码，
第一行声明所用的模板引擎，第二行不大清楚，应该是配置之类的
第三行指明了文件位置，存放在名为views的目录下，_ _dirname指明了相对路径
代码中并没有实例化jade，是因为express的渲染命令
res.render();
会自己加载所需要的jade

布局

看看layout.jade的代码

doctype html
html(lang=‘en‘)  
  head  
    title My Web Site

    block scripts
  block content

原书里面的第一句是这样写的

!!!5

表示html5
在最新的版本里面已经不支持这样的写法。
关于jade的内容先写到这里

socket.io

惯例先安装，看下面的代码：

var express = require(‘express‘);
var http = require(‘http‘);
var app = express();
var server = http.createServer(app);
var io = require(‘socket.io‘).listen(server);
var catchPhrases = [‘Why I oughta...‘,
  ‘Nyuk Nyuk Nyuk!‘, ‘Poifect!‘, ‘Spread out!‘,
  ‘Say a few syllables!‘, ‘Soitenly!‘];

app.set(‘view engine‘, ‘jade‘);
app.set(‘view options‘, { layout: true });
app.set(‘views‘, __dirname + ‘/views‘);

app.get(‘/stooges/chat‘, function(req, res, next) {
  res.render(‘chat‘);
});

io.sockets.on(‘connection‘, function(socket) {
  var sendChat = function( title, text ) {
    socket.emit(‘chat‘, {
      title: title,
      contents: text
    });
  };
/*******以下为5秒发一条消息*******/
  setInterval(function() {
    var randomIndex = Math.floor(Math.random()*catchPhrases.length)
    sendChat(‘Stooge‘, catchPhrases[randomIndex]);
  }, 5000);
  sendChat(‘Welcome to Stooge Chat‘, ‘The Stooges are on the line‘);
  socket.on(‘chat‘, function(data){
    sendChat(‘You‘, data.text);
  });
});

app.get(‘/?‘, function(req, res){
  res.render(‘index‘);
});

var port = 8080;
server.listen(port);
console.log(‘Listening on port ‘ + port);

然后是chat.jade

extends layout

block scripts
  script(type=‘text/javascript‘, src=‘/socket.io/socket.io.js‘)
  script(type=‘text/javascript‘).
    var socket = io.connect(‘http://localhost:8080‘);
    socket.on(‘chat‘, function(data) {
      document.getElementById(‘chat‘).innerHTML =
        ‘<p><b>‘ + data.title + ‘</b>: ‘ + data.contents + ‘</p>‘;
    });
    var submitChat = function(form) {
      socket.emit(‘chat‘, {text: form.chat.value});
      return false;
    };

block content
  div#chat

  form(onsubmit=‘return submitChat(this);‘)
    input#chat(name=‘chat‘, type=‘text‘)
    input(type=‘submit‘, value=‘Send Chat‘)

书上给的源代码运行不了，报出
Node.js/jade syntax error: unexpected token ;

google之后再stackoverflow上看到这句话：

While writing inline JavaScript in Jade template you need to add a dot after the script tag. Also you should indent your code. I.e. it should look like that:

script(type=‘text/javascript‘, src=‘/socket.io/socket.io.js‘)
script(type=‘text/javascript‘).

第四行代码后面加个“.”就解决了

代码分析

socket.on()创建了一个事件回调，每次连接的用户往socket发消息时就会执行
emit命令发出的是json数据
第一段代码是直接用express对象监听传入的连接，

var app = express();

而这一段代码通过http.createServer(app)函数附加在http.server中，得到的服务器对象再监听传入的连接。
express的listen命令做的事同样的事但没有暴露http.server
这种方式暴露了http.server以便让Socket.io连接到它

运行代码之后，
浏览器输入:

localhost:8080/stooges/chat

就能看到运行结果啦