Stories

Detail Return Return

Express入門學習記錄 - Stories Detail

Express 簡介

Express 是一個流行的 Node.js Web 應用程序框架,它提供了一組強大的功能和工具,用於構建 Web 應用程序和 API。它是建立在 Node.js 的 HTTP 模塊之上的,通過簡化常見任務和提供靈活的路由機制,使得構建 Web 應用程序變得更加快速和簡單。
它是web框架,能夠提供後端服務能力,並能以類似JSP模版的形式渲染web頁面。

express特性

express有兩個核心模塊——路由和中間件,路由是對請求路徑的匹配與處理,中間件則是一個前置方法,比如在請求響應客户端(response to client)之前,你可以通過這個方法對返回的數據進行結構化、過濾或者其他的一些操作。

Express 的基本使用

準備工作

首先,確保你的電腦上已經安裝了 Node.js。你可以在 Node.js 的官方網站(https://nodejs.org)上找到安裝説明。

創建一個新的 Express 應用程序

mkdir express-demo
cd express-demo
npm init -y

image.png

這將創建一個名為 express-demo 的新文件夾,並在其中創建一個新的 Node.js 項目。

安裝express

npm install express

以上命令會將 Express 框架安裝在當前目錄的 node_modules 目錄中

創建一個簡單的 Express 應用程序

在 my-express-app 文件夾中創建一個名為 app.js 的新文件

touch app.js

並在其中編寫以下代碼:

const express = require('express')

const app = express()

app.get('/', (req, res) => {
    res.send('hello world!')
})

app.listen(3000, () => {
    console.log('Server running at http://localhost:3000/')
})

監聽 GET 請求

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

參數1: 客户端請求的url地址
參數2: 請求對應的處理函數

req:請求對象

  1. req.app:當callback為外部文件時,用req.app訪問express的實例
  2. req.baseUrl:獲取路由當前安裝的URL路徑
  3. req.body / req.cookies:獲得「請求主體」/ Cookies
  4. req.fresh / req.stale:判斷請求是否還「新鮮」
  5. req.hostname / req.ip:獲取主機名和IP地址
  6. req.originalUrl:獲取原始請求URL
  7. req.params:獲取路由的parameters
  8. req.path:獲取請求路徑

更多參考 https://expressjs.com/zh-cn/4x/api.html#req

res:響應對象

  1. res.append():追加指定HTTP頭
  2. res.set()在res.append()後將重置之前設置的頭
  3. res.clearCookie():清除Cookie
  4. res.get():返回指定的HTTP頭
  5. res.json():傳送JSON響應
  6. res.send():傳送HTTP響應
  7. res.status():設置HTTP狀態碼

執行以上代碼:

node app.js
應用實例,訪問地址為 localhost:3000

image.png

路由

我們已經瞭解了 HTTP 請求的基本應用,而路由決定了由誰(指定腳本)去響應客户端請求。在HTTP請求中,我們可以通過路由提取出請求的URL以及GET/POST參數等。
想象一下你住在一個公寓樓裏,而每個房間都有一個房間號。路由就像是這個房間號一樣,它告訴 Express 應用程序當接收到某個特定的 URL 請求時,該去哪裏找到處理這個請求的代碼。

const express = require('express')

const app = express()

app.get('/', (req, res) => {
    res.send('hello world!')
})

app.listen(3000, () => {
    console.log('Server running at http://localhost:3000/')
})

app.get('/todos/:id', (req, res) => {
    res.send(`get /todos/${req.params.id}`)
})

app.post('/todos', (req, res) => {
    res.send('post /todos')
})

app.patch('/todos', (req, res) => {
    res.send('patch /todos')
})

app.delete('/delete', (req, res) => {
    res.send('delete /todos')
})

image.png

image.png

路由模塊化

Express 不建議將路由直接掛載到 app 上,而是推薦將路由抽離為單獨的模塊。這是為了防止一旦項目大,不方便維護

創建路由模塊

// todoRoutes.js

const express = require('express');
const router = express.Router();

// 定義用户路由
router.get('/', (req, res) => {
  res.send('hello world');
});

router.get('/todos', (req, res) => {
  res.send('get todos');
});

module.exports = router;

註冊路由模塊

// app.js

const express = require('express');
const app = express();

const todoRoutes = require('./todoRoutes');

//app.use() 註冊全局中間件,並添加前綴
app.use('/api', todoRoutes);

app.listen(3000, () => {
  console.log('Server is running on port 3000');
});

image.png

通過這種方式,你可以將不同功能模塊的路由分別放在單獨的文件中,使得代碼更加清晰和易於維護。這種路由模塊化的方法使得 Express 應用程序更具可擴展性,

Add a new Comments

Some HTML is okay.