如何將參數傳遞給Express post HTTP方法？

Question

我正在構建一個簡單的REST API（使用PouchDB和Vue.js）。現在，我可以創造projects有幾個領域：

server.js：

var express = require('express') 
var PouchDB = require('pouchdb') 
var app = express() 
var db = new PouchDB('vuedb') 

app.post('/projects/new', function(req, res) { 
    var data = { 
    'type': 'project', 
    'title': '', 
    'content': '', 
    'createdAt': new Date().toJSON() 
    } 
    db.post(data).then(function (result) { 
    // handle result 
    }) 
}) 

client.js：

// HTML 

<input type="text" class="form-control" v-model="title" placeholder="Enter title"> 
<input type="text" class="form-control" v-model="content" placeholder="Enter content"> 
<button class="btn btn-default" v-on:click="submit">Submit</button> 

// JS 

submit() { 
    this.$http.post('http://localhost:8080/projects/new').then(response => { 
    // handle response 
    }) 
} 

如何傳遞參數來設置title和content？在REST API中這樣做的傳統方式是什麼？

Answer 1

在服務器端，您可以使用req.body訪問POST請求中客戶端發送的數據。

所以你server.js文件將是這樣的：

var express = require('express') 
var PouchDB = require('pouchdb') 
var app = express() 
var db = new PouchDB('vuedb') 

app.post('/projects/new', function(req, res) { 
    var data = { 
    'type': 'project', 
    'title': req.body.title, 
    'content': req.body.content, 
    'createdAt': new Date().toJSON() 
    } 
    db.post(data).then(function (result) { 
    // handle result 
    }) 
}) 

在客戶端，你必須有一個對象傳遞您的POST請求的身體的$http.post第二個參數。 client.js應該是這樣的：

// HTML 

<input type="text" class="form-control" v-model="title" placeholder="Enter title"> 
<input type="text" class="form-control" v-model="content" placeholder="Enter content"> 
<button class="btn btn-default" v-on:click="submit">Submit</button> 

// JS 

submit() { 
    this.$http.post('http://localhost:8080/projects/new', { 
    title: 'Your title', 
    content: 'The content' 
    }).then(response => { 
    // handle response 
    }) 
}