前端发出请求时，后端API接收空请求体

Question

我正在我的本地主机上构建Web应用程序。

前端是Reactjs框架，运行在LocalHost:3000中

router.post('/register', function (req, res) {
    console.log(req.body); // {}, why it is empty?

    // create new instance, save it to database
    User.create(req.body).then(function () {
        res.send('success');
    });
});

handleSubmit = (e) => {
        e.preventDefault();
        this.props.form.validateFieldsAndScroll((err, values) => {
            if (!err) {
                console.log('Received values of form: ', values); // value is not empty, I have tested! So we did send something to the API

                const input = JSON.stringify({
                    username: values.username,
                    password: values.password,
                });

                console.log(input);
                $.ajax({
                    url: `${API_ROOT}/register`,
                    method: 'POST',
                    data: JSON.stringify({
                        username: values.username,
                        password: values.password,
                    }),
                }).then((response) => {
                    if (response === 'success') {
                        this.props.history.push('/login');
                    } else {
                        console.log('do not jump');
                    }

                });
            }
        });
    }

Answer 1

如果添加一个内容类型头，说明请求的主体是什么类型，那么它应该会像预期的那样工作。

$.ajax({
  url: `${API_ROOT}/register`,
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  data: JSON.stringify({
    username: values.username,
    password: values.password,
  })
})