• 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>
    

  • 相关阅读:
    Cookie数据的编码及解码
    删除单链表节点,时间复杂度为O(1)
    匹配URL
    C#文本框允许使用ctrl+A
    实现统计一个字符串所含的不同字符的总数
    调用win32 api 函数SendMessage() 实现消息直接调用
    关于C++的const对象
    从一个文本文件中找出使用频率最高的五个字符
    C++基础中的基础(深拷贝与浅拷贝)
    python+Django CRM客户关系管理系统开发(十)--左右移动选择框功能开发
  • 原文地址:https://www.cnblogs.com/shanlu0000/p/13154451.html
Copyright © 2020-2023  润新知