zoukankan      html  css  js  c++  java
  • 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>
    

  • 相关阅读:
    Spring spEL
    Spring 使用外部部署文件
    Spring 自动装配
    spring 属性配置细节
    hdu 1054 Strategic Game
    fzu 2037 Maximum Value Problem
    将博客搬至CSDN
    HDU 4714 Tree2Cycle
    HDU 1009 The Shortest Path in Nya Graph
    POJ 1942 Paths on a Grid 组合数的优化
  • 原文地址:https://www.cnblogs.com/shanlu0000/p/13154451.html
Copyright © 2011-2022 走看看