Angular 4 httpd post call fails in iOS

Issue

I am having a weird problem in a POST call in iOS using Nativescript and Angular 4. I have tested the same code in Android and works perfect. The server does not register any error but the call fails. This is the code I am using right now:

...
import { Http, Headers, Response, RequestOptions } from "@angular/http";
...

let headers = new Headers();
headers.append("Content-Type", "application/x-www-form-urlencoded");
let options = new RequestOptions({ headers: headers });
let body = 
    "Username=" + this.username 
    +"&Password=" + this.password;
this.http.post("http://myserver.com/api/login", body, options)
    .map(result => result.json())
    .subscribe(
        result => {
            this.loader.hide();
            if (result.Authenticated) {
                // Do something...
            }
            else {
                Dialogs.alert({title: 'Error', message: "Username and/or password are incorrect.", okButtonText: "Close"});
            }
        }, 
        error => {
            Dialogs.alert({title: 'Error', message: "There was an error trying to send the request, please try again later.", okButtonText: "Close"});
        }
    )

The app shows me There was an error trying to send the request, please try again later. message, but there is no error in the server and the curious thing is that Android works fine.

I have enabled the enableProdMode() in Angular and no luck.

Any help please?

Thanks!

Solution

We were having crashing and hanging issues on Nativescript iOS + http connections until yesterday. We switched to https connections for our servers’ API and everything is working perfectly now.

Maybe it has something to do with the secure / non secure connections on iOS?

Try switching to a secure connection and see what happens.

If you can’t do that, try adding this to your info.plist file to allow http connections:

<key>NSAppTransportSecurity</key>
<dict>
  <!--Include to allow all connections (DANGER)-->
  <key>NSAllowsArbitraryLoads</key>
      <true/>
</dict>

Answered By – Gabito Esmiapodo

Answer Checked By – Timothy Miller (AngularFixing Admin)

Leave a Reply

Your email address will not be published.