前言
服务端有时需要把一些数据直接渲染在页面中，可以使用模板引擎ejs。本次只做简单了解，更多使用方法可查看npm地址：www.npmjs.com/package/ejs
插件安装：npm install ejs --save
demo目录
server.js
const http = require('http');
const url = require('url');
const ejs = require('ejs');
const listenPort = 8081; // 监听端口号
// 创建服务
http.createServer(function (request, response) {
const pathName = url.parse(request.url, true).pathname;
response.writeHead(200, {'Content-Type':'text/html;chartset="utf-8"'});
if(pathName === '/login'){
ejs.renderFile('./views/login.ejs',{}, (err, data)=>{
if(err){
console.log(err);
return;
}
response.end(data)
})
}else {
const pageData = {
msg: '这是一条后端插入的消息',
list: [1,2,3,4],
flag: true,
html: '<h2>这是h2</h2>'
}
ejs.renderFile('./views/index.ejs', pageData, (err, data)=>{
if(err){
console.log(err);
return;
}
response.end(data)
})
}
}).listen(listenPort);
console.log(`Server running at http://127.0.0.1:${listenPort}`);
index.ejs
模板页面以.ejs 结尾，内容与html一样，变量需要写在<%%>里面。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>后台模板-首页</h1>
<hr>
<h2><%=msg%></h2>
<ul>
<% for(let i = 0;i<list.length;i++){%>
<li><%=list[i]%></li>
<%}%>
</ul>
<%if(flag){%>
<div>条件显示判断</div>
<%}%>
<div>
<%-html%>
</div>
</body>
</html>
