後端向資料庫拿資料時,為了避免資料量過大,往往會實作「分頁」功能( paginaiton ),分頁功能是透過「限制一次能撈取的資料筆數」來達到加速查詢的效果。沒有分頁功能的話,一次回傳大量的資料可能會拖慢伺服器的回應時間,造成體驗不佳等問題。
本篇文將介紹使用 Mongo DB 做分頁功能的一些方法與注意事項
假設我們希望後端能夠回傳以下結構給前端
{
data: Data[]; // 回傳的資料
pager: {
page: number; // 第幾頁
size: number; // 一頁有幾筆資料
total: number; // 資料庫中「總共」有幾筆資料
}
}
limit()
, skip()
limit 與 slip 都是 Mongo DB 中 cursor 的方法,詳見:https://www.mongodb.com/docs/manual/reference/method/js-cursor/
在 Mongo DB 中,要做到 pagination 很簡單,只要使用 limit 與 skip 方法就可以達到
範例程式如下
const getData = async (req, res) => {
let { page, size } = req.query;
page = parseInt(page) || 1;
size = parseInt(size) || 10;
try {
// 取得總數
const total = await db.data.count({});
// 取得分頁資料
const data = await db.data.find({})
.limit(size) // 一頁要取幾筆資料
.skip((page - 1) * size); // 從第幾頁開始, -1 是為了將頁碼從 0 開始
return res.status(200).json({
data,
pager: { total, page, size },
});
} catch (err) {
return res.status(500);
}
};
其實實作 Pagination 的方法很簡單,就是 find()
後面搭配 .limit()
與 .skip()
等等 … 事情有這麼簡單嗎?