Implement App Tracking Transparency for Ionic 4 Angular and Cordova based iOS app

cordova
1

My app’s update has been rejected by apple because it needs app tracking transparency and i added following lines in my ios info.plist file

<key>NSUserTrackingUsageDescription</key>
<string>Your data will be used to connect external sites to allow you to log-in and track your orders using your email.</string>

I tried this plugin GitHub - chemerisuk/cordova-plugin-idfa: Cordova plugin to get Advertising ID (IDFA or AAID)

getInfo(){
    return this.platform
      .ready()
      .then(() => cordova.plugins.idfa.getInfo())
  }

But it shows error when i run the command “ionic cordova build iOS” .
The error is: can not find idfa property in cordova.plugins

Is there any official ionic cordova plugin to implement app tracking transparency? OR anyone has a custom solution for this purpose? Please help.

2

You can try calling cordova exec directly:

askTrackingPermission() {
    if (this.platform.is('cordova') && this.platform.is('ios')) {

      if (window.cordova) {
        console.log('trying to request permission ');
        window.cordova.exec(win, fail, 'idfa', "requestPermission", []);
      }
    }

    function win(res) {
      console.log('success ' + JSON.stringify(res));
    }
    function fail(res) {
      console.log('fail ' + JSON.stringify(res));
    }
  }

and get info:

readTrackingPermission() {

    if (this.platform.is('cordova') && this.platform.is('ios')) {

      if (window.cordova) {
        window.cordova.exec(win, fail, 'idfa', "getInfo", []);
      }
    }

    function win(res) {
      console.log('success  ' + JSON.stringify(res));
    }
    function fail(res) {
      console.log('fail ' + JSON.stringify(res));
    }
  }
2 Likes
3

Thanks for your reply, appreciated your help!

Added the code and called the askTrackingPermission() function from initializeApp() function in app.component.ts file located in app directory.

Also I forced calling askTrackingPermission() function using pull to refresh, it only prints
trying to request permission in console, nothing else!

4

Make sure you calling it from this.platform.ready().then(() => {}

Also, you can only test this from the iOS simulator (or device) running 14.5+ iOS. In your iOS device settings check settings->privacy->tracking it has to be allowed to ask. And your app will only be allowed to ask once.

And make sure plugin is installed:

cordova plugin add cordova-plugin-idfa
npm i cordova-plugin-idfa --save

https://rubberchickin.com/implement-app-tracking-transparency-for-ionic-angular-and-cordova-ios-app/

// add permissions to config.xml under ios platform

<platform name="ios">
    <edit-config target="NSUserTrackingUsageDescription" file="*-Info.plist" mode="merge">
        <string> My tracking usage description </string>
    </edit-config>
</platform>
5

Followed the link Implement App Tracking Transparency for Ionic Angular and Cordova iOS app - . / Rubber Chickin and it worked. I am on Ionic 4 and iOS 14.5.1

1 Like
6

I have this error when installing the puglin, any solution

cordova plugin add cordova-plugin-idfa

ERROR:

Unable to load PlatformApi from platform. Error: Cannot find module ‘/Users/Documents/Project/platforms/android 2/cordova/Api.js’
Failed to install ‘cordova-plugin-idfa’: Error [ERR_UNHANDLED_ERROR]: Unhandled error. (The platform “android 2” does not appear to be a valid cordova platform. It is missing API.js. android 2 not supported.)
at EventEmitter.emit (events.js:178:17)
at EventEmitter.module.exports.emit (/usr/local/lib/node_modules/cordova/node_modules/cordova-common/src/events.js:71:17)
at Object.getPlatformApiFunction (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/cordova/util.js:499:20)
at Object.getPlatformApi (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/platforms/platforms.js:55:25)
at handleInstall (/usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:593:29)
at /usr/local/lib/node_modules/cordova/node_modules/cordova-lib/src/plugman/install.js:357:28
at _fulfilled (/usr/local/lib/node_modules/cordova/node_modules/q/q.js:854:54)
at /usr/local/lib/node_modules/cordova/node_modules/q/q.js:883:30
at Promise.promise.promiseDispatch (/usr/local/lib/node_modules/cordova/node_modules/q/q.js:816:13)
at /usr/local/lib/node_modules/cordova/node_modules/q/q.js:570:49
Unhandled error. (The platform “android 2” does not appear to be a valid cordova platform. It is missing API.js. android 2 not supported.)

7

You could also checkout our cordova plugin we’ve created for the App Tracking Transparency framework.

8

I am looking for a solution for Ionic 5 with Capacitor 2 and Angular. Does anyone have a solution?

10

Hey Guys. I implemented this solution on iOS and it worked perfectly. How do i use it on Android?
I’m using Ionic 6 Angular and Capacitor 3. I want to use it on android too. I saw this on Github rep i dont know how to apply this using capacitor. Any help would do.

Use variable ANDROID_PLAY_ADID_VERSION to override dependency version on Android:

$ cordova plugin add cordova-plugin-idfa --variable ANDROID_PLAY_ADID_VERSION=‘16.+’