---
tags: Node.js 直播班 - 2022 春季班
---
# 🏅 Day 14
## req.query 篩選網址參數
除了先前使用 `req.params` 取得動態路由外，也可在 url 帶入相關資訊，再使用 `req.query` 取出網址列的參數
例如：網址列為 `https://example.com/over/there?name=ferrett&color=purple`，其中 ? 用來分隔後面帶入的參數 `name=ferret` 及 `color=purple`，多個參數之間也會使用 & 分隔
當使用者造訪此網址時， express 可以使用 req.query 取出網址列的這些參數
```javascript
app.get('https://example.com/over/there?name=ferrett&color=purple)', function(req, res) {
console.log(req.query)
...
});
// req.query
{
name: 'ferret',
color: 'purple'
}
```
使用 `req.query.name` 或 `req.query.color` 就可以取出需要的資訊做相關處理
req.query 常見的應用是搜尋關鍵字，當使用者輸入關鍵字後，會將關鍵字帶到網址列中，伺服器接收到，再藉由 req.query 取出，尋找資料庫中符合其關鍵字的資料，並回傳至客戶端
```
GET 'https://example.com/search?q=apple' // 通常會以 q 表示搜尋關鍵字
```
```javascript
app.get('/search', function(req, res) {
const q = req.query.q
const results = await Data.find(q); // 使用 mongoose 搜尋資料庫中符合 req.query.q 的資料
res.status(200).json({
status: 'success',
results: results.length,
data: {
results
}
});
});
```
### 參考資源
[Express - req.query](https://expressjs.com/zh-tw/api.html#req.query)
[query - 取得網址參數](https://courses.hexschool.com/courses/1670869/lectures/39299606)（章節影片）
### 題目（將答案寫在 HackMD 並提交至回報區）
請在 express 專案中，將以下 url 中的參數使用 req.query 取出，並回傳取出的參數（可自行建立 express 專案，先在 app.js 練習即可）
```javascript
'http://localhost:3000/products?category=music&page=1' // 在 POSTMAN 發出 GET 請求
app.get('/products', function(req, res) {
// 取出參數
/* 請在此填寫答案*/
res.status(200).json({
status: 'success',
data: {
/* 請在此填寫答案*/
}
});
});
```
回報流程
---
請同學依照下圖教學觀看解答、回報答案:
回報格式：請在「回報區」貼上 CodePen 或 HackMD 連結回報答案 (為了統計人數，請同學依序加上「報數」)
<!-- 解答
```javascript
app.get('/products', function(req, res) {
// 取出參數
const category = req.query.category;
const page = req.query.page;
res.status(200).json({
status: 'success',
data: {
category,
page,
}
});
});
```
-->
回報區
---
| 報數 | 組別 / 名字 | codepen / hackMD / 其他回饋 |
| ---- | ---------------------- | -------------------------------------------------------------------- |
| 1 | 第 6 組/ Wendy | [HackMD](https://hackmd.io/@0k_MSPdgRPujozP6w_D-bA/rJE2DzUH5) |
| 2 | 第 3 組/ Larry | [HackMD](https://hackmd.io/mn4C6-UURSGv6E2tDcpQyQ) |
| 3 | 第 2 組 / wendy.li | [HackMD](https://hackmd.io/34jSGuv9RcW_XtQDp_2JAg) |
| 4 | 第 2 組 / Vic | [HackMD](https://hackmd.io/aT0hHDX2R0Gn7wmHeFkD0w) |
| 5 | 第 4 組 / 小宥 | [HackMD](https://hackmd.io/tfoU-qtKSS2-Ta0FaYd5hw) |
| 6 | 第 3 組 / Hobby | [HackMD](https://hackmd.io/@hobbyling/day14) |
| 7 | 第 8 組 / Jordan Tseng | [HackMD](https://hackmd.io/MaOFBSjzR4eI5YUVGgnrNQ) |
| 8 | 第 3 組 / Justin | [HackMD](https://hackmd.io/DBsD3CjKR4mv2NhlhliSwQ) |
| 9 | 第 3 組 / HedgehogKU | [HackMD](https://hackmd.io/c58MMlf8RZGAplHCuKeEUQ) |
| 10 | 第 6 組 / Ruta | [HackMD](https://hackmd.io/4lb_cWK7R-SIeg112nMoDg) |
| 11 | 第 8 組 / Hank | [HackMD](https://hackmd.io/@TFOivyvXT-qpG6SieUTfgw/SkvQr78Hc) |
| 12 | 第 2 組 / Genos | [HackMD](https://hackmd.io/5A8AcAMeSSOA96WvjFH48g) |
| 13 | 第 2 組｜East | [HackMD](https://hackmd.io/7oFUCnS9THKeGRdeGl7BmQ) |
| 14 | 第 2 組｜Jin | [HackMD](https://hackmd.io/TpLNvcnlSiOvvbrGas4MOA) |
| 15 | 第 5 組 / Hazel | [HackMD@Hazel](https://hackmd.io/@hazelwu/day14) |
| 16 | 第 9 組 / 黃士桓 | [HackMD](https://hackmd.io/XvB01gXwT6yD7YyIB1fFxw) |
| 17 | 第 3 組 / hiYifang | [HackMD](https://hackmd.io/@gPeowpvtQX2Om6AmD-s3xw/HkiSA6Jrc) |
| 18 | 第 11 組 / Han Lai | [HackMD](https://hackmd.io/kP2hMUHORXynbigr9HY28w?view) |
| 19 | 第 4 組 / sihle | [HackMD](https://hackmd.io/@bugbug777/S12rHvLr5) |
| 20 | Naiky | [HackMD @Naiky](https://hackmd.io/@UWBC7rrORiKaLSBg226mZg/Sy7_9QIBq) |
| 21 | 第 4 組 / 苡安 | [HackMD](https://hackmd.io/kBO6eUxoSPuhpChM517K2Q) |
| 22 | 第 9 組 / konstante | [HackMD](https://hackmd.io/7TVozneOROuEN44b25_ntA) |
| 23 | 第 10 組 / Otis | [HackMD](https://hackmd.io/JdnXccHtSE6nNXYT2kY-rw?view) |
| 24 | 第 15 組 / Chiu | [HackMD](https://hackmd.io/yYqRjOpPQU23JVxg80HpEQ)|
| 25 | 第13組 / KFC | [HackMD](https://hackmd.io/VV_y7CcRTBWamPpGrQlE3w?view)|
| 26 | 第 11 組 / Jamie Lee | [HackMD](https://hackmd.io/REUXPNTCQymJwy7XJtyPjA?view) |
| 27 | 第 1 組 / Ed Huang | [HackMD](https://hackmd.io/dpDol8oATYKfB7Q-wn97xA?view) |
| 28 | 第10組/橘子 | [HackMD](https://hackmd.io/o3I1jYBNQOKG1xfSJKP8zg) |
| 28 | 第 2 組 / joe chang | [HackMD](https://hackmd.io/uaRTw9c0TgOrADyXMmGL0Q?view#427---reqquery-%E7%AF%A9%E9%81%B8%E7%B6%B2%E5%9D%80%E5%8F%83%E6%95%B8) |
| 29 | 第 15 組 / Tofu | [HackMD](https://hackmd.io/Ja1SKe_PTd6G9dL0rHy6lA)
| 30 | 第 1 組 / Claire | [HackMD](https://hackmd.io/mYs2b4pVTs-Xs7aSCM4ovg)
| 31 | 第 9 組 / Reynold | [HackMD](https://hackmd.io/@dL7AuQEMQ6KpCSRHaYElOA/H1iBpgFBc)
| 32 | 第 2 組 / peter | [HackMD](https://hackmd.io/@peterchen1024/HJOX9GtB9)
| 33 | 第 14 組 / Uniza| [HackMD](https://hackmd.io/jzmB1sQARDaqZdftbvh4Dw)
| 34 | 第 1 組 / snow| [HackMD](https://hackmd.io/@snowsuika/rymhtsiH5)
| 35 | 第 2 組 / Rikkubook| [HackMD](https://hackmd.io/7TyINeRxRCWs5Di6dqBIcQ)
| 36 | 第 7 組 / jason06286| [HackMD](https://hackmd.io/KeaRpLGrQxSa0kJKMyHWdA)
| 37 | 第 12 組 / Jimmy| [HackMD](https://hackmd.io/72pCNFv4SeGj8OfZEB5V8Q)
| 38 | 第 16 組 / 皓皓| [HackMD](https://hackmd.io/01bst263RISj-DCm1HP43g)
| 39 | 第 5 組 / Nap| [HackMD](https://hackmd.io/@8x8YzkXNSzafUSO3LZTmUw/Byig-2CSq)
| 40 | 第 3 組 / 小葉| [HackMD](https://hackmd.io/@FyKv37KcRSWqAO_e336w8g/r1w6uoJI5)
| 41 | nick | [HackMD](https://hackmd.io/YoMvWaguQbmbqtJYJlCSow)
| 42| 第 11 組 / mandy | [HackMD]( https://hackmd.io/vFmWZoHqT1q4LTVHNDMpdQ)
| 43| 第 14 組 / yolala | [HackMD]( https://hackmd.io/NaN0lzgzSU6RQJtIpMr0Hw)
Sign in with Wallet
Connect another wallet