一、EJS

概述：前端咱们使用过的一个模板套路，是underscore的套路。接下来EJS它属于后台工程师人的模板。

https://www.npmjs.com/package/ejs 官网地址

特点：

Control flow with <% %>             流程控制语句用的是<% %>   :例如if   for循环等等

Escaped output with <%= %> (escape function configurable)     如果有赋值的操作（输出）你可以用<%= 变量名%>

//需要的模块 express  app.js

var express = require("express");

var app = express();

//设置模板引擎

app.set("view engine","ejs");

//这个是修改默认的文件夹的目录名字

app.set("views","template");

app.get("/",function  (req,res) {

       //这里需要注意的事情：不需要拼接路径

      res.render("shouye",{

            "gaoxing":"高兴",

            "dongxi":"iphoneX",

            "qian":2,

             "ouxiang":["赵本山大叔","刘德华","成龙"]

       })

});

app.listen(3000);
//template  shouye.ejs

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8" />

    <title></title>

</head>

<body>

     <h1>我今天好<%=gaoxing%>啊,我买了一个<%=dongxi%>,花了我<%=qian%>啊</h1>

     <select>

         <% for(var i = 1990 ; i< 2017 ; i++) {%>

              <% if (i %2 ==0) {%>

                 <option><%= i %></option>

              <% }%>

         <% } %>

     </select>

       <ul>

          <% for(var i = 0 ;i < ouxiang.length ;i++) {%>

                    <li><%= ouxiang[i]%></li>

          <% } %>

       </ul>

</body>

</html>

提示：①不需要引入EJS模块，因此就不需要require(“EJS”);

②设置视图的模板引擎为ejs,app.set(“view engine” ,”ejs”),设置完模板引擎，自动回搜索views文件夹中的模板。

③如果需要重新设置views文件夹的名称，app.set(“views”,”template”);

④已经学习过的res.send  end json jsonp redirect ，今天又学习了一个render

⑤res.render(“shouye”),直接加上模板的名称，不需要拼接路径也不需要有ejs尾缀，渲染的数据用第二个参数json传递

二、cookie (cookie-parser)

概述：HTTP协议（应用层FTP）而且还是短轮询链接，发起一次请求之后，就断开连接了；

Cookie它主要做的事情，是让服务器知道谁访问了我，知道谁是谁。

注意：这里面的信物就是咱们今天学习的cookie(饼干)，cookie的下发是服务器下发；在node的学习当中有一个模块叫做，它对于cookie进行了封装。

注意：cookie是由服务器下发，用的是报文头下发，报文当中多了一个选项 set-cookie = “XXXXXXX”,

当你浏览器再次访问服务器的时候，用的是上行请求的报文头装载cookie在上去。

//app.js

var express = require("express");

//解析cookie的时候，需要他解析

var cookieParser = require('cookie-parser');

var app = express();

app.use(cookieParser());

//设置模板引擎

app.set("view engine","ejs");

//中间件

app.get("/",function  (req,res) {

     res.render("shouye",{

        "arr":req.cookies.visited||[]

     });

});

//接受的是浏览器反问的时候给咱们的城市的信息

app.get("/:city",function  (req,res) {

     var city = req.params.city;

  //这是第一次访问咱们这个中间件的时候，因为cookie还没有因此就没有visited的属性，因此走if分支

      if(!req.cookies.visited){

          var arr = [city];

      }else{

  //第二次访问这个中间件的时候，namecookie已经有了，因此在网cookie当中数组当中添加新的数据

          var arr = req.cookies.visited;

          if(arr.indexOf(city)==-1){

              arr.push(city);

          }

      }

     res.cookie("visited",arr,{maxAge:1000*60*60*24});

     res.send("<h4>你要去的地方是"+city+"</h4>");

})

app.listen(3000);
//template   shouye.ejs 模板页面

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8" />

    <title></title>

</head>

<body>

    <div>

        旅游攻略

        <a href="/北京">北京</a>

        <a href="/上海">上海</a>

        <a href="/广州">广州</a>

        <a href="/深圳">深圳</a>

        <a href="/苏州">苏州</a>

        <a href="/杭州">杭州</a>

        <a href="/成都">成都</a>

    </div>

    <% for(var i = 0; i< arr.length;i++) {%>

             <h4><%= arr[i]%></h4>

    <% } %>

</body>

</html>

三、session(express-session)

概述：每一次用户登录的时候，服务器会给客户端下发一个乱码（session），而每一次浏览器在反问的时候，带着乱码在上去，对比的活是服务器在做。服务器当中的某一部分的内存在进行对比，它（服务器）就知道你是谁？谁来了。

上面的这些操作相当于 setCookie 与cookie已经这只好了；

但是很好的一件事情，是express，它对外暴露了一个模块，这个模块对session进行了封装，我们直接使用，这个模块的名字 express-session

案例描述：有一个form表单，有用户名和密码（123456），每个人登录之后页面显示你的用户名；

//app.js

var express = require("express");

var formidable = require("formidable");

//express-session 模块的引用

var session = require('express-session');

var app = express();

//下面的东西不需要理解，因为人家让你这么写的

app.set('trust proxy', 1) ;

app.use(session({

  secret: 'jiachenghao',

  resave: false,

  saveUninitialized: true,

  cookie: {maxAge:86400} cookie这个选项什么都可以没有但是必须要有时间的设置

}));

//设置模板引擎

app.set("view engine","ejs")

