Cordova – ionic ios app cannot access internet

cordovaionic-framework

When I run my ionic application in the emulator:

ionic emulate ios –target="iPhone-6"

I have no issue accessing the internet. However when I try running the app from XCode after calling

ionic build ios
cordova prepare

The app cannot access the internet.

I have added the cordova-plugin-whitelist plugin to my app, as well as adding

<allow-navigation href="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />

to my config.xml

and

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *">

to my index.html

The code:

import { Headers, Http, Response } from '@angular/http';
...
public login(url: string, params: any): Observable<any> {
    return this.post(url, params) //I have logged the URL and it's fine!
        .map((response: any) => {
            ...
        })
        .catch((error) => {
            console.log("Error: " + JSON.stringify(error)); 
        });
}

The error output is as follows:

{
    "_body": {
        "isTrusted": true
    },
    "status": 0,
    "ok": false,
    "statusText": "",
    "headers": {},
    "type": 3,
    "url": null
}

I have looked at the following:

  1. Get error message from Angular 2 http
  2. https://forum.ionicframework.com/t/ionic-run-android-works-but-apk-does-not-access-internet/3867
  3. https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-whitelist/

EDIT
I have seen that there is still an open issue on the ionic-cli github page that relates to this.

EDIT 2

Cordova CLI: 6.2.0
Ionic Framework Version: 2.0.0-rc.1
Ionic CLI Version: 2.1.8
Ionic App Lib Version: 2.1.4
Ionic App Scripts Version: 0.0.30
ios-deploy version: 1.9.0
ios-sim version: 5.0.11
OS: macOS Sierra Node Version: v6.7.0
Xcode version: Xcode 8.1 Build version 8B62

Best Answer

Have you taken care of App Transport Security?

Since iOS9, Apple requires you to either allow specific domains in your info.plist or explicitly allow all external loads (which isn't recommended by Apple, but would be the easiest testcase to see if the problem is caused by ATS).

More about App Transport Security: https://ste.vn/2015/06/10/configuring-app-transport-security-ios-9-osx-10-11/ In your info.plist

Basically you have to specify the following in your info.plist (again: the general allowance of external loads is not recommended though, you can find detailed information on how you can specify domains by following the link above :) ):

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
  <dict>
    <!-- other stuff -->

    <key>NSAppTransportSecurity</key>
    <dict>
      <key>NSAllowsArbitraryLoads</key>
      <true/>
    </dict>

    <!-- other stuff -->
  </dict>
</plist>
Related Topic