express框架

什么是express？

express是基于node.js平台的后台框架，通俗点来说就是为了方便，快速的完成node。

在这里要注意一下！

express不同于前台框架jQuery中jq对象和dom对象不可以混用，在express中是可以参差一些原生node的。

express的下载：

1.npm init 初始化pakage.json

2.npm install express --save

express的使用

let express = require("express");//引入express
let app = express();    //创建了一个express的应用
app.use(express.static("./app"));   //静态伺服
app.get(path,function(req,res){
    res.send({"name":"jack"})
//send中是不需要转成str或者buffer，写的时候按照严格规范来
})
//这里的path可以是一种正则，大小写不区分自动转寒

app.listen(3000);//监听端口

这里就可以看出express相比较原生node减少了大量的代码使用

express的一个重点模板引擎

想要使用模板引擎就必须用到ejs模块

// 引入ejs
var ejs = require("ejs");

//模板 day是变量
var string = "今天星期<%= day %>,天气真好";

//数据
var data = {
    day : "三"
}
// 数据绑定
var html = ejs.render(string,data);
console.log(html);//今天星期三，天气真好

这里的模板写法十分独特，下面用一个实例来说明

提醒一下：模板一定要写在ejs文件里

ejs代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <h1>今天星期<%= day %>,天气真好</h1>
    <ul>
        <%
            for(var i = 0;i < news.length;i++){
                if(news[i].num > 100){
        %>
        
            <li><%= news[i].title %></li>

        <%
                }
            }
        %>
    </ul>

</body>
</html>

js代码：

原生node写法

var ejs = require("ejs");
var fs = require("fs");
var http = require("http");

var server = http.createServer(function(req,res){
    fs.readFile(path,function(err,data){//读取模板
        // 模板加载完成
        var template = data.toString();//改变数据格式
        // 数据
        var dota = {
            day : "三",
            news : [
                {"title" : "美文阅读","num" : 300},
                {"title" : "杂志小说","num" : 500},
                {"title" : "动漫影视","num":50}
            ]
        }
        // 数据和模板进行绑定
        var html = ejs.render(template,dota);


        // 展示
        res.writeHead(200,{"content-type":"text/html;charset=utf8"})
        res.end(html);


    })
});


server.listen(3000)

express写法

var express = require("express");
var app = express();

//使用模板引擎的时候需要设置
//1.不需要引入ejs，不需要引入fs，http
app.set("view engine","ejs");//引入模板

// 展示
app.get("/",function(req,res){
    // 数据
    var data = {
        day : "三",
        news : [
            {"title" : "美文阅读","num" : 300},
            {"title" : "杂志小说","num" : 500},
            {"title" : "动漫影视","num":50}
        ]
    }
    res.render("index",data)
})
app.listen(3000);

中间件问题

// 正常情况下未加中间件
var express = require("express");
var app = express();

app.get("/",function(req,res){//每次都进入这里
    console.log(1)//1
})
app.get("/",function(req,res){//永远不会进入
    console.log(2)
})

app.listen(3000);

每次都进入前面接口是因为我们path路径可以写成一个正则的形式，每次都可以匹配第一个接口，所以后面的接口永远不会进去

// 当我们加入next中间件执行next（）可以跳到下一个接口
//1和2都会打印这说明两个接口都进入了
var express = require("express");
var app = express();

app.get("/",function(req,res,next){
    console.log(1)//1
    next()
})
app.get("/",function(req,res){
    console.log(2)//2
})
app.listen(3000)

这样我们就可以利用中间件做一个计数器，每次都会进入第一个请求。

注意：

中间件所在的位置至关重要，在下面的话就不行

express的get和post获取参数方法

// express  获取get参数
// 原生的获取方式，就是url.parse(req.url,true).query

var express = require("express");
var app = express();

app.get("/",function(req,res){
    console.log(req.query);
    res.send("OK")
})

app.listen(3000)

//express 中post获取参数的方式
var express = require("express");
var bodyParser = require("body-parser");
var app = express()

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

app.get("/",function(req,res){
    res.render("form");
})

app.use(bodyParser.urlencoded({ extended: false }));   //post请求的请求头
app.post("/",function(req,res){
    console.log(req.body);
    res.send("post方式提交成功");
})



app.listen(3000);

express框架

相关文章