Express學習筆記(2) – Express 中的路由(Router)

什麼是路由?

舉一個現實生活中的例子: 打電話的時候有一排按鍵,按鍵 1 對應:業務查詢、按鍵 2 對應手機充值、按鍵 3 對應業務辦理…等,路由是按鍵與服務之間的映射關係。

Express 路由基本格式

在 Express 中,路由指的是 client 端的請求與伺服器處理函數之間的映射關係。 Express 中的路由分成三個部分組成,分別是:請求的類型(GET, PUT, PATCH, DELETE, POST…等)、請求的URL地址、處理函數,格式如下:

app.METHOD(PATH, HANDLER);

例如:

app.get("/", (req, res) => {
  res.send("Hello, World!");
});

app.post("/", (req, res) => {
  res.json({ message: "Hello!" });
});

路由的概念

路由的匹配過程

每當一個請求到達 server 之後,需要先經過路由的匹配,只有匹配成功之後才會調用相應的處理函數。 在匹配時,會按照路由的先後順序進行匹配,如果請求類型和請求的 URL 同時匹配成功,則 Express 會將這次的請求轉交給對應的 function 來進行處理。

nLg0zve Express學習筆記(2) – Express 中的路由(Router)

路由的使用

最簡單的用法

在 Express 中使用路由的最簡單方式就是把路由掛載到 app 上,如上述所演示的程式碼:

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

app.get("/", (req, res) => {
  res.send("Hello, World!");
});

app.post("/", (req, res) => {
  res.json({ message: "Hello!" });
});

app.listen(port, () => {
  console.log(`Example app listening on port http://127.0.0.1:${port}`);
});

但隨著路由越來越多,我們很少會把路由直接掛載到 app 上。

模組化路由

為了方便對路由進行模組化的管理,Express 不建議將路由直接掛載到 app 上,而是推薦將路由抽離為單獨的模組,將路由抽離為單獨模組的步驟如下:

  1. 創建路由模組對應的 .js 檔
  2. 調用 express.Router()函數創建路由物件
  3. 向路由物件上掛載具裡的路由
  4. 使用 module.exports向外共享路由物件
  5. 使用 app.use()函數註冊路由模組

創建路由模組

新建 routes 資料夾,再新建 users.js,專門用來存放 users 相關的路由:

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

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

router.post('/user/:name', (req, res) => {
    const { name } = req.params;
    res.send(`Add a new user: ${name}`);
});

module.exports = router;

註冊路由模組

現在,我們可以在 app.js 中引入 users.js,再透過 app.use()函數來註冊路由模組:

const express = require("express");
const app = express();
const port = 3000;
const users = require('./routes/user'); // 引入 users 模組

app.use(users); // 註冊路由模組

app.get("/", (req, res) => {
  res.send("Hello World!");
});

app.listen(port, () => {
  console.log(`Example app listening on port http://127.0.0.1:${port}`);
});

現在,我們可以直接以瀏覽器開啟 http://127.0.0.1:3000/users/list或者用 POSTMAN 試著發送 get 請求,如果順利,我們會看到 get user list的字樣。

sjXov1U Express學習筆記(2) – Express 中的路由(Router)

app.use() 函數的作用,就是用來註冊全局中間件(middleware),之後的跨域請求也需要依靠中間件來解決。

為路由模組添加前綴

如果,你不希望所有 users 的路由還要在 URL 前面加上一個 users,那你可以在中間件設定前綴,如此一來 users.js 中的所有路由都只需要命名 users 之後的 url 即可。

app.use('/usesr', users); // 路由模組前綴
router.get('/list', (req, res) => {
    res.send("get user list");
});

router.post('/:name', (req, res) => {
    const { name } = req.params;
    res.send(`Add a new user: ${name}`);
});
0 0 評分數
Article Rating
訂閱
通知
guest

0 Comments
在線反饋
查看所有評論