Ionic-framework: Ionic CLI: missing NSLocationWhenInUseUsageDescription entry in *-Info.plist file (iOS platform)

Created on 29 Nov 2017  路  6Comments  路  Source: ionic-team/ionic-framework

Ionic version:
[ ] 2.x
[ x] 3.x
[ ] 4.x

I'm submitting a ...
[x ] bug report
[ ] feature request

Current behavior:
Ionic CLI doesn't set the NSLocationWhenInUseUsageDescription key in *-Info.plist file when adding an ios platform. This will cause malfunction of cordova-plugin-geolocation. The call of the 'getCurrentPosition()' method returns neither resolve nor reject (tested with Simulator target iPad-Air iOS 11.1 and iPad mini device iOS10.3). When passing a timeout option (for example getCurrentPosition({timeout: 15000})) the method provides a timeout error.

Expected behavior:
The call of the getCurrentPosition() method provides a response with latitude and longitude values.

Steps to reproduce:
Start new ionic project with cordova integration:

$ ionic start <project name>

Add cordova-plugin-geolocation plugin:

$ ionic cordova plugin add cordova-plugin-geolocation --variable GEOLOCATION_USAGE_DESCRIPTION="To locate you"
$ npm install --save @ionic-native/geolocation

Add ios platform:

$ ionic cordova platform add ios

The last command creates an ios/project name folder inside platform folder where the *-Info.plist file is located. Unfortunately the NSLocationWhenInUseUsageDescription key entry is missing here.

<key>NSLocationWhenInUseUsageDescription</key>
    <string>Description</string>

When manually inserting the key in to the *-Info.plist file the corodva-plugin-geolocation does function without problems.

Related code:

https://github.com/PiiSart/ionic_geolocation.git

// home.ts

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import {Geolocation} from "@ionic-native/geolocation";

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  private latitude: number = 0;
  private longitude: number = 0;
  private info: string = '';
  private error: string = '';

  constructor(public navCtrl: NavController, private gelocation: Geolocation) {
    this.info = "try to get current device position...";
    this.gelocation.getCurrentPosition().then((data) => {
      this.info = "receive position data!";
      this.latitude = data.coords.latitude;
      this.longitude = data.coords.longitude;
    }).catch((error) => {
      this.error = error.message;
    });
  }
}

Other information:

Ionic info:

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.19.0
    ionic (Ionic CLI) : 3.19.0

global packages:

    cordova (Cordova CLI) : 7.0.1 

local packages:

    @ionic/app-scripts : 3.1.2
    Cordova Platforms  : ios 4.4.0
    Ionic Framework    : ionic-angular 3.9.2

System:

    ios-deploy : 1.9.1 
    ios-sim    : 5.0.13 
    Node       : v7.8.0
    npm        : 4.2.0 
    OS         : macOS Sierra
    Xcode      : Xcode 9.1 Build version 9B55 

Environment Variables:

    ANDROID_HOME : not set

Misc:

    backend : legacy

Most helpful comment

Just to summarize, add this on your config.xml file

<edit-config target="NSLocationWhenInUseUsageDescription" file="*-Info.plist" mode="merge">
    <string>need location access to find things nearby</string>
</edit-config>

All 6 comments

can confirm this. Just run into the same issue...
ionic 3.7
ionic-native 4.4.2

I am also facing the same issue. I believe it occurs in the context of iOS 10+. What fixed it for me was adding the following lines to the config.xml:

<config-file overwrite="true" parent="NSLocationWhenInUseUsageDescription" platform="ios" target="*-Info.plist"> <string>Allow the app to know your location</string> </config-file>

There are a couple layers to be aware of here,

  1. I believe the cordova-plugin-googlemaps plugin can inject the permission to the ios build settings, but the docs say to use a different variable from what you used in the examples. (per docs at https://github.com/mapsplugin/cordova-plugin-googlemaps at the time of this comment...)
    --variable LOCATION_WHEN_IN_USE_DESCRIPTION="My custom when in use message" \
    --variable LOCATION_ALWAYS_USAGE_DESCRIPTION="My custom always usage message"
  1. what @PaulWen says should work, but it's worth looking into what the cordova support is for the config-file tag in the config.xml, as I believe it's either deprecated or will depend on use of another plugin in the future (e.g. this plugin seems to add support for config-file: https://www.npmjs.com/package/cordova-config-utils)

@PaulWen's approach is close, it's actually edit-config.

https://github.com/apache/cordova-plugin-geolocation#ios-quirks

These are updates needed for iOS 11 security. Please update your plugins and add the appropriate messages. Thanks!

Just to summarize, add this on your config.xml file

<edit-config target="NSLocationWhenInUseUsageDescription" file="*-Info.plist" mode="merge">
    <string>need location access to find things nearby</string>
</edit-config>

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Z3roCoder picture Z3roCoder  路  67Comments

pavimus picture pavimus  路  90Comments

abennouna picture abennouna  路  129Comments

zarko-tg picture zarko-tg  路  79Comments

aces-tm picture aces-tm  路  83Comments