admin管理员组

文章数量:1297030

I'm creating a simple ReactJs and I created a Searchbar ponent that does a post request when the user types something into the searchbar. This is the function that does the call:

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

and it is being called in the onChange function like this:

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

and this is what I do in my server.js file:

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

// axios.get('/?apikey='+ 
// process.env.OMDB_API_KEY + '&s=' +)
})

I expected the console.log in the backend to show me the request parameters so that I can later do my api call to the external api and return the results, but the console.log show an empty object.

I'm quite new to this but shouldn't I do a post request for something like this? I also tried the same with a get request but it also didn't work.

I'm creating a simple ReactJs and I created a Searchbar ponent that does a post request when the user types something into the searchbar. This is the function that does the call:

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

and it is being called in the onChange function like this:

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

and this is what I do in my server.js file:

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

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

I expected the console.log in the backend to show me the request parameters so that I can later do my api call to the external api and return the results, but the console.log show an empty object.

I'm quite new to this but shouldn't I do a post request for something like this? I also tried the same with a get request but it also didn't work.

Share asked Dec 12, 2018 at 9:33 captaincaptain 1,8377 gold badges23 silver badges35 bronze badges
Add a ment  | 

2 Answers 2

Reset to default 6

Your problem is caused by naming confusion between axios and express. params property in axios is sent as search parameters in the url.

In express url search parameters are available through query property, not params. So, try this:

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

params property on an express request object refers to named route parameters, as in /users/:userId/edit.

More on that in express docs: https://expressjs./en/guide/routing.html#route-parameters

Update

Also, in order for the axios.post method to work properly, you need to change your call a little bit. It expects the post data a second argument. Since you're not sending any data in the body, you can provide an empty object:

const searchApi = searchTerm => 

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

Without it, your config object is wrongfully treated as post data.

Try your axios function like this, set the params property as an object:

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

And on the server you need to use req.query:

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

You should be able to get the param as req.query.searchTerm

本文标签: javascriptAxios post request parameters to backend are undefinedStack Overflow