Post com x-www-form-urlencoded no Angular

Question

Hello, I have a POST request that is content-type: x-www-form-urlencoded.

I need to pass some parameters on my Body, this way:

I’m doing this way below to add my parameters on the request body:

  ObtendoToken(): Observable<string> {
    const headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded')

    const body = new URLSearchParams();
    body.set('grant_type', 'password');
    body.set('username', 'varejo_user');
    body.set('password', 'w6h5xgtl');

    return this.http.post(`${ApiDeSegurança}`, body, new RequestOptions({headers: headers})).map(response => response.json());
  }

But this error is returning:

error":"unsupported_grant_type

I believe it is in the creation of the body parameters. I am not able to solve, as it is my first POST request at the angle!

Thank you in advance....

---

I restarted my angular application and tried to use the same method and the error occurred again...

New method with the same error as: unsupported_grant_type

 ObtendoToken(): Observable<string> {
  const headers = new Headers();
  headers.append('Content-Type', 'application/x-www-form-urlencoded');
  const body = {grant_type: 'password', username: 'varejo_user', password: 'w6h5xgtl'}; 

  return this.http.post(`${ApiDeSegurança}`, body, new RequestOptions({headers: headers})).map(response => response.json());
}

Answer 1

It seems that Body has to be in the string type and not as an object.

In this way:

let grant_type = 'password';
let username = 'varejo_user';
let password = 'w6h5xgtl';
let body = `grant_type=${grant_type}&username=${username}&password=${password}`;

So it worked normally. I do not understand how the first time it worked.

The whole method stays that way:

ObtendoNovoToken(): Observable<string> {
  const header = new Headers();
  header.append('Content-Type', 'application/x-www-form-urlencoded');

  let grant_type = 'password';
  let username = 'varejo_user';
  let password = 'w6h5xgtl';
  let body = `grant_type=${grant_type}&username=${username}&password=${password}`;

  return this.http.post(`${ApiDeSegurança}`, body, new RequestOptions({headers: header})).map(response=> response.json())
}

Answer 2

tries to pass the body only as an object:

body = {
 grant_type : 'password' , 
 username: 'varejo_user' , 
 password: 'w6h5xgtl' 
} ; 

Staying like this:

ObtendoToken(): Observable<string> {
const body = {grant_type: 'password', username: 'varejo_user', password: 'w6h5xgtl'}
const headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');

return this.http.post(`${ApiDeSegurança}`, body, new RequestOptions({headers: headers})).map(response => response.json());
}