app.get("/",function  (req,res) {

      res.render("index",{

          login:req.session.login,

          yonghuming:req.session.yonghuming

      });

});

//post请求用formidable

app.post("/login",function  (req,res) {

    var form = new formidable.IncomingForm();

    form.parse(req,function  (err,fields) {

        if(fields.mima=="123456"){

            req.session.login = true;

            req.session.yonghuming = fields.yonghuming;

            //重定向：又进入主页面是发起一次请求

            res.redirect("/")

        }

    })

})

app.listen(3000);

//template  shouye.ejs  模板页面

<% if(!login) {%>

      <!-- 没有登录的情况 -->

     <form action="/login" method="post">

        <p>

             用户名:<input type="text" name="yonghuming"/>

        </p>

         <p>

             密码&nbsp;&nbsp;:<input type="text"  name="mima"/>

        </p>

            <input type="submit"/>

     </form>

     <% }else{%>

      <!-- 这里是登录的情况 -->

          <h3>欢迎你进入你的首页<%=yonghuming%></h3>

     <% }%>

node（4）express 框架 EJS模板，cookie, session的学习的更多相关文章

  1. Node.js Express 框架

    Node.js Express 框架 Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP ...

  2. Node.js Express框架

    Express 介绍 Express是一个最小的,灵活的Node.js Web应用程序框架,它提供了一套强大的功能来开发Web和移动应用程序. 它有助于基于Node Web应用程序的快速开发.下面是一 ...

  3. node之Express框架

    Express是node的框架,通过Express我们快速搭建一个完整的网站,而不再只是前端了!所以Express还是非常值得学习的! express有各种中间件,我们可以在官方网站查询其用法. Ex ...

  4. Node.js Express 框架 Express

    Express 简介 Express 是一个简洁而灵活的 node.js Web应用框架, 提供了一系列强大特性帮助你创建各种 Web 应用,和丰富的 HTTP 工具. 使用 Express 可以快速 ...

  5. 44.Node.js Express 框架--web框架

    转自:http://www.runoob.com/nodejs/nodejs-express-framework.html Express 简介 Express 是一个简洁而灵活的 node.js W ...

  6. Node.js Express 框架学习

    转载:http://JavaScript.ruanyifeng.com/nodejs/express.html#toc0 感觉很牛的样子,不过觉得对初学者没太大用,里面很多例子用的api都没有详细的说 ...

  7. Node的express框架安装

    第一步:在cmd命令行下执行npm install -g express,安装全局的express. 第二步:在命令行中输入express,如果出现express不是内部命令时, 输入npm inst ...

  8. 快速创建node应用[Express框架]

    安装Express npm install -g express 建立工程 express -e ejs FaceExpresscd FaceExpress && npm instal ...

  9. Node.js+Express框架+Mongo学习(一)第一个node.js实例

    1.在桌面新建一个空的文件夹,比如叫node,当然也可以在其它地方新建. 2.命令行进入到所新建的文件夹的目录,下载Express框架,再在这个文件夹里新建一个叫final的项目 3.在项目(fina ...

随机推荐

  1. C语言 for循环次数

    for (i = 0;i < n;i++) 则循环次数是N,而循环结束以后,i的值是n.循环的控制变量i,是选择从0开始还是从1开始,是判断i<n 还是i <= n,对循环的次数,循 ...

  2. <context:component-scan>详解 转发 https://www.cnblogs.com/fightingcoding/p/component-scan.html

    <context:component-scan>详解   默认情况下,<context:component-scan>查找使用构造型(stereotype)注解所标注的类,如@ ...

  3. 【DB2】SQL0437W Performance for this complex query may be sub-optimal

    参考链接 Technote (troubleshooting) Problem(Abstract) Error [IBM][CLI Driver][DB2/6000] SQL0437W Perform ...

  4. flask小demo-数据查询

    mysqlconn-flask.py # -*- coding: utf-8 -*- #coding=utf-8 import os import mysql.connector from flask ...

  5. 在Windows家里杀死一个偷端口的家伙

    今天,写项目了,写了好多代码,然后运行成功,但是返回的信息啥的还有代码整体的逻辑有点问题,于是就review了代码,改了些东西,然后再次启动服务,但是,问题来了:Address already in ...

  6. tomcat启动(三)Catalina分析-load方法分析

    load()方法按从上到下顺序分析(主要分析本人所没学过的知识点,其它略过...). Digester类作用 使用sax技术对xml进行解析 未开始解析时Digester.push(this)这个用来 ...

  7. WPF中定义TabItem的可选区域(特别是当使用Label来呈现Header时)

    1. 如上图,所示,此时当鼠标移入蓝色框内除文字部分,整个TabItem是没反应的 经过查看代码可以看到: 将图标中的VerticalAlignment="Center"和Hori ...

  8. Kafka消息重新发送

    Kafka消息重新发送   1.  使用kafka消息队列做消息的发布.订阅,如果consumer端消费出问题,导致数据并没有消费,此时不需要担心,数据并不会立刻丢失,kafka会把数据在服务器的磁盘 ...

  9. C# 新建 exe文件，并且自定义协议从浏览器中启动该程序

    1. C# 新建一个 exe 文件: 打开你的 vs ,[文件] ---> [新建] ---> [项目] 选择 Windows 窗体应用,并起一个名字: 接着该文件会在当前项目的 myap ...

  10. 结束回调事件（开头必须cp开头，JSProperties传参）

    <dx:ASPxComboBox ID="comBrand" CssClass="case" ClientInstanceName="comBr ...