Laurent Mouchart
Laurent Mouchart

Reputation: 216

Typescript Rest API POST call with JSON parameter

I'm trying to find a code example to send a POST request to a REST Api with a JSON as parameter and get the response and any exceptions / error codes in Typescript.

Upvotes: 2

Views: 18660

Answers (4)

Rohit Rai
Rohit Rai

Reputation: 31

//Final working code. You should maintain service for api call and call it from Component.ts

public post(a : string, data: string): Observable<any>{

    const options = new RequestOptions({
      headers: this.getAuthorizedHeaders(),
      responseType: ResponseContentType.Json,
      withCredentials: false
    });

    return this.http.post(this.BASE_URL, JSON.stringify({ var: a, data: data}), options)
      .map(this.handleData)
      .catch(this.handleError);
}

Upvotes: 2

Mohamed Badr
Mohamed Badr

Reputation: 2642

You could start with something like that

Service

export class MyService{
  constructor(
    private httpClient: HttpClient) {
  }

   getSomethingFromServer():Observable<any>{
       return this.httpClient.get('you_request_url');
   }
}

Component

constructor(
    private myService: MyService) {
  }

  this.myService.getSomethingFromServer().subscribe(response => {
     // do whatever you want with the response
  }, error => {
     // handle error here
     // error.status to get the error code
  });

Upvotes: 4

motss
motss

Reputation: 668

Is a library will do the trick? Worth taking a look at node-fetch, fetch-as, make-fetch-happen, and what not.

Upvotes: 1

NitinSingh
NitinSingh

Reputation: 2068

First set the headers as follows, the "userIdAuthToken" should be the token returned from security service

this.httpOptions = {
  headers: new HttpHeaders({
    'Content-Type': 'application/json',
    'Authorization': 'Bearer ' + this.userIdAuthToken
  })
};

Then make your request,

private _http: HttpClient      // goes in constructor

let saveRequest = this._http.post<Project>(
  this.apiUrl + '/project' + '/post',
  JSON.stringify(data),
  this.httpOptions);

saveRequest will be an observable so you need to subscribe to it in your component

Upvotes: 3

Related Questions