我学会了在使用 express 时如何从 post 请求中获取正文数据。大多数示例代码表示req.body.item
应该能够获取我想要使用的值,例如,将值插入表中。
但是我无法获得价值,req.body.item
但最终可以通过req.body.body.value
. 我是不是没有以正确的方式获取 post body 值,或者这不是问题?
Node.js
v14.15.4
Nuxt.js
@ v2.15.4
Vue.js
[email protected]
Express
^4.17.1
(expense.vue),使用正确的代码
发布表单数据更新为“books/books/add”
<template>
<div>
<div class="main">
<h3>please type expense name and amount</h3>
<form @submit.prevent="addToBookDB">
<label for="name_expense">expense name: </label>
<input v-model.trim="expenseTitle" />
<label for="price_expense">expense amount: </label>
<input v-model="expenseSummary" />
<input type="submit" value="Submit" />
</form>
</div>
</div>
</template>
<script>
import Vue from 'vue'
import axios from 'axios'
Vue.config.productionTip = false
export default {
data () {
return {
expenseTitle: 'Title',
expenseSummary: 'Summary',
}
},
methods: {
addToBookDB (event) {
console.log(event)
const formData = {
expenseTitle: this.expenseTitle,
expenseSummary: this.expenseSummary
}
console.log(JSON.stringify(formData))
//<<wrong code↓>>
//axios.post('books/books/add', {
// headers: {
// 'Content-Type': 'application/json'
// },
// body: formData
//<<correct code↓>>
axios.post('books/books/add', formData
).then((response) => {
console.log(response)
return response
}).catch((response) => {
console.log(response)
return response
})
}
}
}
</script>
(books.js),更新了正确的代码,
将收到的帖子数据插入到表中
const express = require('express')
const app = express()
app.use(express.json())
app.use(express.urlencoded({
extended: true
}))
app.get('/books', (req, res) => {
// (omitted)
})
app.post('/books/add', (req, res, next) => {
const mysql = require('mysql')
const connection = mysql.createConnection({
host: '***.*.*.*',
user: '******',
database: '******',
password: '******',
})
connection.connect()
//const expenseTitle = req.body.body.expenseTitle
const expenseTitle = req.body.expenseTitle
connection.query("INSERT INTO book (title, summary) values (?,'1000');", [expenseTitle], function (error, row, fields) {
res.redirect('./')
})
connection.end()
})
module.exports = {
path: '/books',
handler: app,
}
问题是你的axios.post
电话。的第二个参数axios.post
是您要发送的数据,而不是选项对象。所以,你要发送的是数据与headers
属性和body
属性。(看起来您已经习惯使用fetch
。)选项是第三个参数。
如果你需要给出标题,它会是这样的:
axios.post("books/books/add", formData, {
headers: {
"Content-Type": "application/json"
},
})
// ...
...但你没有,jonrsharpe 告诉我,默认情况下axios
会字符串化对象并发送适当的标头,所以:
axios.post("books/books/add", formData)
// ...
您还应该有一个.catch
after.then
来处理错误,因为您没有从.then
.
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句