express开发(一)简介与搭建

上周末去了趟上海书城，不愧是上海数得上号的书城，流行的科技书应有尽有，话不多说直接上图。

最经典的C语言O(∩_∩)O

最流行的java(づ￣ 3￣)づ

超酷的R语言/(ㄒoㄒ)/~~

然而，身为一个坚定的前端JSer，我还是选择了Node与javascript

上图！

Node赛高！Express赛高！

下面让题主来以一个长者的身份讲讲对express的简单理解，看完后你们还会知道怎样搭建一个属于自己的简单的express服务端。（此中有膜意，欲辩已忘言。）

Express简介

Express网站(http://expressjs.com/)上是这样介绍Express的:"Fast, unopinionated, minimalist web framework for Node.js"。翻译过来就是：“精简的、灵活的Node.js Web程序框架，为构建单页、多页及混合的Web程序提供了一系列健壮的功能特性。”（没错，翻译过来就是这么长）

Express的缔造者TJ·Holowaychuk说Express是在Sinatra的启发下创建的，后者是一个基于Ruby的框架。Express借鉴一个Ruby上的框架并不奇怪：Ruby致力于让Web开发变得更快、更高效、更可维护，并衍生了大量的Web开发方式。

Express还与Node的一个插件--connect有紧密的联系，然而在Express4.0中，connect插件被去掉了，只剩下了static中间件。

搭建一个简单的项目

下面我们要建一个简单的基于express4.0的小项目，会实现一些基础的功能：

• 定制404、500页面

• 使用express中的res.send、res.set、res.status替换Node中自带的res.end、res.writeHead

• 了解express中的路由

首先用npm安装express，在你的文件夹下，如test中运行

npm init

初始化之后，运行

npm install -S express

这样npm会将express下载道node_modules中，并更新你的package.json文件，将express写入你的依赖中。

接下来创建一个mydemo.js文件，作为我们项目的入口。

(Node与Express开发的作者Ethan Brown任务，项目的入口文件命名不应该是千篇一律的index.js或者app.js，应该基于你的项目名来命名。npm init默认的使用index.js，如果你使用了别的文件来做主文件，记得修改package.json中的main属性。)

在其中输入如下代码：

var express = require('express');

var app = express();

app.set('port', process.env.PORT || 3000);

//定制404页面

app.use(function(req, res){

res.type('text/plain');

res.status('404');

res.send('404 - Not Found');

});

app.use(function(req,res){

console.err(err.stack);

res.type('text/plain');

res.status('500');

res.send('500 - Server Error');

});

app.listen(app.get('port'), function(){

console.log('Express is started on http://localhost:' + app.get('port') + ';press Ctrl + C to terminate.');

});

然后在命令行输入

node mydemo.js

访问http://localhost:3000/你会看到它返回了一个404页面，因为你还没设置“/”路径。

现在我们的项目结构如下。

现在，我们给首页和关于页面加上路由。在404处理器之前加上两个新路由。

'use strict';

app.get('/', function(req, res){

res.type('text/plain');

res.send('mydemo home page');

});

app.get('/about', function(req, res){

res.type('text/plain');

res.send('about page');

})

//定制404页面

app.use(function(req, res){

res.type('text/plain');

res.status('404');

res.send('404 - Not Found');

});

Express官方文档中有这样一个命令——app.VERB。这里的app.VERB并不是一个具体的方法，而是自带HTTP的动词（最常见的是get和post）。这种方法有两个参数：一个路径和一个函数。

之后再次运行程序，就可以看到我们的首页和about页面了。

现在我们对程序做一些小小的改动，是的路由跟项目入口文件分离开来，这在大型项目中是必要的过程，因为路由一旦过多再跟启动文件混合在一起就不易维护，所以要将他们分离开来。

创建一个新的文件夹routes，在其中创建文件main.js

输入如下代码：

'use strict';

var router = require('express').Router();

router.get('/', function(req, res){

res.type('text/plain');

res.send('mydemo home page');

});

router.get('/about', function(req, res){

res.type('text/plain');

res.send('about page');

})

module.exports = router;

这里使用了express的router方法，是express推荐的router中间件，使用也很简单，跟之前用app实例直接操作路由没太大的区别。之后我们将mydemo.js修改如下：

'use strict';

var express = require('express');

var app = express();

var main = require('./routes/main');

app.set('port', process.env.PORT || 3000);

app.use('/', main);

//定制404页面

app.use(function(req, res){

res.type('text/plain');

res.status('404');

res.send('404 - Not Found');

});

app.use(function(req,res){

console.err(err.stack);

res.type('text/plain');

res.status('500');

res.send('500 - Server Error');

});

app.listen(app.get('port'), function(){

console.log('Express is started on http://localhost:' + app.get('port') + ';press Ctrl + C to terminate.');

});

我们用var main = require('./routes/main');引入创建的route文件，再用app.use('/',main)使用。运行后会发现，效果跟之前是一样的。当然你也可以设置app.use('/tset', main)。这样你要访问localhost:3000/test和localhost:3000/test/about才能看到你设置的两个路由。

现在我们的项目结构如下：

小结

我们用express搭建了一个简单的项目，使用了router中间件，app.get，app.set方法。

之后我们会讲exprss中的视图和布局，并使用handlebars来作为我们的前端模板。

大家可以访问我的github。

https://github.com/ZZR-china/node_express

做了些微小的工作，谢谢大家。

欢迎订阅和点赞收藏哦O(∩_∩)O。