開發框架Express

1、使用緣由

因爲nodejs原生的http核心模塊在某些方面不足以應對開發需求,因此就須要使用框架來加快開發效率,讓代碼更高度統一。在nodejs中有許多web開發框架,如下介紹Express的使用html

2、安裝

3、初步使用

// 引入包
var express=require('express');
// 建立服務器應用程序
var app=express();
// 當服務器收到get請求(敲回車必定是get請求),執行回調處理函數
app.get('/',function(req,res){
    res.send('hello express')
});
// 綁定端口號
app.listen(3000,function(){
    console.log('app is running at port 3000')
});

4、基本路由

①getnode

// 當服務器收到get請求(敲回車必定是get請求),執行回調處理函數
app.get('/',function(req,res){
    res.send('hello express')
});

②postweb

// 當服務器收到post請求,執行回調處理函數
app.post('/',function(req,res){
    res.send('Got a POST resquest')
});

5、靜態服務

app.use('/public/',express.static('./public/'));
//方式1:url當以/public/開頭的時候,去./public/目錄中找對應的資源,推薦


app.use('/a/public/',express.static('./public/'));
//方式2:url必須是以/a/public/開頭,去./public/目錄中找對應的資源(起別名)

app.use(express.static('./public/'));
//方式3:省略第一個參數,則能夠經過省略 /public/ 的方式去訪問(跳級)

6、在express中使用art-template模板引擎

①安裝express

npm install --save art-template
npm install --save express-art-template

②配置npm

//引入express框架
var express=require('express')
var app=express()
//第一個參數默認是art,表明的是.art後綴的文件,這裏能夠寫成html
//express-art-template是express來整合art-templatedao的,雖然不用加載art-template,可是也必須安裝
app.engine('html',require('express-art-template'))

③使用json

app.get('/',function(req,res){
    //express爲response相應對象提供了一個方法render('html模板名',{模板數據}),默認是不可使用的,配置模板引擎之後就可使用
    //第一個參數不能寫路徑,express默認會去項目中的views目錄找index.html(約定視圖文件放在views目錄)
    res.render('index.html',{
        title:'hello world' 
    })
})

④修改默認的views視圖渲染存儲目錄服務器

//注意:第一個參數views欠我不能寫錯
app.set('views',目錄路徑)

7、express中獲取post請求體(使用第三方包body-parser)

①安裝app

npm install --save body-parser

②配置框架

//引入express和body-parser
var express=require('express')
var bodyParser=require('body-parser')
var app=express()
//配置body-parser,配置之後,在req請求對象上會多出一個屬性:body,後面就能夠直接經過req.body來獲取post請求的數據
app.use(bodyParser.urlencoded({extended:false}))
app.use(bodyParser.json())

③使用編輯器

app.use(function(req,res){
    res.setHeader('Content-Type','text/plain')
    res.write('you posted:\n'))
    //能夠經過req.body來獲取post請求數據
    //JSON.stringify(對象,參數2,參數3),
    //參數2爲null或者未提供,則對象全部的屬性都會被序列化;參數3指定縮進用的空白字符串,數字表明有多少的空格
    res.end(JSON.stringify(req.body,null,2)))
})

8、利用express框架重構留言板案例

①額外安裝一些包

②修改表單提交爲post請求

③修改app.js文件

// 加載模塊
var express=require('express');
var bodyParse=require('body-parser');
// 開放public目錄
var app=express();
app.use('/public/',express.static('./public/'));
// 配置art-template模板引擎
app.engine('html',require('express-art-template'));
// 配置body-parser
app.use(bodyParse.urlencoded({extended:false}));
app.use(bodyParse.json());
// 模擬首頁留言列表數據
var comments=[
    {name:"趙一",message:"你用什麼編輯器?",datetime:"2018-1-1"},
    {name:"孫二",message:"今每天氣真好",datetime:"2018-1-1"},
    {name:"張三",message:"飛流直下三千隻",datetime:"2018-1-1"},
    {name:"李四",message:"哈哈哈哈哈",datetime:"2018-1-1"},
    {name:"王五",message:"樓上是傻逼",datetime:"2018-1-1"}
]
//處理請求路徑
app.get('/',function(req,res){
    res.render('index.html',{
        comments:comments
    })
});
app.get('/post',function(req,res){
    res.render('post.html')
});
app.post('/say',function(req,res){
    var comment=req.body;
    comment.datetime='2018-5-5';
    comments.unshift(comment);
    res.redirect('/');
});
// 綁定端口
app.listen(3000,function(){
    console.log('server is running...')
});
相關文章
相關標籤/搜索