用“MEAN”技术栈开发web应用（二）express搭建服务端框架-低调大师

用“MEAN”技术栈开发web应用（二）express搭建服务端框架

2017-10-10 529

上一篇我们讲了如何使用angular搭建起项目的前端框架，前端抽象出一个service层来向后端发送请求，后端则返回相应的json数据。本篇我们来介绍一下，如何在nodejs环境下利用express来搭建起服务端，使之正确的响应前端的请求。本文所讲的示例还是基于我们的学习项目QuestionMaker(https://github.com/Double-Lv/QuestionMaker)

运行起基于express的web服务器

express是一个web应用开发框架，它基于nodejs，扩展了很多web开发所需的功能，使得我们能够很方便的访问和操作request和response。请注意它和nginx或者tomcat并不是一个概念，它是一个开发框架，而不是服务器。

运行起基于express的web服务器是非常简单的，因为express都绑你封装好了。首先需要用npm安装好express，然后在项目根目录下新建一个server.js文件，内容如下：

var express = require('express');
var app = express();
app.listen(3000);

var _rootDir = __dirname;
var protectDir = _rootDir + '/protect/';

app.use(express.static(_rootDir));

//注册路由
app.get('/', function(req, res){
    res.sendFile(_rootDir+'/src/index.html');
});

app.use(function(req, res, next) {
     res.status(404).sendFile(_rootDir+'/src/404.html');
});
app.use(function(err, req, res, next) {
     console.error(err.stack);
     res.status(500).send('500 Error');
});

上述代码实现了这几个功能，首先创建了http服务器，监听在3000端口。

然后app.use(express.static(_rootDir));这一行是使用了静态文件服务的中间件，这样我们项目下的js、css以及图片等静态文件就都可以访问到了。

接下来是注册路由，此处只匹配一个路由规则，那就是"/"（网站的根目录），当匹配到此路由后把首页文件index.html直接用res.sendFile方法给发送到浏览器端。这样浏览器用http://127.0.0.1:3001就可以访问到index.html了。网站的其他页面也可以通过配置类似的路由进行返回。express还支持配置模板引擎，默认支持ejs，你也可以自己配置其他的比如handlebars。

但是在本项目中，我们用的是angular的前端模板，所以后端就不需要模板了，没有进行配置。我们的路由机制也是完全使用的ng的前端路由，所以在express中只配置一条就够了。

在最后还有两块代码，分别是404和500错误的捕获。你可能会疑惑为什么是这样写呢？从上到下排下来就能分别捕获404和500了吗？其实这就是express的中间件机制，在此机制下，对客户端请求的处理像是一个流水线，把所有中间件串联起来，只要某个中间件把请求返回了，就结束执行，否则就从上到下一直处理此请求。

上面代码的流程就是，先按路由规则来匹配路径，如果路由匹配不到，则认为是发生404。500的错误请注意一个细节，在回调函数的参数中，第一个会传入err，就是错误对象，以此来标记是一个500错误。

理解中间件

express的核心是中间件机制，通过使用各种中间件，能够实现灵活的组装我们所需的功能。中间件是在管道中执行的，所谓管道就是像流水线一样，每到达一个加工区，相应的中间件就可以处理request和response对象，处理完后再送往下一个加工区。如果某个加工区把请求终结了，比如调用send方法返回给了客户端，那么处理就终止了。大部分情况下，都有现成的中间件供我们使用，比如用body-parser解析请求实体，用路由（路由也是一种中间件）来正确的派发请求。

比如我们在server.js中添加如下的代码：

app.use(function(req, res, next){
     console.log('中间件1');
     next();
});

app.use(function(req, res, next){
     console.log('中间件2');
});

我们添加了两个中间件，请求过来之后会先被第一个捕获，然后进行处理，输出“中间件1”。后面接着执行了next()方法，就会进入下一个中间件。一个中间件执行后只有两种选择，要么用next指向下一个中间件，要么将请求返回。如果什么都不做，请求将会被挂起，也就是说浏览器端将得不到返回，一直处于pendding状态。例如上面的中间件2，将会造成请求挂起，这是应该杜绝的。

路由设计

运行起了服务器，了解了中间件编程方式，接下来我们就该为前端提供api了。比如前端post一个请求到/api/submitQuestion来提交一份数据，我们该如何接收请求并做出处理呢，这就是路由的设计了。

给app.use的第一个参数传入路径可以匹配到对应的请求，例如：

app.use('/api/submitQuestion', function(){})

这样就可以捕获到刚刚的提交试题的请求，在第二个参数中可以进行相应的处理，比如把数据插入到数据库。

但是，要注意了，express路由的正确使用姿势并不是这样的。app.use是用来匹配中间件的路径的，而不是请求的路径。因为路由也是一种中间件，所以这样的用法也是能够完成功能的，但是我们还是应该按照官方标准的写法来写。

标准的写法是什么样子呢？代码如下：

var apiRouter = express.Router();
apiRouter.post('/submitQuestion', questionController.save);
app.use('/api', apiRouter);

我们利用的是express.Router这个对象，它同样有use、post、get等方法，用来匹配请求路径。然后我们再使用app.use把apiRouter作为第二个参数传进去。

要注意的是apiRouter.post和app.use的第一个参数。app.use匹配的是请求的“根路径”，这样可以把请求分为不同的类别，比如所有的异步接口我们都叫api，那么这类请求我们就都应该挂在“/api”下。按照这样的规则，我们整个项目的路由规则如下：

//注册路由
app.get('/', function(req, res){
    res.sendFile(_rootDir+'/src/index.html');
});

var apiRouter = express.Router();
apiRouter.post('/getQuestion', questionController.getQuestion);
apiRouter.post('/getQuestions', questionController.getQuestions);
apiRouter.post('/submitQuestion', questionController.save);
apiRouter.post('/updateQuestion', questionController.update);
apiRouter.post('/removeQuestion', questionController.remove);
apiRouter.post('/getPapers', paperController.getPapers);
apiRouter.post('/getPaper', paperController.getPaper);
apiRouter.post('/getPaperQuestions', paperController.getPaperQuestions);
apiRouter.post('/submitPaper', paperController.save);
apiRouter.post('/updatePaper', paperController.update);
apiRouter.post('/removePaper', paperController.remove);

app.use('/api', apiRouter);

在router的第二个参数中，我们传入了questionController.save这样的方法，这是什么东西呢？怎么有点MVC的味道呢？没错，我们已经能够匹配到路由了，那服务端的业务逻辑以及数据库访问等该如何组织代码呢？

用“MVC”组织代码

用MVC的结构组织代码当然是黄金法则了。express可以用模板引擎来渲染view层，路由机制来组织controller层，但是express并没有明确规定MVC结构应该怎样写，而是把自由选择交给你，自己来组织MVC结构。当然你也可以组织别的形式，比如像Java中的“n层架构”。

在本项目中，我们就以文件夹的形式来简单组织一下。因为我们使用了前端模板，所以后端的view层就不存在了，只有controller和model。看一下项目的目录：

在protect下有两个文件夹controllers和models分别放C和M。我们路由中使用的questionController对象就定义在questionController.js中，来看一下用于保存试题的save方法是如何定义的：

var Question = require('../models/question');
module.exports = {
     //添加试题
     save: function(req, res){
          var data = req.body.question;
          Question.save(data, function(err, data){
               if(err){
          res.send({success: false, error: err});
     }
     else{
          res.send({success: true, data: data});
     }
          });
     }
}

questionController作为一个模块，使用标准的commonjs语法，我们定义了save方法，通过req.body.question，可以拿到前台传过来的数据。在这个模块中，我们require了位于model层的Question模型，没错，它就是用来操作数据库的，调用Question.save方法，这份数据就存入了数据库，然后在回调函数中，我们用res.send将json数据返回给前端。

定义好questionController后，我们就可以在server.js中把它给require进去了，然后就有了之前我们在路由中使用的

apiRouter.post('/submitQuestion', questionController.save);

整个流程就串通起来了。

models文件夹中放的就是模型了，用来管理与数据库的映射和交互，这里使用了mongoose作为数据库的操作工具，model层如何来编写，本篇就不做介绍了，在下一篇中我们再详细讲解。

最后再声明一下，本篇文章的代码是基于一个练习项目QuestionMaker，为了更好理解文章中的叙述，请查看项目的源码： https://github.com/Double-Lv/QuestionMaker

本文转自吕大豹博客园博客，原文链接：http://www.cnblogs.com/lvdabao/p/mean-techstack-express.html，如需转载请自行联系原作者

微信关注我们

原文链接：https://yq.aliyun.com/articles/370296

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

Microsoft Azure News(6) Azure新F系列虚拟机

　《Windows Azure Platform 系列文章目录》我们知道Azure虚拟机的CPU和内存是固定搭配的，不可以按照用户的想法随意更改。在有些时候，我们需要虚拟机CPU核心数量和内存大小，要按照1:2的配置。这时候就可以考虑Azure F系列的虚拟机。 F系列的虚拟机，CPU核心数和内存的配置如下：实例核心数内存临时磁盘大小 F1 1 2GB 16GB F2 2 4GB 32GB F4 4 8GB 64GB F8 8 16GB 128GB F16 16 32GB 256GB 注意：上面的磁盘大小，代表临时盘(SSD)的大小。并不是持久化磁盘。 F系列虚拟机的CPU类型，和DV2系列的是一样的。型号是Intel Xeon E5-2673 V3 (Haswell架构)，默认主频是2.4G。同时，采用了Interl Turbo Boost Technology(睿频加速技术)，最高主频可以达到3.2G。 F系列VM的CPU(Intel Xeon E5-2673 V3)，比D系列VM的CPU(Interl Xeon E5-2660)，速度要快35%。针对高性能C...

2017-10-11

632

《Windows Azure Platform 系列文章目录》微软Azure在设计架构的时候，从安全角度考虑，是禁用ICMP协议的。所以对于Azure VM，是无法使用ping命令的。为了能监控到Azure VM的网络情况，我们可以使用tcp协议工具PSPing。下载地址是：http://technet.microsoft.com/en-us/sysinternals/jj729731 注意，我们在使用psping命令的时候，目标服务器是要带端口号的。如下图：在Linux 平台，我们也可以使用基于tcp协议的工具，比如tcpping等。本文转自Lei Zhang博客园博客，原文链接：http://www.cnblogs.com/threestone/p/4974673.html，如需转载请自行联系原作者

2017-10-11

649

资源下载

更多资源

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长，特征是大鼻子、头戴帽子、身穿背带裤，还留着胡子。与他的双胞胎兄弟路易基一起，长年担任任天堂的招牌角色。

Spring

Spring框架（Spring Framework）是由Rod Johnson于2002年提出的开源Java企业级应用框架，旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念，提供核心容器、应用上下文、数据访问集成等模块，支持整合Hibernate、Struts等第三方框架，其适用范围不仅限于服务器端开发，绝大多数Java应用均可从中受益。

Rocky Linux

Rocky Linux（中文名：洛基）是由Gregory Kurtzer于2020年12月发起的企业级Linux发行版，作为CentOS稳定版停止维护后与RHEL（Red Hat Enterprise Linux）完全兼容的开源替代方案，由社区拥有并管理，支持x86_64、aarch64等架构。其通过重新编译RHEL源代码提供长期稳定性，采用模块化包装和SELinux安全架构，默认包含GNOME桌面环境及XFS文件系统，支持十年生命周期更新。

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。