POST request does not arrive properly httpClient - ionic - php

Question

I'm creating a REST API in PHP. The service login is:

<?php

include_once 'libs/Database.php';

header("Content-Type: application/json; charset=UTF-8");


Database::getPDO();
$myObj = null;
if ( Database::check($_POST['username'], $_POST['password']) ) {
    $myObj = array('message' => "Verified", 'success' => true);
} else {
    $myObj = array('message' => "Unauthorized", 'username' => $_POST['username'], 'success' => false);
}

$myJSON = json_encode($myObj);

echo $myJSON;
?>

And as you may see, I'm accessing $_POST global variable.

Postman: sending a POST request with header x-www-form-urlenconded and specifying the keys and values, the server does capture such keys.
Ionic: sending a POST request using HttpClient will not work. (The server captures null for both keys, username and password).

This is the code of the provider:

  login(user, pass, url) {
    const httpOptions = {
      headers: new HttpHeaders({
        'Content-Type':  'application/x-www-form-urlencoded'
      })
    };
    return this.http.post(url, "username="+user+"&"+"password="+pass, httpOptions);
  }

I'm wondering how the body should be formatted, and according to this link should be like I have done (username=user&password=pass). By the way, all parameters are not null when the login function is called, hence, the problem is in the request.

For those of you interested, the answer of the server is:

{message: "Unauthorized", username: null, success: false}

Any help will be appreciated.

Assuming you're using Angular's HttpClient, try to specify which type you're sending via POST: try to do something as `this.http.post(url, 'string', opts);`. I also suggest you to take a look at what you're sending as request via Chrome's Inspector (F12 on windows/linux, Cmd+Options+I on Mac), tab network. Obviously you must open it before sending request to be captured by DevTools. If you're debugging directly through the phone, on Windows/Linux you can use tab Remote Devices, on Mac you can use Safari — Matteo Meil, Mar 10 '19 at 15:38
I'm using `httpClient`. The weird thing is that by setting this `"username="+user+"&password="+pass` as the `body`, the server does capture `username` but not `password`. With respect to the network tab in the chrome dev tools, I can just see the responses but not the queries. Thanks — Tomás Denis Reyes Sánchez, Mar 10 '19 at 15:46

score 0 · Answer 1 · edited Mar 10 '19 at 16:19

I'm copying my comment as an answer 'cause I want to post a photo.

Assuming you're using Angular's HttpClient, try to specify which type you're sending via POST: try to do something as this.http.post<string>(url, 'string', opts);.

I also suggest you to take a look at what you're sending as request via Chrome's Inspector (F12 on windows/linux, Cmd+Options+I on Mac), Network tab.

Obviously you must open it before sending request to be captured by DevTools. If you're debugging directly through the phone, on Windows/Linux you can use Remote Devices tab on Chrome's DevTools, or Safari on Mac.

An example using Chrome's DevTools:

POST request does not arrive properly httpClient - ionic - php

1 Answers1