Express:基於node.js的後端框架。介紹
實現一個HELLO WORLD
使用步驟:
1.mkdir app
, cd app
2. npm init
3. npm i express -s
4. hello world
var express = require('express');//引入exrpess
var app = express();//建立例項
//路由。當url匹配這裡的路由,就交由後面的函式處理
app.get('/', function (req, res) {
res.send('Hello World!');
});
//建立server
var server = app.listen(3000, function () {
var host = server.address().address;
var port = server.address().port;
console.log('Example app listening at http://%s:%s', host, port);
});
複製程式碼
咋看上去跟使用node.js建立一個靜態server有點像呢?emm因為express是基於node.js平臺。 上面本質上其實就是建立了一個本地server,監聽3000埠。server獲取的url的字尾,進行路由匹配,然後交給對應的函式進行處理。
Express應用生成器瞭解一下?
上面的伺服器看上去好像很單薄呀,如果我要實現登入註冊等等豈不是要自己寫一大堆? Express應用生成器(express-generator)瞭解一下
npm i express-generator -s
介紹- 命令範例:
Usage: express [options] [dir]
express --ejs .
(在當前目錄下,建立腳手架,選擇模板為.ejs)
[圖片上傳失敗...(image-568d2c-1525946563984)]
這時候我們的目錄下新增很多檔案,檢查一下package.json,發現我們新依賴了很多東西,先安裝好各種依賴。npm i
- 執行命令啟動伺服器
node bin/www
,預設埠是3000,如果你想修改埠的話可以在命令前面指定埠PORT=XXXX
瞭解一下app.js?
- bin/www 實際上是用來搭建server,監聽埠。當收到請求的時候,則交給app.js來處理。
- app.js 實際上是網站的主體,裡面包括了這個網站依賴的內容、處理請求的邏輯和執行過程。 app.js裡面的app實際上就是一個express的一個例項。
- 設定檢視引擎為ejs
- 根據業務邏輯設定中介軟體處理請求的流程。
- 設定靜態資源目錄,當請求匹配靜態資源目錄下的路徑的時候,則會返回靜態資源內容。(例如當請求
xxx.com/css/style.css
的時候,恰好我們的public目錄下有css資料夾,裡面存放著style.css。伺服器就會返回這個檔案) - 根據請求字尾匹配不同的路由,而路由的處理需要我們提前require到app.js裡面。
- 假如上述的各個路由都沒有匹配上,我們就要返回404,你所請求的東西不存在。
什麼是中介軟體?
這裡我們參考一下中文文件
中介軟體函式能夠訪問請求物件 (req)、響應物件 (res) 以及應用程式的請求/響應迴圈中的下一個中介軟體函式。下一個中介軟體函式通常由名為 next 的變數來表示。
中介軟體函式可以執行以下任務:
- 執行任何程式碼。
- 對請求和響應物件進行更改。
- 結束請求/響應迴圈。
- 呼叫堆疊中的下一個中介軟體函式。
如果當前中介軟體函式沒有結束請求/響應迴圈,那麼它必須呼叫 next(),以將控制權傳遞給下一個中介軟體函式。否則,請求將保持掛起狀態。
瞭解一下Router方法?
router方法本質上是一個匹配請求的函式,一般理解為Express的路由層中介軟體。當匹配給router方法的時候,先處理請求,返回響應資料給模板引擎進行渲染。同時我們看到裡面還有一個引數next
,這是是中介軟體的回電函式,如果他帶有引數,則表示丟擲一個錯誤,引數為錯誤的文字,例如:
function Middleware(request, response, next) {
next('出錯了!');
}
複製程式碼
丟擲錯誤以後,後面的中介軟體將不再執行,直到發現一個錯誤處理函式為止。如果沒有呼叫next方法,後面註冊的函式也是不會執行的。
使用模板引擎
我們在一開始利用express-generator生成框架的時候,輸入了ejs
,這個ejs
就是我指定了的模板引擎。通過模板引擎,我們不再把html裡面的內容寫死,而是通過router動態地把資料傳給模板引擎,讓它根據我們傳入的資料動態地渲染頁面,甚至我們可以通過判斷語句來給不同的登入狀態的使用者渲染頁面,通過迴圈語句給頁面新增內容等等,上面的router圖片中的
res.render('index', {title: 'Express'})
複製程式碼
就是我們給模板引擎傳給引數,選擇index模板,傳入一個物件,key為title,value是一個字串。然後我們只需要在views
中的index.ejs
裡面,使用相應的語法即可動態渲染。