专栏首页游戏开发之旅NodeJS学习二(模板引擎的配置和使用)

NodeJS学习二(模板引擎的配置和使用)

当页面内容比较多的时候,如果像上一节中说到的在绑定路由使用app.send()方法返回大量的html字符串是不现实的,这个时候通常需要配置模板使其返回对应的页面。

配置swig模板引擎分为四个步骤:

1)加载模板引擎

2)配置模板引擎应用模板

3)设置模板文件存放目录

4)注册模板

5)路由中返回模板

//应用程序的启动入口文件
 
//加载express模块
var express = require('express');
//创建app应用,相当于nodeJS的http.createService()
var app = express();
 
//1加载模板处理模块
var swig = require('swig');
//2配置模板应用模块
//定义当前应用所使用的模板引擎,第一个参数:模板引擎名称,同时也是模板文件的后缀;第二个参数:解析处理模板内容的方法
app.engine('html',swig.renderFile);
//3设置模板文件存放的目录,第一个参数必须是views,第二个参数是目录
app.set('views','./views');
//4注册模板,第一个参数:必须是view engine,第二个参数与定义模板引擎的第一个参数名称一致
app.set('view engine','html')
 
/**
 * [description] 给app绑定首页路由,把一个url路径通过一个或多个方法绑定
 * @param  {[type]} req       request对象,保存客户端请求相关的一些数据
 * @param  {[type]} res       response对象
 * @param  {[type]} next){} 函数,用于执行下一个和当前路径匹配的函数
 * @return {[type]}           [description]
 */
app.get('/',function(req,res,next){
	//res.send(string)发送内容直客户端
	// res.send('<h1>欢迎来到我的博客!</h1>')
	
	//5读取views目录下的指定文件,解析并返回给客户端
	//第一个参数:模板的文件相对于views/index.html
	//第二个参数:传递给模板使用的数据
 
	res.render('index');
})
 
//监听http请求
app.listen(8081);

在views目录下新建index.html文件:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<h1>欢迎光临我的博客</h1>
</body>
</html>

运行app.js文件,打开浏览器输入localhost:8081会出现相应的页面信息。

但是在当改变index.html内容后刷新页面不会即使刷新,这是因为引擎第一次读取模板会将其缓存到内存中,再次读取会从缓存中直接获取,需要重启服务才能看到效果。因此要渠道模板引擎的缓存,修改后app.js代码如下:

//应用程序的启动入口文件
 
//加载express模块
var express = require('express');
//创建app应用,相当于nodeJS的http.createService()
var app = express();
 
//1加载模板处理模块
var swig = require('swig');
//2配置模板应用模块
//定义当前应用所使用的模板引擎,第一个参数:模板引擎名称,同时也是模板文件的后缀;第二个参数:解析处理模板内容的方法
app.engine('html',swig.renderFile);
//3设置模板文件存放的目录,第一个参数必须是views,第二个参数是目录
app.set('views','./views');
//4注册模板,第一个参数:必须是view engine,第二个参数与定义模板引擎的第一个参数名称一致
app.set('view engine','html')
//5第一次读取会把模板缓存到内存当中,下次会直接读取,因此即使改了模板内容刷新也不会有变化,需要在开发过程中需要取消模板缓存
swig.setDefaults({cache:false});
 
/**
 * [description] 给app绑定首页路由,把一个url路径通过一个或多个方法绑定
 * @param  {[type]} req       request对象,保存客户端请求相关的一些数据
 * @param  {[type]} res       response对象
 * @param  {[type]} next){} 函数,用于执行下一个和当前路径匹配的函数
 * @return {[type]}           [description]
 */
app.get('/',function(req,res,next){	
	//6读取views目录下的指定文件,解析并返回给客户端
	//第一个参数:模板的文件相对于views/index.html
	//第二个参数:传递给模板使用的数据
 
	res.render('index');
})
 
//监听http请求
app.listen(8081);

本文重点:

//1.加载模板处理文件
var swig=require('swig');


//2.配置模板应用模块儿
//定义当前应用使用的模板引擎,第一个参数:模板引擎名称,同时也是
//模板文件的后缀;第二个参数:解析处理模板内容的方法
app.engine('html',swig.renderFile);


//3.设置模板文件存放的目录
//第一个参数必须是views,第二个参数是目录
app.set('views','./views');

//4.注册模板
//第一个参数:必须是view engine;
//第二个参数:与定义模板引擎的第一个参数名称一致
app.set('view engine','html');

//5. 第一次读取会把模板存到内存中,下次会直接读取内存中的数据
// 因此即使改了模板内容刷新也不会有变化,需要在开发中取消模板缓存
swig.setDefaults({cache:false});  //取消模板缓存

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • NodeJS学习三(静态文件托管)

    bering
  • Unity面试题(包含答案)

    在主线程运行的同时开启另一段逻辑处理,来协助当前程序的执行,协程很像多线程,但是不是多线程,Unity的协程实在每帧结束之后去检测yield的条件是否满足。

    bering
  • unity中自定义鼠标样式

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明...

    bering
  • 【Mockplus教程】收藏和重用

    1. 制作模板 选择需要制作为模板的页面,鼠标右击,弹出的菜单中选择“加入到模板收藏”,然后选择相应 的模板库,如果没有模板库会提示新建一个。 加入成功...

    奔跑的小鹿
  • 模板注入漏洞全汇总

    在MVC的设计模式下,一般从 Model 层中读取数据,然后将数据传到 View 层渲染(渲染成 HTML 文件),而 View 层一般都会用到模板引擎。

    Jayway
  • 9、微信小程序免费视频教程之模板

    需要使用template标签,然后给该标签指定一个name属性。接着就可以在该标签内写入一些代码片段。

    用户1272076
  • 测试工程师必备模板三件套

    最近很多读者&测试从业者咨询小石测试计划&方案模板 、测试进度模板 、测试用例模板

    测试小兵
  • 19.9 添加自定义模板

    添加自定义模板 可以自定义一个常用模板,方便给新增主机添加监控项目 自定义aming模板 把其他自带模板里面的某些监控项目(比如cpu、内存等)复制到aming...

    运维小白
  • C++模板之隐式实例化、显示实例化、隐式调用、显示调用和模板特化详解

    模板的实例化指函数模板(类模板)生成模板函数(模板类)的过程。对于函数模板而言,模板实例化之后,会生成一个真正的函数。而类模板经过实例化之后,只是完成了类的定义...

    Dabelv
  • 把时间留给重要的事——Markdown 模板功能上线

    你是否遇到过因为同事在任务中过于放飞自我而感到头疼?或者经历过因为内容描写的不系统而导致关键信息被忽视?

    CODING研发管理系统

扫码关注云+社区

领取腾讯云代金券