Node圖文教程（第四章：express）

Express框架是一款簡潔而靈活的node.js web應用框架。前面咱們本身手動建立服務器在Express中就是一個API的事情，這就使得咱們更加註重業務的功能和開發效率上，沒必要糾結過多底層的事情。

Express中文官網：Express

快速入門

1. 安裝：npm install express --save

2. 項目中引入：

const express = require('express')

// 獲得server（服務器）實例

const app = express()

// 綁定服務器接受請求事件，而且添加處理回調函數

app.get('/', (req, res) => res.send('Hello World!'))

// 綁定服務端口，啓動服務器

app.listen(3000, () => console.log('Example app listening on port 3000!'))
複製代碼

3. 運行項目: node app.js

利用express框架能夠減小咱們的代碼量，比起以前使用node核心模塊http構建服務器代碼排版更直觀。express底層使用的就是http核心模塊的API。若是要處理客戶端不一樣請求路徑，咱們能夠往下羅列多個app.get()方法，無需再使用if...else...來判斷。express也不用咱們設置響應頭的Content-Type和中文編碼格式，會底層自動識別添加，能夠看下面代碼：

const express = require('express')
const app = express()
app.get('/', (req, res) => {
  res.send('您好，中國')
})
app.get('/login', (req, res) => {
  res.send('<h1>登陸</h1>')
})
app.get('/register', (req, res) => {
  res.send('<h1>註冊</h1>')
})
app.listen('3000', () => {
  console.log('running...')
})
複製代碼

express中的靜態服務

前言

在web網站後端開發的過程當中，咱們每每須要把一些靜態文件夾暴露出去，用戶能夠根據url地址去訪問到其中的內容，這些靜態文件每每也稱之爲公共資源，利用express框架能夠方便地託管靜態文件。

本章節對應的API地址：Express 託管靜態文件

1. 在項目中新建一個公共文件夾(公共資源)：public

2. 使用express的靜態文件服務暴露公共資源

• 方法一：（經常使用）

app.use('/public/', express.static('./public'))

第一個參數指定用戶必須以/public/開頭的url地址才能訪問到靜態文件夾下的具體對應文件資源。express.static()裏面傳一個相對路徑，指定要暴露的文件。

let express = require('express')
let app = express()
app.use('/public/', express.static('./public'))
app.listen(3000, ()=> {
  console.log('running...')
})
複製代碼

• 方法二：

app.use(express.static('./public'))

app.use()方法省略第一個參數，用戶無需以/public/開頭，能夠直接以暴露文件夾下對應文件地址訪問對應資源，看例子

let express = require('express')
let app = express()
app.use(express.static('./public'))
app.listen(3000, ()=> {
  console.log('running...')
})
複製代碼

• 方法三：

app.use('/static/', express.static('./public'))

第一個參數爲咱們本身指定的任意文件名，用戶訪問公共資源，須要以咱們指定的文件名開頭的url地址，看例子

let express = require('express')
let app = express()
app.use('/static/', express.static('./public'))
app.listen(3000, ()=> {
  console.log('running...')
})
複製代碼

express結合art-template模板引擎

前言

前面的學習咱們已經知道如何在Node.js中使用art-template模板引擎，一樣在express中也可使用art-template。

1. 安裝相應的第三方包

npm install --save art-template
npm install --save express-art-template
複製代碼

注意：這裏的express-art-template依賴了art-template模塊，因此必須連同art-template模板一塊兒安裝下來。

2. 項目中引入express，配置express-art-template模板引擎

let express = require('express')
// 獲得服務器實例對象
let app = express()

// 配置express-art-template模板引擎，配置以後會在服務器請求事件的回調處理函數response對象中有一個render方法，用於渲染模板字符串返回渲染後的結果。

app.engine('art', require('express-art-template'))

// 爲服務器綁定get請求事件，添加相應處理回調函數

app.get('/', (req, res) => {
  res.render('login.art', {
    title: '這裏是登錄頁'
  })
})
// 綁定服務器監聽端口號，啓動服務器
app.listen(3000, () => {
  console.log('running...')
})
複製代碼

這裏的app.engine('art', require('express-art-template'))爲必須項，是配置模板引擎的關鍵所在，項目中雖然沒有引入art-template模塊，可是因爲依賴關係，因此也必須一同下載安裝。app.engine的第一個參數爲解析模板字符文件的後綴名，art表示模板文件必須以.art爲擴展名，能夠修改成常見的.html格式。res.render()第一個參數爲要解析的模板字符串文件，文件的擴展名與前面的app.engine()第一個參數一致，模板文件會默認去當前同級目錄的views文件夾下查找，因此無需寫文件路徑，也不能寫文件路徑，所以，咱們常常把一些與頁面視圖相關的文件都放在views文件夾下，這也是一種好的編程習慣。第二個參數爲模板配置對象。若是須要修改res.render()默認查找模版文件的位置，好比我但願它去別的文件夾下找，不是views文件夾，可使用下面配置語句：

app.set('views', '替換的文件路徑') // 第一個參數必須爲：views
複製代碼

3. 啓動服務後看到結果

後語

本博文出至於個人GitHub上Node學習教程資料，若是須要demo源碼的小夥伴能夠去GitHub上clone，歡迎小夥伴們star，大家的點贊是我持續更新的動力。

pubdreamcc原創，歡迎轉載！

倉庫地址：Node學習圖文教程