express模版引擎

ps:希望看到的大神们,帮忙指出我的理解性是否有误
现在有很多模板引擎(jade,ejs等),使用模板引擎可以更加方便我们的开发,让页面更加动态化,书写更加简单。但想让一个模板引擎呈现出完美的页面。需要express的配合。
正如上面提到的,存在很多的模板引擎,每个模板各不相同,所以express需要对这些引起进行适配,express先要知道开发者,用了什么模板引擎,再对这种类型的引擎进行处理,最终生成我们需要的html页面。但是express为了精简自己是不可能自己去适配各种模板引擎的。如果是express去适配引擎,当市面又出现了一个比较大众的模板引擎,就需要升级一次express,这样不仅麻烦,用户体验感也不好,那样
的化,express就不会这么流行了吧!!
为了解决这个适配问题,出现了一个比较好的中间件consolidate,consolidate的主要功能就是,
帮助express适配各种引擎。
小提示:使用consolidate中间件,同样要下载哦!老方法npm install consolidate。
最开始学习模板引擎的时候,还没有谈到适配模板引擎的问题,那时候还只是针对单独某一引擎进行但是这样每换一个引擎,就引入一个很是尴尬,所以要想适配所有的模板引擎,提供一个统一接口,我们只需要引入consolidate就可以了哦!(是不是感觉好爽啊)。
想要适配一个模板引擎,必经的三个步骤如下:

1、 consolidate说:我可以给你做适配,那你要输出什么啊?html,xhtml还是什么东东?

server.set('view engine','html');
 
 
  • 1

2、consolidate说:嗯,我知道知道你要输出的是html了,那你的模板文件放哪里了,告诉我一下?

server.set('views'.'./views');
 
 
  • 1

3、 consolidate说:好,那你要适配哪种模板引擎,jade,ejs还是其他什么?

server.engine('html',consolidate.ejs);
 
 
  • 1

现在开始针对这三个操作简单的分析下:
首先,会发现这里使用中间件,没有用server.use()来调用,而是用的set(),其实set,就是对服务器本身,也就是对全局进行配置。
first:

server.set('view engine','html');
 
 
  • 1

注:view engine是固定的,含义是视图引擎;
我对这句理解是,你这个引擎模板,想以什么样的方式让用户看到你,回答是我选择html。
second:

server.set('views','./views');
 
 
  • 1

注:指明了我们的模板在哪个文件夹下。第一个参数是固定不变的,第二个参数,根据模板所在的地方而改变。
third:

server.engine('html',consolidate.ejs);
 
 
  • 1

注:含义是,当你需要编译html时,用ejs作为你的引擎模板,也就是把ejs编译成html,并呈现给用户。


现在配置好引擎模板了,可以使用了:

server.get('/index',function(req,res){
req.render('1.ejs',{name:'blue'};
})
 
 
  • 1
  • 2
  • 3

注意:res.render()和res.send(),都是向用户呈现东西。但是还是有所区别的,要不也不能出现两种方法;
res.render();第一个参数是要编译的模板,第二个参数是模板引擎中需要的使用的变量。
也即是当我们使用模板引擎编写时,需要用render()方法,将其编译后在将结果返回给用户。
res.send();参数里的东西,就是直接要发给用户的东西。


较为完整的代码:

const express=require('express');
const static=require('express-static');
const cookieParser=require('cookie-parser');
const cookieSession=require('cookie-session');
const bodyParser=require('body-parser');
const multer=require('multer');
const consolidate=require('consolidate');

var server=express();

server.listen(8080);

//1.解析cookie
server.use(cookieParser('sdfasl43kjoifguokn4lkhoifo4k3'));

//2.使用session
var arr=[];
for(var i=0;i<100000;i++){
  arr.push('keys_'+Math.random());
}
server.use(cookieSession({name: 'zns_sess_id', keys: arr, maxAge: 20*3600*1000}));

//3.post数据
server.use(bodyParser.urlencoded({extended: false}));
server.use(multer({dest: './www/upload'}).any());

//4.配置模板引擎
//输出什么东西
server.set('view engine', 'html');
//模板文件放在哪儿
server.set('views', './views');
//哪种模板引擎
server.engine('html', consolidate.ejs);

//接收用户请求
server.get('/index', function (req, res){
  res.render('1.ejs', {name: 'blue'});
});

//4.static数据
server.use(static('./www'));
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值