Angular Post to PHP

Question

I am trying to post data from Angular to PHP.

Angular Post Request

var body = { "action":"getvouchernumber","vouchertype": vtype, "vmonth": vmonth, "vyear":vyear };
return this.http.post(this.BaseURI+'voucherprocessing.php',body);

Output As Shown In Network Tab of Developer Mode

Headers on PHP Page

header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");
header("Access-Control-Allow-Methods: POST");
header("Access-Control-Max-Age: 3600");
header("Access-Control-Allow-Headers: Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");

Getting Data in PHP

$data = file_get_contents("php://input");

Output

But when I try to get any value of the object and set it to a variable, it doesn't work.

$action = $data->action

I also tried doing

json_decode(file_get_contents("php://input"));

but that returns an error too.

In response to @Tiago's post, I added json_decode($data, true) and tried to get value by $data->action which resulted in following

The value is correct in text field but it is being shown as an error.

And if I don't add second parameter to json_decode, it returns still null. The PHP version is 5.6.31

Answer 1

try dumping data variable in php by var_dump($data) and see you are able to receive data in php correctly or not,by viewing the response in console.
Check if you are able to encode formData correctly on angular and use this._http.post("voucherprocessing.php",formDataVariable); to submit form.
Also it may happen relative route for your file may not be working as angular has its own way of setting routes,use absolute route instead like "http://localhost/path/to/your/php/file".

Answer 2

Due to security reasons (everyone has access to the Angular code), Angular doesn't communicate directly with a Database. Instead, it uses HTTP Requests and HTTP Responses to a Server / API (REST, GraphQL) that can be built using PHP (like in your case) but could be using, for instance, NodeJS. Then, this API can interact with the Database (could be doing something different too, like simply uploading files).

When it comes to HTTP Requests to REST API it's important to note that we will need to know the URL (API Endpoint), the HTTP Verb we want to use (in this case POST) and can also possible to send Header ({"Content-Type": "application/json") and a Body (to send some piece of information - note that this won't be possible using the HTTP Verb GET).

In this particular case, you've used the HttpClientModule's post() method to send the data to the server. Will assume you have the right URL given as the first parameter and can also see the body in the second parameter.

So, now the problem can only happen in the PHP side. In order to get the data POSTed from Angular and associate it to a variable, use

$postdata = file_get_contents("php://input");

As this data comes in JSON format and JSON data is not recognized by PHP, you need to then extract it / convert it into an array

$request = json_decode($postdata, TRUE);

So now it should be straightforward PHP Arrays. Of course you can then had conditions / validations throughout the way to ensure these variables ($postdata and $request) always hold data or else give a specific error.

As in your comment to this answer you mention that $request is returning null, there's a question already addressing it from where you can read more about it.