Javascript 到后端的Axios post请求参数未定义

我正在创建一个简单的ReactJs，并创建了一个Searchbar组件，当用户在Searchbar中键入内容时，它会执行post请求。这是执行调用的函数：

const searchApi = searchTerm => 
axios.post('http://localhost:3000/findMovie', {
headers: {
  'Content-Type': 'application/json',
  'Access-Control-Allow-Origin': '*'
},
params: searchTerm
});

它在onChange函数中被调用，如下所示：

handleInput = async (ev) => {
const value = ev.target.value;
const resultsBody = await searchApi(ev.target.value);

这就是我在我的

server.js

文件中所做的：

app.post('/findMovie', (req, res) => {
console.log('request:', req.params);

// axios.get('http://www.omdbapi.com/?apikey='+ 
// process.env.OMDB_API_KEY + '&s=' +)
})

我希望后端的

console.log

向我显示请求参数，以便我以后可以调用外部api并返回结果，但是

console.log

显示一个空对象

---

我对这个很陌生，但我不应该为类似的东西做一个post请求吗？我也尝试了同样的get请求，但也没有成功。

您的问题是由于axios和express之间的命名混淆造成的params属性作为url中的搜索参数发送

在express url中，可通过

query

属性而不是

params

获取搜索参数。那么，试试这个：

app.post('/findMovie', (req, res) => {
  console.log('request:', req.query);
})

express request对象上的

params

属性引用命名路由参数，如

/users/：userId/edit

中所示

有关express docs的更多信息：

更新

另外，为了使

axios.post

方法正常工作，您需要稍微更改一下调用。它希望post数据具有第二个参数。由于正文中没有发送任何数据，因此可以提供空对象：

const searchApi = searchTerm => 

    axios.post('http://localhost:3000/findMovie', {} /* <-- this guy */, {
    headers: {
      'Content-Type': 'application/json',
      'Access-Control-Allow-Origin': '*'
    },
    params: searchTerm
  });

const searchApi=searchTerm=>
轴心柱http://localhost:3000/findMovie“，{}/*您的问题是由axios和express之间的命名混淆引起的。axios中的
params
属性作为url中的搜索参数发送

在express url搜索中，可通过
查询
属性而不是
参数
获得搜索参数。因此，请尝试以下操作：

app.post('/findMovie', (req, res) => {
  console.log('request:', req.query);
})

express request对象上的
params
属性引用命名路由参数，如
/users/：userId/edit
中所示

有关express docs的更多信息：

更新

另外，为了使
axios.post
方法正常工作，您需要稍微更改一下调用。它希望post数据成为第二个参数。由于您没有在正文中发送任何数据，因此可以提供一个空对象：

const searchApi = searchTerm => 

    axios.post('http://localhost:3000/findMovie', {} /* <-- this guy */, {
    headers: {
      'Content-Type': 'application/json',
      'Access-Control-Allow-Origin': '*'
    },
    params: searchTerm
  });

const searchApi=searchTerm=>
轴心柱http://localhost:3000/findMovie“，{}/*像这样尝试axios函数，将
params
属性设置为对象：

const searchApi = searchTerm => 
    axios.post('http://localhost:3000/findMovie', {
    headers: {
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*'
    },
    params: { searchTerm }
});

在服务器上，您需要使用
req.query
：

app.post('/findMovie', (req, res) => {
    console.log('request:', req.query);
})

您应该能够以
req.query.searchTerm
的形式获取参数。请像这样尝试axios函数，将
params
属性设置为对象：

const searchApi = searchTerm => 
    axios.post('http://localhost:3000/findMovie', {
    headers: {
        'Content-Type': 'application/json',
        'Access-Control-Allow-Origin': '*'
    },
    params: { searchTerm }
});

在服务器上，您需要使用
req.query
：

app.post('/findMovie', (req, res) => {
    console.log('request:', req.query);
})

您应该能够以
req.query.searchTerm
的形式获取参数，很好，现在我在console.log中获取了所需的值，但我必须将两者都更改为get请求。get请求是我所需要的还是必须是post请求，因为我有这样的印象：无论何时向后端发送数据，它都必须是post请求您可以发送POST或GET（或任何其他方法，如PUT、DELETE等）对于后端，这取决于它是如何完成的，例如，这里您有
app.post
，因此它只适用于post，但可以随意使用您需要的任何方法。查找REST API上的文档，其中每个操作都对应于一个方法。我会在向服务器发送数据时坚持使用post。您仍然可以使用
axios.post
和小改动。问题是post方法希望data object作为第二个参数，config作为第三个参数。在您的示例中，您将config作为第二个参数传递，因此它将其视为数据。添加一个空对象作为第二个参数，您应该会做得很好。好的，我会研究它。它似乎可以工作。谢谢@GlebKostNice，现在我得到了我想要在console.log中，但我必须将两者都更改为get请求。get请求是我需要的还是必须是post请求，因为我的印象是，无论何时向后端发送数据，它都必须是post请求。您可以发送post或get（或任何其他方法，如PUT、DELETE等）对于后端，这取决于它是如何完成的，例如，这里您有
app.post
，因此它只适用于post，但可以随意使用您需要的任何方法。查找REST API上的文档，其中每个操作都对应于一个方法。我会在向服务器发送数据时坚持使用post。您仍然可以使用
axios.post
和小改动。问题是post方法希望data object作为第二个参数，config作为第三个参数。在您的示例中，您将config作为第二个参数传递，因此它将其作为数据处理。添加一个空对象作为第二个参数，您应该会做得很好。好的，我会研究它。它似乎可以工作。谢谢@glebkost我想它对Postr不起作用equest，当我将其更改为get请求时，我正在获取数据。我猜它不适用于post请求，当我将其更改为get请求时，我正在获取数据。