本文参考了《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的内容先写到这里
惯例先安装,看下面的代码:
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
就能看到运行结果啦