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

Padmesh · Accepted Answer · 2020-09-19 07:19:10Z

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".

answered Sep 19, 2020 at 7:19

Padmesh

175 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Saad Bashir Over a year ago

var_dump returns error text: "<pre class='xdebug-var-dump' dir='ltr'>↵C:\wamp\www\hakacc\voucherprocessing.php:23:string '{"action":"getvouchernumber","vouchertype":"CV","vmonth":"09","vyear":2020}' (length=75)↵</pre>" The path is already absolute in angular

Tiago Peres · Accepted Answer · 2020-09-19 10:54:21Z

1

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.

edited Sep 19, 2020 at 10:54

answered Sep 19, 2020 at 8:06

Tiago Peres

15.9k22 gold badges104 silver badges174 bronze badges

11 Comments

Saad Bashir Over a year ago

Thank you for your kind and detailed response. As shared in original post, the URL i have used is correct which is why echoing file_get_contents shows value in console. However I am unable to set these values to any variable. I also tried using json_decode like I mentioned, but that results in null. What could I be doing wrong?

Tiago Peres Over a year ago

@SaadBashir it could be the encoding of special characters as Peka mentions here.

Saad Bashir Over a year ago

Well I don't see any special characters as was the issue in that question. However, I used json_last_error() and now getting the error whose screenshot I have attached in the question

Tiago Peres Over a year ago

@SaadBashir just saw the update. This is most likely your problem.

Saad Bashir Over a year ago

thank you for the response. Please not in question the first code block contains the angular post request and in it inverted commas are used properly so unfortunately that isn’t the issue either :(

|

Collectives™ on Stack Overflow

Angular Post to PHP

2 Answers 2

1 Comment

11 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

11 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related