1

I'm trying to make an HTTP POST call in the following way:

`const headers = new Headers();
    const payload = [
  {
   ....
  },
  {
   ....
  }
];
  this.httpClient.post(url, payload).subscribe((data) => {
    console.log('Success', data);
});`

but, the above is giving me this error (screenshot attached)enter image description here

and when I checked the console, the call was never made. I think I'm missing something with the post call that is throwing an error even before the call is made. Any thoughts?

UPDATE: the api works totally fine when tested with Postman, i.e., I tried making a POST call and added a body and it works just fine.

Aiguo
  • 3,416
  • 7
  • 27
  • 52
  • Did you check if the request is hitting your back-end or not? Is cors enabled on the backing service? – AD8 Jun 18 '18 at 04:27
  • What is authHttp? Can you share more context what specific version of Angular and http module yiu are using – Sergey Rudenko Jun 18 '18 at 04:29
  • just made an update to my question. @AD8, it works fine when making a post call using postman, so I'm assuming CORS is enabled. – Aiguo Jun 18 '18 at 04:29
  • @SergeyRudenko, authHttp is an instance of HttpClient. – Aiguo Jun 18 '18 at 04:29
  • @Aiguo Postman probably doesn't care about CORS - check this out https://stackoverflow.com/a/36486188/4794396. I'd recommend setting a break-point in your back-end (if possible), and ensure your request is hitting the back-end or not. – AD8 Jun 18 '18 at 04:32
  • Ok so normally in the http call you “return this.http.post...” etc then in component you call this method and subscribe to it. See angular.io how you implement http communication in modern Angular (4.3+) – Sergey Rudenko Jun 18 '18 at 04:32
  • Also post requires 3 params, check that in the docs – Sergey Rudenko Jun 18 '18 at 04:33
  • @SergeyRudenko, that is what I'm actually doing in my code, i.e., returning an observable that is returned from http call and subscribing to it in the component. But, just for simplicity, I am subscribing to it with http call itself :) – Aiguo Jun 18 '18 at 04:34
  • What version of angular are you using. Can you try the same with httpClient (if it is angular 5) instead of authHttp. – Padmapriya Vishnuvardhan Jun 18 '18 at 04:35
  • @PadmapriyaVishnuvardhan, I'm using Angular 4.4.6. Sorry about the instance name, but I'm using httpClient only. Just updated the code snippet above. – Aiguo Jun 18 '18 at 04:37
  • I could not see any issue in your code. Just try to debug it, where it fails. Or add more console logs before calling this and see where it fails. – Padmapriya Vishnuvardhan Jun 18 '18 at 04:40

2 Answers2

0

https://angular.io/guide/http#making-a-post-request

Post requires URL + 2 additional params aside URL.

Your code needs httpOptions (or headers).

Sergey Rudenko
  • 8,809
  • 2
  • 24
  • 51
0

It turns out the problem was that I was trying to access a URL that had limited access. That is, it was an AWS load balancer URL which was not accessible directly.

Aiguo
  • 3,416
  • 7
  • 27
  • 52