[API-d20] - 實戰開發 - Routes 2, get params and request data
接著我們要根據我們開之前寫好的 文件 來開發:
要有下列 routes
TODOs
GET /user/{user_id}/todos/
POST /user/{user_id}/todos/
GET /user/{user_id}/todos/{id}
PUT /user/{user_id}/todos/{id}
DELETE /user/{user_id}/todos/{id}
這樣的需求其實可以用 namespace 實作,不過我們偷懶一點,直接指向 /user 就好
所以在 app.js 加入
var users = require('./routes/users');
app.use('/user', users);
所以會變這樣:
var express = require('express');
var app = express();
// Set routers
var index = require('./routes/index');
var users = require('./routes/users');
app.use('/', index);
app.use('/user', users);
module.exports = app;
不過看起來我們缺少 routes/users.js,所以我們也來新增一個
routes/users.js 內容如下
'use strict';
var express = require('express');
var router = express.Router();
router.get('/', function(req, res) {
});
router.post('/', function(req, res) {
});
router.get('/', function(req, res) {
});
router.put('/', function(req, res) {
});
router.delete('/', function(req, res) {
});
module.exports = router;
好像有那麼一點符合我們要的 routes 了
我們在把每個詳細的 uri 加入
在這邊要注意
因為我們在 app.js 中把 uers.js 加入了 (‘/users’, users)
這個 route
因此在 users.js 中設定的所有 route 都是接在 /users/
後面的
要注意哦
修改後的檔案:
'use strict';
var express = require('express');
var router = express.Router();
// Get todo list
router.get('/:user_id/todos', function(req, res) {
res.status(200).json( {success: "GET lists"} );
});
// Create a todo task
router.post('/:user_id/todos', function(req, res) {
res.status(200).json( {success: "POST"} );
});
// Get a todo task
router.get('/:user_id/todos/:todo_id', function(req, res) {
res.status(200).json( {success: "GET 1 task"} );
});
// Update a todo task
router.put('/:user_id/todos/:todo_id', function(req, res) {
res.status(200).json( {success: "PUT"} );
});
// Delete a todo task
router.delete('/:user_id/todos/:todo_id', function(req, res) {
res.status(200).json( {success: "DELETE"} );
});
module.exports = router;```
將 server 重啟,試著對這些網址丟丟看
這時候使用瀏覽器應該就沒辦法丟 GET 以外的要求了對吧?
此時 chrome extension - POSTMAN 就該上場啦!
打開 POSTMAN 就可以送以下的 request 囉!
GET http://localhost:3000/user/kerkerj/todos
POST http://localhost:3000/user/kerkerj/todos
GET http://localhost:3000/user/kerkerj/todos/1
PUT http://localhost:3000/user/kerkerj/todos/1
DELETE http://localhost:3000/user/kerkerj/todos/1
因為剛剛程式裡面都只讓他回傳 success,因此還沒有太大的作用,
不過已經有感覺了對吧!! XD
Get params from url
我們現在先針對以下這段程式碼作進一步的改寫:
// Get a todo task
router.get('/:user_id/todos/:todo_id', function(req, res) {
res.status(200).json(
{
success: "GET 1 task",
user: req.params.user_id,
todo_id: req.params.todo_id
} );
});
存檔並打開 server,存取 http://localhost:3000/user/test/todos/1
就可以看到回傳值是:
{
"success": "GET 1 task",
"user": "kerkerj",
"todo_id": "1"
}
所以又學到一招了!
先設定想要抓哪一段網址,例如:
/:user_id/todos/:todo_id
前面有加冒號的就是這段網址是要被抓成一個參數
而冒號後面接的就是之後在下面要使用到的名字
要接網址的參數的拿法 - req.params.{???}
例如:
req.params.user_id
req.params.todo_id
拿到了網址的參數,就可以對資料庫做進一步的查詢
Get request data
那要怎麼拿到 request 的 data 呢?
他並不存在于網址列上啊?
這時候就要加入 body-parser
了!
他會在接收到 request 時,幫我們做過處理後,再傳到每個 request 該去的 router 裏
在 app.js 中加入
// 最上面
var bodyParser = require('body-parser');
// 加在 router 前面,切記!!
app.use( bodyParser.json() );
app.use( bodyParser.urlencoded({ extended: true }) );
app.use('/', index);
app.use('/user', users);
接著在 users.js 中的 POST 區塊中加入兩行:
// Create a todo task
router.post('/:user_id/todos', function(req, res) {
var data = req.body;
res.status(200).json( {success: data } );
});
開啓 server, 用下圖的方式對 server 做 request:
記得要加入 header -
Content-Type - application/json
Data 要選擇 raw data - 使用自己寫的 json 格式
就可以看到下面的回傳格式了!
透過拿到 url params 以及 request data
我們就可以使用這些資料來對資料庫做存取了!