ReactJS POST Parameters Not Sent

Question

I'm simply trying to get POST parameters on my PHP server, sent from my ReactJS app. In the server response, I can see that 'myParameter' is null. I think this is because of the Cross Origin issue, but I've tried many suggestions from answers to similar questions and nothing I've tried has worked. I believe that I'm looking for the proper code to add to my PHP file. It's been days now of this issue and I'm hoping someone here can help.

Background information (in case it matters at all). My PHP file is on my server hosted with hostgator. GET requests with URL parameters work perfectly, but POST parameters seem to be blocked. I'm trying to send more data than the URL option allows.

Thank you so much!

ReactJS Code:

axios.post('https://mywebsite.com/endpoint.php', {
  myParameter: 'test',
})
.then(function (response) {
  console.log(response);
})
.catch(function (error) {
  console.log(error);
});

PHP Code:

<?php

header("Access-Control-Allow-Origin: *");

echo json_encode($_POST['myParameter']);

?>

I also tried this, but it did not change the result:

<?php

header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST, OPTIONS');
header('Access-Control-Allow-Headers: Content-Type');
header('Access-Control-Max-Age: 86400');

echo json_encode($_POST['myParameter']);

?>

EDIT:

Based on the answer from the post linked by Aaqib, I was able to successfully get the data on my server!

Try sending the post request in something like [Postman](https://www.getpostman.com/) and see if you get the same results. — Brett Merrifield, Dec 04 '17 at 19:17
I have answered it here , hope it helps https://stackoverflow.com/questions/47630163/axios-post-request-to-send-form-data/47630754#47630754 — Aaqib, Dec 04 '17 at 19:28

score 1 · Answer 1 · answered Dec 05 '17 at 05:21

i usually prefer the axios constructor with properties. its much more clearer then the short hand methods.

axios({
  method:'POST',
  url:'https://mywebsite.com/endpoint.php',
  headers:{},
  data:{
    myParameter: 'test'
  }

}).then((res)=>{})
.catch((err)=>{});

Ishtiaque05 · Answer 2 · 2017-12-05T05:53:40.077

0

Try this and see if it works.

 axios.post('https://mywebsite.com/endpoint.php', {data: {
     myParameter: 'test'
    }
})
.then(function (response) {
  console.log(response);
})
.catch(function (error) {
  console.log(error);
});

edited Dec 05 '17 at 05:53

answered Dec 04 '17 at 19:18

Ishtiaque05

431
3
10

Thanks, but it was still null! – Patrick1234 Dec 04 '17 at 19:37
can you provide the screenshot of the post request from chrome dev network panel? – Ishtiaque05 Dec 05 '17 at 05:51

ReactJS POST Parameters Not Sent

2 Answers2