express框架

時間 2019-11-15

標籤 express 框架简体版

原文原文鏈接

1、什麼是express

　　express是後臺的框架， jquery，bootstrap，easyui這些是前端框架，徹底不是一個東西html

　　express做爲後臺框架固然是爲了方便前端

　　　　前端框架開發前臺的時候：jquery jq對象 DOM對象，方法不能混用node

　　　　express 參差一點原生node也是OK的jquery

　　express官網：http://www.expressjs.com.cn/ 參考手冊4.x數據庫

　　express下載安裝：express

　　　　1.npm init 初始化package.jsonnpm

　　　　2.npm install express --save （--save是更新package。json文件）json

　　　　npm install 能夠根據package.json文件中的依賴項去安裝node_modules文件夾中的包bootstrap

2、express的基本寫法：

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


app.use(express.static("./app"));   //靜態伺服

app.get("/hello",function(req,res){
    res.send("hello express");
})











app.listen(3000);

3、模板引擎

　　模板引擎（這裏特指用於Web開發的模板引擎）是爲了使用戶界面與業務數據（內容）分離而產生的，它能夠生成特定格式的文檔，用於網站的模板引擎就會生成一個標準的HTML文檔。前端框架

　　一、ejs模板引擎

　　原生node的寫法：

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

var server = http.createServer(function(req,res){
    fs.readFile("./views/index.ejs",function(err,data){
        // 模板加載完成
        // console.log(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);

　　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>

　　二、jade模板引擎

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

app.engine('jade',require("jade").__express);

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

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





app.listen(3000)

　　jade文件：

html
    head
        title 今天下午考試
    body
        #box
            ul
                li 吃飯
                li 睡覺
        #box2

4、中間件問題

　　咱們先來看一段簡單的代碼：

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

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

    // res.send("2");
})
app.listen(3000);

　　這裏運行服務器後臺輸出的是1，不是2，也不是1和2，這是爲何呢？ express中接口能夠寫成正則的形式，後面的接口也能正好匹配這個接口，那麼後面那個接口就再也進不去了

//路由的設計跟順序是相當重要
app.get("/:username/:id",function(req,res){
    res.send("用戶+編號界面")
})
app.get("/admin/login",function(req,res){   //這個地方永遠進不去
    res.send("管理員登陸界面")
})

　　那麼這個問題要怎麼解決呢：

　　回調函數中能夠傳入第三個參數next，而後函數體中進行判斷，next（）以後能夠轉到下一個接口匹配。

//路由的設計跟順序是相當重要
app.get("/:username/:id",function(req,res,next){
    // if(檢索數據庫){
    //     res。send（用戶信息）
    // }else{
    //     next（）
    // }
    res.send("用戶+編號界面")
})
app.get("/admin/login",function(req,res){   //這個地方永遠進不去
    res.send("管理員登陸界面")
})

5、express中獲取請求參數的方式：

　　一、獲取get請求：

// 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)

　　二、獲取post請求：

//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);

1. Express框架——Express框架及初體驗
2. Express框架
3. node.js框架 express
4. Express 框架
5. Node.js Express 框架
6. express框架
7. node、express框架
8. Express （Node.js 框架）
9. Node框架——express
10. node Express 框架
更多相關文章...
• Docker 架構 - Docker教程
• SSH框架（Struts2+Spring+Hibernate）搭建整合詳細步驟 - Spring教程
• 適用於PHP初學者的學習線路和建議
• 常用的分佈式事務解決方案

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。