https://www.npmjs.com/package/ejs
安装:npm install ejs --save
app.js
const http = require('http'); const url = require('url') const ejs = require('ejs') const staticWeb = require('./web') http.createServer(function (request, response) { //创建静态Web服务 staticWeb(request,response,'./static') //路由 let pathname = url.parse(request.url).pathname if (pathname == '/') { response.writeHead(200, { 'Content-Type': 'text/html;charset="utf-8"' }); response.end("<h3>执行首页逻辑</h3>"); } else if(pathname=='/login'){ // response.writeHead(200, { 'Content-Type': 'text/html;charset="utf-8"' }); // response.end("<h3>执行登录逻辑</h3>"); let list = [ { name:"张三", age:11 }, { name:"李四", age:23 }, { name:"jack", age:45 } ] ejs.renderFile('./views/login.ejs',{ list:list }, (err, data) => { response.writeHead(200, { 'Content-Type': 'text/html;charset="utf-8"' }) response.end(data) }) } else if(pathname=='/register'){ //response.writeHead(200, { 'Content-Type': 'text/html;charset="utf-8"' }); //response.end("<h3>执行注册逻辑</h3>"); let msg = "这是来自服务器的数据" ejs.renderFile('./views/register.ejs', { msg: msg }, (err, data) => { response.writeHead(200, { 'Content-Type': 'text/html;charset="utf-8"' }); response.end(data); }) } else if(pathname=='/loginOut'){ response.writeHead(200, { 'Content-Type': 'text/html;charset="utf-8"' }); response.end("<h3>执行退出登录逻辑</h3>"); } else{ response.writeHead(404, { 'Content-Type': 'text/html;charset="utf-8"' }); response.end("<h3>404 Not Found</h3>"); } }).listen(8081); console.log('Server running at http://127.0.0.1:8081/');
后端路由执行登录逻辑,渲染 login.ejs
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h3>登录.ejs</h3> <ul> <%for(var i=0;i<list.length;i++){%> <li><%=list[i].name%></li> <li><%=list[i].age%></li> <%}%> </ul> </body> </html>
后端路由执行注册逻辑,渲染 register.ejs
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <h3>注册.ejs</h3> <h3><%=msg%></h3> </body> </html>