node中express框架使用詳解

ITzhongzi發表於2017-04-08

express框架

產生的原因:
    1.http模組在處理路由這塊比較雞肋
    2.http模組在處理靜態資源時比較麻煩
    3.http在獲取瀏覽器的提交過來的引數時很麻煩
    4.express能解決url中有中文時,express能自動解碼

基本概念:
express是nodejs傳送網路請求的第三方框架,是NodeJS中一個優秀的 web 解決方案

地址:
https://www.npmjs.com/package/express
https://github.com/expressjs/express

安裝:
    npm i/install express --save

express使用步驟

利用express開啟web伺服器的步驟:
1、在當前專案中使用 npm i/install express --save
2、匯入express包
3、利用express物件建立一個application物件 app
4、在app物件上就有一系列方法(get,post)還可以可以分別設定請求路由
5、利用app.listen()監聽埠

GET方法獲取引數:
    直接從 req.query中就可以獲取,非常簡單

POST方法獲取引數:
    使用一個第三方包 body-parser

express的路由

/man/xz
/man/ld

/woman/qz
/woman/sw

如何使用:
    1.將某一類路由規則放入到一個js檔案中,寫好相應的程式碼,並且暴露出去
        const express = require('express');

        let route = express.Router(); //建立一個路由
        路由的處理...

        module.exports = route; //將建立的路由物件暴露出去

    2.在啟動伺服器的js檔案中,匯入對應的路由,並且呼叫app.use方法使用即可
        const route = require('路由的路徑');

        app.use('路由規則',route); //哪些路由規則適用於該路由


開發注意事項:
    設定路由一定要寫在入口檔案的程式碼後面一些,最好寫在app.listen(xx) 的前一行即可;

express之next方法

使用方式:(有兩種)

    第一種:連寫方式,用得比較少
        app.get('/',(req,res,next)=>{
            res.write('1.0 ');
            next();
        },(req,res,next)=>{
            res.write('2.0 ');
            next();
        },(req,res)=>{
            res.end('3.0 end');
        });

    第二種:分開寫,用得比較多
        app.get('/',(req,res,next)=>{

            res.write('1.0');

            //觸發下一個同樣的路由的回撥函式
            next('route');
        });

        app.get('/',(req,res)=>{

            res.end('2.0');
        });

呼叫的過程分析:
    當瀏覽器請求 http://127.0.0.1:8888/
    觸發第一個回撥函式,當在第一個回撥函式中手工執行next()的時候
    就會觸發第二個回撥函式,一直下去直到最後一個回撥函式被執行,那麼最後
    這個回撥函式可以不用寫next引數

使用注意:
    觸發下一個同樣的路由的回撥函式,路由必須一致

express之萬用字元方法(all)與next方法聯合起來做許可權驗證

使用方式:
    app.all('路由',(req,res,next)=>{

        if(登入過){
            next();  //繼續往下執行真正的請求
        }else{
            res.end("請登入"); //提示使用者登入
        }
    });

注意點:

app.all(xxx); 一定要在所有路由的最前面

express靜態資源處理

使用方式:
    app.use(express.static('靜態資源路徑')); 

訪問時的注意點:
    如果瀏覽器要訪問statics下面的site.css
    url應該是 http://127.0.0.1:8888/site.css 
    如果是http://127.0.0.1:8888/statics/site.css 反而報錯
    如果是statics下面的字母中的靜態資源,則一定要在url中加上子目錄

注意點:
    設定在路由或是app.use(路由),之前
    要在兩個地方寫,一個是html裡面,還有一個地方是入口的js檔案

相關文章