Ionic 4: HttpClient is giving me a “http error response 0 unknown error”

I am working with Ionic 4 developing and hybrid app. I am trying to consume an API URL. I am calling the API with the below code.

import { HttpHeaders, HttpErrorResponse, HttpClient  } from '@angular/common/http';

  constructor(private http: HttpClient, private androidPermissions: AndroidPermissions, private uid: Uid, private device: Device,  public platform: Platform, public formBuilder: FormBuilder, private router: Router, private nativeStorage: NativeStorage,private fb: Facebook,   private googlePlus:GooglePlus ) {


  platform.ready().then(() => {
      this.onDeviceReady();
    });


  }

    let urlSearchParams = new URLSearchParams();
urlSearchParams.append('brand', this.myManufacturer );
urlSearchParams.append('model',  this.myModel);
urlSearchParams.append('androidid', this.myUuidt);
urlSearchParams.append('serialsim', this.myUuidt);
urlSearchParams.append('imei', this.myIMEI);    

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



    this.http.post("some url", urlSearchParams.toString(),  this.httpOptions).subscribe(
        data  => {
        alert(JSON.stringify(data));
        },
        error  => {

        alert(JSON.stringify(error));

        }
    );

And I get this result:

enter image description here

I am testing in my cell phone, is android 9 model.

Any ideas why this is happening?

Hi,

Generally a CORS related problem. You should try to use HTTPS endpoint.

Nicolas

1 Like

I changed to HTTPS but still is giving me the same error

Maybe you dont have correct CORS Headers here like described here https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

Which is your backend api framework ?

i am working with AWS, the endpoint is created in amazon.


This how created the header:
	 this.httpOptions = {
    headers: new HttpHeaders(
	{
      
	  'Authorization': this.tobas64string
    })
  }

I am talking about the server’s headers, to the client one.

AWS is an hosting service, not a framework (except if you use lambda but I don’t think so)

1 Like

Sorry.

The backend framework is slim framework - 3.x version.

Have you tried this method : http://www.slimframework.com/docs/v3/cookbook/enable-cors.html

I will try.

Just one question, I am testing in postman. In the server logs received this:

190.248.174.185 - - [26/Mar/2020:20:02:03 +0000] “POST /api-pagv1/requestInstallations/?brand=motorola&model=motorla+ne&androidid=54c39e085dabab11&serialsim=54c39e085dabab11&imei=54c39e085dabab11 HTTP/1.1” 200 3736 “-” “PostmanRuntime/7.24.0”

But when I tested from my android devices (a real phone not a emulator) the server got this:

190.248.174.185 - - [26/Mar/2020:20:53:01 +0000] “OPTIONS /api-pagv1/requestInstallations/ HTTP/1.1” 200 4160 “http://localhost/home” “Mozilla/5.0 (Linux; Android 9; motorola one Build/PPKS29.68-16-21-20; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/80.0.3987.149 Mobile Safari/537.36”

Why in the cell phone the route is: http://localhost/home??

I think it’s the referrer wich is localhost as the app is bundled in a local web server launched when you input ionic serve