Question

我是表达和结点的新手，我想在我的服务器上发布axios帖子，但是当我在node.console.login中登录时，req.body变成空的。有人知道我在做什么错吗？我正在控制台记录日志并发送给邮递员。

这是server.js

const app = require('express')()
const bodyParser = require('body-parser');



app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: true }))

app.get('/', (req, res) => {

  res.send('hello')
})

const port = 4444;

app.post('/send', (req, res) => {
      console.log('body: ', req.body)
      res.status(200).send(req.body)
});



app.listen(port, () => {
  console.log('We are live on port 4444');
});

我的axios电话

export default class Form extends Component {
     constructor(props) {
         super(props) 
         this.state = {
            name: 'kaleb',
            message: '',
            email: '',
            number: '',
            sent: false
         }




     }

     handleChange = (e) => {
        this.setState({
            [e.target.name]: e.target.value
        })

     }

     handleSubmit = () => {
         axios.post("/send", {name: this.state.name}).then(() => {
             console.log(this.state.name)
         })


     }

Answer 1

尝试一下在server.js中：

    app.use(bodyParser.json());
    app.use(bodyParser.json({type: 'application/*+json'}));
    app.use(bodyParser.urlencoded({extended: false}));//or true whatever you need

axios呼叫：

    axios({method:'post',url:'/send',data:{name:this.state.name}})
      .then(console.log(this.state.name));

Answer 2

尝试在您的axios调用中将网址作为http://localhost:4444/send：

 handleSubmit = () => {
         axios.post("http://localhost:4444/send", {name: this.state.name}).then(() => {
             console.log(this.state.name)
         })

Answer 3

好的，这是我在阅读完以上所有评论后的想法。

您说过，当您通过邮递员发送请求时，它是console.log一个空的req.body。因此，您的网址没有问题。它正在纠正路由器。邮递员有3种内容类型。只需选择“ X-www-form-urlencoded”并再次发送请求即可。应该可以。
在您的组件中，您说提交后没有任何反应。问题很可能出在您的网址上。您的后端服务器运行在PORT 4444上，通常反应应用运行在PORT 3000上。因此，当您调用axios.post（'/ send'）时，它实际上已发送到localhost:3000/server而不是localhost:4444/server。现在它将无法正常工作。您需要设置一个代理来避免此问题。这是https://facebook.github.io/create-react-app/docs/proxying-api-requests-in-development的方式。或者，您可以只使用axios.post('http://localhost:4444/server')

注意：如果使用axios.post('http://localhost:4444/server')，则将面临cors问题。使用它来消除该问题https://www.npmjs.com/package/cors

Answer 4

这通常是由于将urlencoded扩展名设置为true引起的，请尝试以下操作：

app.use(bodyParser.urlencoded({ extended: false }))

req.body为空，我不知道为什么

4 个答案: