react-native-appsflyer

This React Natie Library uses the AppsFlyer 4.6.0 library for both iOS and Android

Table of content

• Supported Platforms
• Installation
• iOS
• Android
• API Methods
• initSdk
• trackEvent
• Track App Uninstalls
  • iOS
  • Android
• onInstallConversionData
• getAppsFlyerUID
• trackLocation (ios only)
• Demo

This plugin is built for

• iOS AppsFlyerSDK v4.5.9
• Android AppsFlyerSDK v4.6.0

Installation

$ npm install react-native-appsflyer --save

iOS

1. Add the appsFlyerFramework to podfile and run pod install.

use_frameworks!
target 'demo' do
  pod 'AppsFlyerFramework'
end

Don't use CocoaPods? please see their DOCS .

2. Create bridge between your application and appsFlyerFramework: In XCode ➜ project navigator, right click Libraries ➜ Add Files to [your project's name] Go to node_modules ➜ react-native-appsflyer and add RNAppsFlyer.xcodeproj Build your project, It will generate libRNAppsFlyer.a file:

   

3. Run your project (Cmd+R) or through CLI run: react-native run-ios

Android

android/app/build.gradle

1. Add the project to your dependencies

dependencies {
    ...
    compile project(':react-native-appsflyer')
}

android/settings.gradle

1. Add the project

include ':react-native-appsflyer'
project(':react-native-appsflyer').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-appsflyer/android')

Build project so you should get following dependency (see an Image):

MainApplication.java

Add:

1. import com.appsflyer.reactnative.RNAppsFlyerPackage;

2. In the getPackages() method register the module: new RNAppsFlyerPackage(MainApplication.this)

So getPackages() should look like:

 @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new RNAppsFlyerPackage(MainApplication.this),
          //.....
      );
    }

API Methods

appsFlyer.initSdk(options, callback): void

initializes the SDK.

 let options = {
       devKey:  'WdpTVAcYwmxsaQ4WeTspmh',
       appId: "975313579",
       isDebug: true
     };

    appsFlyer.initSdk(options, (error, result) => {
      if (error) {
        console.error(error);
      } else {
       //..
      }
    })

##### appsFlyer.trackEvent(eventName, eventValues, callback): void

 const eventName = "af_add_to_cart";
 const eventValues = {
      "af_content_id": "id123",
      "af_currency":"USD",
      "af_revenue": "2"
  };

 appsFlyer.trackEvent(eventName, eventValues, (error, result) => {
     if (error) {
         console.error(error);
     } else {
         //...
     }
 })
    

Track App Uninstalls

iOS

AppsFlyer enables you to track app uninstalls. To handle notifications it requires to modify your AppDelegate.m. Use didRegisterForRemoteNotificationsWithDeviceToken to register to the uninstall feature.

Example:

- (void)application:(UIApplication ​*)application didRegisterForRemoteNotificationsWithDeviceToken:(NSData *​)deviceToken {
   // notify AppsFlyerTracker
   [[AppsFlyerTracker sharedTracker] registerUninstall:deviceToken];
}

Read more about Uninstall register: Appsflyer SDK support site

Android

setGCMProjectID(GCMProjectID): void

 setGCMProjectID(){
    const  gcmProjectId = "987186475229";
    appsFlyer.setGCMProjectID(gcmProjectId,
        (gcmProjectID) => {
          //...
        },
        (error) => {
          console.error(error);
        })
  }
  

Read more about Android Uninstall Tracking: Appsflyer SDK support site

#####appsFlyer.onInstallConversionData(callback): function:unregister

Accessing AppsFlyer Attribution / Conversion Data from the SDK (Deferred Deeplinking). Read more: Android, iOS

callback structure:

• status: "success"or "failure" if SDK returned error on onInstallConversionData event handler
• type:
• "onAppOpenAttribution" - returns deep linking data (non-organic)
• "onInstallConversionDataLoaded" - called on each launch
• "onAttributionFailure"
• "onInstallConversionFailure"
• data: some metadata, for example:

{
  "status": "success",
  "type": "onInstallConversionDataLoaded",
  "data": {
    "af_status": "Organic",
    "af_message": "organic install"
  }
}

Example:

this.onInstallConversionDataCanceller = appsFlyer.onInstallConversionData(
            (data) => {
                console.log(data);               
            }
        );

The appsFlyer.onInstallConversionData returns function to unregister this event listener. Actually it calls NativeAppEventEmitter.remove()

Example:

componentWillUnmount() {
        if(this.onInstallConversionDataCanceller){
            this.onInstallConversionDataCanceller();
        }
    }

#####appsFlyer.getAppsFlyerUID(callback): void

Get AppsFlyer’s proprietary Device ID. The AppsFlyer Device ID is the main ID used by AppsFlyer in Reports and APIs.

Example:

 appsFlyer.getAppsFlyerUID((error, appsFlyerUID) => {
      if (error) {
        console.error(error);
      } else {
        console.log("on getAppsFlyerUID: " + appsFlyerUID);
      }
    })

#####appsFlyer.trackLocation(longitude, latitude, callback(error, coords): void (iOS only)

Get AppsFlyer’s proprietary Device ID. The AppsFlyer Device ID is the main ID used by AppsFlyer in Reports and APIs.

Example:

 const  latitude = -18.406655;
 const  longitude = 46.406250;
 
 appsFlyer.trackLocation(longitude, latitude, (error, coords) => {
      if (error) {
        console.error(error);
      } else {
        this.setState( { ...this.state, trackLocation: coords });
      }
    })
})

##Demo

This plugin has a demo project bundled with it. To give it a try , clone this repo and from root a.e. react-native-appsflyer execute the following:

npm run setup

• Run npm run demo.ios or npm run demo.ios will run for the appropriate platform.
• Run npm run ios-pod to run Podfile under demo project