初步瞭解Express(基於node.js的後端框架)

Lin-Ya發表於2018-05-10
原文網址 : https://juejin.im/post/5af46579f265da0b981b7c9a
ExpressNode.js後端框架

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）瞭解一下

  1. npm i express-generator -s 介紹
  2. 命令範例：Usage: express [options] [dir]
  3. express --ejs .（在當前目錄下，建立腳手架，選擇模板為.ejs）

[圖片上傳失敗...(image-568d2c-1525946563984)] 這時候我們的目錄下新增很多檔案，檢查一下package.json,發現我們新依賴了很多東西，先安裝好各種依賴。npm i

  1. 執行命令啟動伺服器node bin/www，預設埠是3000，如果你想修改埠的話可以在命令前面指定埠PORT=XXXX

伺服器首頁
此時目錄結構已經比剛剛的完善很多了。

瞭解一下app.js？

  • bin/www 實際上是用來搭建server，監聽埠。當收到請求的時候，則交給app.js來處理。

bin/www

  • app.js 實際上是網站的主體，裡面包括了這個網站依賴的內容、處理請求的邏輯和執行過程。 app.js裡面的app實際上就是一個express的一個例項。

app.js

  1. 設定檢視引擎為ejs
  2. 根據業務邏輯設定中介軟體處理請求的流程。
  3. 設定靜態資源目錄，當請求匹配靜態資源目錄下的路徑的時候，則會返回靜態資源內容。(例如當請求xxx.com/css/style.css的時候，恰好我們的public目錄下有css資料夾，裡面存放著style.css。伺服器就會返回這個檔案)
  4. 根據請求字尾匹配不同的路由，而路由的處理需要我們提前require到app.js裡面。
  5. 假如上述的各個路由都沒有匹配上，我們就要返回404，你所請求的東西不存在。

什麼是中介軟體？

這裡我們參考一下中文文件

中介軟體函式能夠訪問請求物件 (req)、響應物件 (res) 以及應用程式的請求/響應迴圈中的下一個中介軟體函式。下一個中介軟體函式通常由名為 next 的變數來表示。

中介軟體函式可以執行以下任務：

  • 執行任何程式碼。
  • 對請求和響應物件進行更改。
  • 結束請求/響應迴圈。
  • 呼叫堆疊中的下一個中介軟體函式。

如果當前中介軟體函式沒有結束請求/響應迴圈，那麼它必須呼叫 next()，以將控制權傳遞給下一個中介軟體函式。否則，請求將保持掛起狀態。

瞭解一下Router方法？

最簡單的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裡面，使用相應的語法即可動態渲染。

index.ejs

相關文章