EJS 模板引擎

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>

原文地址:https://www.cnblogs.com/shanlu0000/p/13154451.html