原文出处

用“MEAN”技巧栈开垦web应用(二)express搭建服务端框架

2015/11/14 · 基础能力 ·
亚搏app官方网站,MEAN

初稿出处:
吕大豹   

上一篇我们讲了哪些运用angular搭建起项目的前端框架,前端抽象出一个service层来向后端发送央求,后端则赶回相应的json数据。本篇我们来介绍一下,如何在nodejs情况下利用express来搭建起服务端,使之不易的响应前端的央浼。本文所讲的演示照旧基于大家的上学项目QuestionMaker()

精晓中间件

express的基本是中间件机制,通过动用种种中间件,能够实现灵活的组装大家所需的功力。中间件是在管道中实践的,所谓管道就是像流水生产线同样,每达到一个加工区,相应的中间件就能够拍卖request和response对象,管理完后再送往下贰个加工区。假如某些加工区把供给终结了,举个例子调用send方法重返给了顾客端,那么管理就截止了。抢先百分之二十五地方下,都有现存的中间件供大家使用,比方用body-parser深入分析要求实体,用路由(路由也是一种中间件)来科学的派发乞求。

譬如大家在server.js中增加如下的代码:

JavaScript

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

1
2
3
4
5
6
7
8
app.use(function(req, res, next){
     console.log(‘中间件1’);
     next();
});
 
app.use(function(req, res, next){
     console.log(‘中间件2’);
});

大家加多了两个中间件,央求过来之后会先被第三个捕获,然后开展拍卖,输出“中间件1”。前边跟着试行了next()方法,就能跻身下壹在那之中间件。一个中间件实践后独有三种选取,要么用next指向下八其中间件,要么将呼吁重回。要是什么都不做,央浼将会被挂起,也正是说浏览器端将得不到重临,一贯处在pendding状态。举个例子地点的中间件2,将会导致央浼挂起,那是应有杜绝的。

www.yabovip4.com,用“MVC”组织代码

用MVC的协会协会代码当然是白银法规了。express能够用模板引擎来渲染view层,路由体制来公司controller层,可是express并不曾明显规定MVC结构应该怎么着写,而是把自由选取交给你,本身来组织MVC结构。当然你也能够团体别的方式,举例像Java中的“n层架构”。

在本项目中,大家就以文件夹的款型来归纳组织一下。因为大家利用了前边一个模板,所现在端的view层就不设有了,独有controller和model。看一下类型的目录:

www.yabovip4.com 1

在protect下有多个公文夹controllers和models分别放C和M。大家路由中应用的questionController对象就定义在questionController.js中,来看一下用来保存试题的save方法是什么定义的:

JavaScript

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}); }
}); } }

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
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进去了,然后就有了事先大家在路由中选拔的

JavaScript

原文出处。apiRouter.post(‘/submitQuestion’, questionController.save);

1
apiRouter.post(‘/submitQuestion’, questionController.save);

任何流程就勾结起来了。

models文件夹中放的正是模型了,用来治本与数据库的炫目和互相,这里运用了mongoose作为数据库的操作工具,model层怎样来编排,本篇就不做牵线了,在下一篇中我们再详尽疏解。

末尾再声称一下,本篇小说的代码是依靠一个练兵项目QuestionMaker,为了越来越好精晓文章中的陈诉,请查看项目标源码:

1 赞 2 收藏
评论

www.yabovip4.com 2

运作起基于express的web服务器

express是多少个web应用开荒框架,它依照nodejs,扩大了众多web开荒所需的效率,使得大家能够很有利的访谈和操作request和response。请小心它和nginx恐怕tomcat并非三个定义,它是二个付出框架,并不是服务器。

运转起基于express的web服务器是非常简单的,因为express都绑你封装好了。首先须要用npm安装好express,然后在等级次序根目录下新建三个server.js文件,内容如下:

JavaScript

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’); });

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
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服务器,监听在2000端口。

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

接下去是挂号路由,此处只拾壹分二个路由法规,那正是”/”(网址的根目录),当相配到此路由后把首页文件index.html直接用res.sendFile方法给发送到浏览器端。那样浏览器用

可是在本项目中,大家用的是angular的前端模板,所以往端就无需模板了,未有进展配置。我们的路由机制也是一心使用的ng的前端路由,所以在express中只布署一条就够了。

在最后还会有两块代码,分别是404和500不当的破获。你恐怕会嫌疑为何是那样写啊?从上到下排下来就能够分别捕获404和500了吧?其实那正是express的中间件机制,在此编写制定下,对客商端乞求的管理疑似贰个流程,把富有中间件串联起来,只要某在这之中间件把央浼重临了,就得了实施,不然就从上到下一向管理此恳请。

上边代码的流水生产线就是,先按路由法则来同盟路线,倘若路由特别不到,则以为是产生404。500的错误请稳重三个细节,在回调函数的参数中,第一个会传播err,便是错误对象,以此来标志是三个500不当。

路由设计

运作起了服务器,精晓了中间件编制程序方式,接下去大家就该为前端提供api了。举个例子前端post贰个呼吁到/api/submitQuestion来交给一份数据,大家该怎么样摄取须求并做出管理呢,那正是路由的安排性了。

给app.use的率先个参数传入路径能够协作到对应的央求,举个例子:

JavaScript

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

1
app.use(‘/api/submitQuestion’, function(){})

如此就能够捕获到刚刚的交付试题的伏乞,在其次个参数中可以张开相应的拍卖,举个例子把数据插入到数据库。

只是,要留神了,express路由的不错选取姿势并非这么的。app.use是用来合营中间件的门径的,并非央浼的门径。因为路由也是一种中间件,所以这么的用法也是能够一挥而就效能的,可是我们依旧应当依据合法正式的写法来写。

正式的写法是怎么体统呢?代码如下:

JavaScript

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

1
2
3
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”下。依照那样的平整,大家全部项目标路由法则如下:

JavaScript

//注册路由 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);

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
//注册路由
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的味道呢?没有错,大家早就能够宽容到路由了,那服务端的政工逻辑以及数据库访谈等该怎么协会代码呢?

发表评论

电子邮件地址不会被公开。 必填项已用*标注