时间戳

首页 > 解决方案 > 尝试将数据从客户端发送到服务器时 POST http://localhost:3000/data 400（错误请求）

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

问题描述

嘿伙计们，所以我在将数据从客户端发送到服务器端时遇到了一些问题。基本上我有一个功能，点击时将名为 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 调用，获取我需要的数据，发送它返回客户端-服务器并将其显示在页面上。

标签： javascriptnode.jsserverbackend

解决方案

原因：-

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 错误的更多信息

推荐阅读