尝试从客户端向服务器发送数据时 POST http://localhost:3000/data 400（错误请求）

Question

大家好，我在将数据从客户端发送到服务器端时遇到了一些问题。 基本上我有一个功能，点击时将名为 categorySearch 的变量设置为字符串，例如 categorySearch = "pork" 并将其发送到服务器；但由于某种原因，我不断收到标题中提到的错误。这是一些代码： 客户端

function getRecipes(category){
    const categorySearch = category.alt;
    const options = {
        method: 'POST',
        headers: {
            'Content-type': 'application/json'
        },
        body: categorySearch
    }
    const response = fetch('/data', options);
    console.log(response);
}

服务器端

const express = require('express');
const app = express();
const fetch = require('node-fetch');
require('dotenv').config();
const API_KEY = process.env.API_KEY;
const port = process.env.PORT || 3000;
app.listen(port, () => console.log('listening at 3000'));
app.use(express.static('public'));
app.use(express.json({ limit: "1mb"}));

app.post('/data', (request, repsonse) => {
    console.log(request.body);
})

不知道我做错了什么，我在后端工作不多，所以也没有太多知识，非常感谢任何帮助:)

我的最终目标是能够将用户输入或在这种情况下点击的数据发送到服务器，然后在服务器端对搜索引擎进行 api 调用，获取我需要的数据，将其发送回客户端-服务器并显示在页面上。

Answer 1

原因：-

400 Bad Request Error 是一个 HTTP 响应状态码，表示由于语法无效，服务器无法处理客户端发送的请求

根据您的代码，您以 json 格式从客户端发送数据并在服务器中以纯文本形式检索该数据，因此不要将其作为 application/json 发送，而是使用 text/plain 或删除该标头部分，以便它可以正常工作，请查看下面附上代码。

客户端：-

function getRecipes(category){
const categorySearch = category.alt;
const options = {
    method: 'POST',
    headers: {
        'Content-type': 'text/plain', // or remove this headers section
    },
    bodydata: categorySearch
}
 const response = fetch('/data', options);
 console.log(response);
}

服务器端：

app.post('/data', (request, repsonse) => {
 console.log(request.body.bodydata);
})

希望这能让您对错误有所了解。在这里阅读更多关于400 error