React Native plugin

Introduction

You can also find the plugin on npm here:

https://www.npmjs.com/package/react-native-appsflyer

Set out below are the integration instructions for using AppsFlyer’s React Plugin.

This is the React Native plugin for AppsFlyer SDK.

This plugin is built for

• iOS AppsFlyerSDK v4.8.4
• Android AppsFlyerSDK v4.8.18

Installation instructions

Follow these steps for the installation instructions for the AppsFlyer plugin:

First, download the library from npm:

$ npm install react-native-appsflyer --save

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

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

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

 
 @Override
  protected List getPackages() {
   return Arrays.asList(
     new MainReactPackage(),
     new RNAppsFlyerPackage(),
     //.....
   );
  }

import appsFlyer from 'react-native-appsflyer';

appsFlyer.initSdk(options, onSuccess, onError): void

Options

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

• These in-app events help you follow user journeys, and attribute them to specific campaigns/media-sources. Please take the time define the events you want to measure to allow you to measure ROI (Return on Investment) and LTV (Lifetime Value).
• The trackEvent method allows you to send in-app events to AppsFlyer analytics. This method allows you to add events dynamically by adding them directly to the application code.

 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 {
     //...
   }
 })

Measure app uninstalls

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

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

Read more about Android Uninstall Measurement: AppsFlyer SDK support site

appsFlyer.onInstallConversionData(callback): function:unregister

Accessing AppsFlyer Attribution / Conversion Data from the SDK (Deferred Deep Linking). 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:

<preclass="language-json">{ "status": "success", "type": "onInstallConversionDataLoaded", "data": { "af_status": "Organic", "af_message": "organic install" } }

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

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

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.

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.

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-appsflyerexecute 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