编写第一个Express应用
生成应用程序目录
之前已介绍这里不再提。
程序目录介绍
app.js 主程序
node_modules 依赖模块包
public 静态网目录
views 动态页目录
bin 启动程序
package.json npm命令需要的描述信息
routes 路由器处理器目录
启动
运行 npm start 启动程序,为什么能启动呢?你可以打开package.
"scripts": {
"start": "node ./bin/www"
}其实是运行的 node ./bin/www this
bin/www 启动程序
那么我们就知道了,启动程序是 bin/www,下面是对这个程序的注释说明。
var debug = require('debug')('myapp');
// 加载主程序
var app = require('../app');
// 如果不指定服务器监听端口号默认就是 3000
app.set('port', process.env.PORT || 3000);
// 启动程序,开始监听客户端请求。
var server = app.listen(app.get('port'), function() {
debug('Express server listening on port ' + server.address().port);
});那么我们可以通过下面的命令指定一个端口号
$ PORT=8080 npm start
这时候,浏览器通过 localhost:8080 能访问到页面。
app.js 主程序
下面对主程序关键代码进行注释说明。
// 创建应用程序
var app = express();
// 设置动态页目录
app.set('views', path.join(__dirname, 'views'));
// 设置动态页模版引擎
app.set('view engine', 'jade');
// 中间件加载,这里不多说,之后章节会详细介绍
app.use(favicon());
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded());
app.use(cookieParser());
// 指定静态页目录
app.use(express.static(path.join(__dirname, 'public')));
// 加载路由处理器
app.use('/', routes);
app.use('/users', users);
// 如果有任何错误都会设置成 404错误
app.use(function(req, res, next) {
var err = new Error('Not Found');
err.status = 404;
next(err);
});
// 如果环境设置成 开发模式,那么会打印出详细的错误信息
if (app.get('env') === 'development') {
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: err
});
});
}
// 生产模式下,不会泄漏error
app.use(function(err, req, res, next) {
res.status(err.status || 500);
res.render('error', {
message: err.message,
error: {} // 不会泄漏error
});
});我们可以在public 目录下创建一个 test.html 文件,内容任意,然后通过 localhost:3000/test.html 即可访问到。
路由
routes 目录下是路由处理器。
下面对 routes/index.js 做注释说明。
var express = require('express');
// 创建一个路由器
var router = express.Router();
// 为路由器添加路由处理器,也就是为 `/` 请求路由加入处理器
// 当有人访问时会执行这个函数。
// req 是请求对象,res是响应对象。
router.get('/', function(req, res) {
// 调用响应对象的render返回给客户端一个响应结果
// 这个响应结果是由动态页面 views/index.jade 生成的。
res.render('index', { title: 'Express' });
});
module.exports = router;views/index.jade 动态模版
extends layout
block content
h1= title
p Welcome to #{title}你可能一头雾水,那也无所谓,它最终还是会生成如下的结果,并返回给请求者(浏览器):
<!DOCTYPE html> <html> <head> <title>Express</title> <link rel="stylesheet" href="/stylesheets/style.css"> </head> <body> <h1>Express</h1> <p>Welcome to Express</p> </body> </html>
如果我们这样修改,res.render(“index”,{title:”Express”}) 的title参数和动态页面的关系,如果我们 这样写 res.render(“index”,{title:”Hello”,body:”Node.js”}) ,然后界面修改成
extends layout
block content
h1= title
p Welcome to #{title+body}运行结果如何?你可以运行一下。
本节内容不多,主要是对express给我们生成的这个demo进行注释说明,从而对express有个初步了解。