概要:AppsFlyer SDKをReact Nativeで開発されたiOS / Androidアプリに実装して、インストール、アプリ内イベント、メディアソースなどを計測しましょう。
関連記事
AppsFlyerのReact Nativeプラグインに関する全体像を把握するためには、以下の記事を参照してください。
- React Nativeプラグインの概要
- React Nativeプラグインの実装(本記事)
- React Native APIリファレンス
連携
React Nativeプラグインを実装し初期化すると、アプリのAppsFlyer管理画面に、オーガニックと非オーガニックにそれぞれ1つずつインストールが表示されます。
プラグインのインストール
これらの手順は、auto-linkingをサポートするアプリに適用されます。プラグインは、次の auto-linking を使用します。
- React Native v0.60
- react-native-appsflyer v1.4.7
アプリが auto-linking をサポートしていない場合、このインストールガイドを参照してください。
プラグインをインストールする方法:
- npmからライブラリをダウンロードします。
$ npm install react-native-appsflyer --save
- 関連するコマンドセット(AndroidまたはiOS)を実行します
$ react-native run-android
$ cd ios && pod install
$ react-native run-ios
プラグインの実装と初期化
このセクションでは、React Nativeプラグインの実装と初期化の方法について説明しています。
Devキーの取得
AppsFlyerのDev Keyはアカウント毎にユニークで、アカウントを識別するために必要です。SDKがAppsFlyerアカウントに関するデータを安全に送受信できるようにするために、Dev Keyは必須です。アカウント管理者のみがDev Keyをを取得できます。
Dev Keyを取得する方法:
- AppsFlyerの管理画面へ移動してください。
- メニューバーにて、設定の下にあるアプリ設定をクリックしてください。
- SDK初期化の下にて、表示されるDev Keyをコピーします。
プラグインの初期化
プラグインを初期化する方法:
- app.js にて、次をインポートします。
import appsFlyer from 'react-native-appsflyer';
- 次のパラメーターを使用して、initSDK メソッドを呼び出します。
パラメーター | タイプ | 説明 |
---|---|---|
options |
Object |
SDK設定です |
onSuccess |
機能 |
Returns callback object |
onError |
機能 |
Returns callback object |
オプション
名称 | タイプ | デフォルト | 説明 |
---|---|---|---|
devKey |
string |
AppsFlyerのDevキーです | |
appId |
string |
[iOSのみ] Apple Application ID | |
isDebug |
boolean |
false |
[オプション] デバッグモード |
例:プラグインを初期化します
import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';
import appsFlyer from 'react-native-appsflyer';
appsFlyer.initSdk(
{
devKey: 'K2***********99',
isDebug: false, // set to true if you want to see data in the logs
appId: '4*******4', // iOS app id
},
(result) => {
console.log(result);
},
(error) => {
console.error(error);
}
);
インストールのテスト
アプリを構築したら、プラグインをテストしてください。テストシナリオと手順については、SDKの実装とテストを参照してください。
コアAPI
アプリ内イベントと収益を記録してユーザーの質を測定し、ディープリンクでユーザーエクスペリエンスを向上させます。
このタブには、開発者向けの説明が含まれていますが、次のとおりマーケティング担当者からのインプットが不可欠です。
- マーケティング担当がユーザーの質を計測するために、どのアプリ内イベントを計測する必要があるかを決定する必要があります。
- マーケティング担当がAppsFlyer管理画面にアクセスし、ディープリンク用のOneLinkを設定する必要があります。
アプリ内イベントの計測
推奨設定記録したいイベントを定義します。
アプリ内イベントによって、アプリのアクティビティに関する洞察を得ることができます。例えば、アプリ内イベントを記録して、ROI(投資収益率)やLTV(顧客生涯価値)などのKPIを計測します。
アプリ内イベントを記録する方法はいくつかあります。この記事では、SDK経由でイベントを送信する最も一般的な方法を説明します。アプリ内イベントの概要ガイドには、アプリ内イベントを計測するその他の方法について詳細が記載されています。
アプリの特定の業界(トラベル、ゲーム、eコマースなど)に合わせて、業界別に推奨されるアプリ内イベントの一覧を参照してください。
名前とパラメーター
アプリ内イベントを計測するには、推奨されるイベント名とパラメーターのリストを使用してください。
推奨設定以下の理由により、イベント名とパラメータを使用してください。
- これらの共通となるアプリ内イベント名を使うと、AppsFlyerからFacebook、Google、TwitterやSnapchatなどに自動的にマッピングします。
- 下位互換性:AppsFlyerがイベント名やパラメータを変更した場合でも、互換性があるため実装に影響はありません。
アプリ内イベントの計測
アプリ内イベントを計測するには、logEvent
メソッドを使用します。
logEvent パラメーター
パラメーター | タイプ | 説明 |
---|---|---|
eventName |
String |
カスタムイベント名が管理画面に表示されます。 イベントリストはこちらを参照してください。 |
eventValue |
Object |
イベントの詳細 |
例
const eventName = "af_add_to_cart";
const eventName = "af_add_to_cart";
const eventValues = {
af_content_id: "id123",
};
appsFlyer.logEvent(
eventName,
eventValues,
(res) => {
console.log(res);
},
(err) => {
console.error(err);
}
);
収益の計測
af_revenue
のイベントパラメーターを使用して、アプリ内イベントの収益の値を送信してください。
af_revenue
には、正負を問わず、あらゆる数値を入力できます。-
af_revenue
は、ローデータレポートと管理画面上で実際の収益とみなされる唯一のイベントパラメーターです。詳細についてはこちらを参照してください。
通貨設定、通貨換算、管理画面上での表示の詳細も参照してください。
収益を含むイベントを送信する場合は、以下の通貨コードに関する要素を考慮してください。
- デフォルトの通貨設定:USD
- 通貨コードを3文字のISO 4217コードに従って設定します。
- コンマの値区切り、通貨記号、テキストなどは収益の値に含めないでください。
収益値の例:1234.56
例:収益を含むアプリ内イベントの計測
const eventName = "purchase";
const eventValues = {
"af_content_id": "id123",
"af_currency":"USD",
"af_revenue": "2"
};
appsFlyer.logEvent(eventName,eventValues, (error, result) => {
if (error) {
console.error(error);
} else {
//...
}
});
マイナス収益の計測
ユーザーに払い戻しをする場合など、マイナスの収益を記録する必要がある場合があります。
const eventName = "refund";
const eventValues = {
"af_content_id": "id123",
"af_currency":"USD",
"af_revenue": "-2" // The revenue value is preceded by a minus sign.
};
appsFlyer.logEvent(eventName,eventValues, (error, result) => {
if (error) {
console.error(error);
} else {
//...
}
});
アプリ内ベントに関する注意事項
- イベント名:最大45文字まで(半角)
- イベント値:最大半角1000文字。超えた場合は切り捨てられる可能性があります
- 英字以外の文字は、iOSおよびAndroidのバージョン4.81.1(アプリ内イベントと他のSDK API)からサポートされています。
- 価格と収益について:
- 5や5.2など、数値と小数点のみを使用してください。
- 5.12345など、小数点以下は5桁まで使用可能です。
アプリ内購入の検証
この機能の詳細については、アプリ内購入の検証のページを参照してください。
アプリ内購入の検証の機能は、 validateAndLogInAppPurchase
を介してReact Nativeプラグインでも利用可能です。
OneLinkによるディープリンク
ディープリンクの設定は、次の2段階で行います。
- React Nativeでコンバージョンデータを取得します。
- ディープリンクをサポートするロジックをアプリ内で設定します。
React Nativeでコンバージョンデータを取得してディープリンクする
コンバージョンデータを取得するには2つの方法があります。
- ディファードディープリンクは、コンバージョンデータに基づいて、ユーザーを特定のアクティビティとカスタマイズされたコンテンツに誘導します。
- 直接ディープリンクは、特定のアクティビティでアプリを起動し、コンバージョンデータに従ってコンテンツをカスタマイズします。
ディファードディープリンク:onInstallConversionData
コンバージョンデータを取得するには、onInstallConversionData
を実装します。コードサンプル:
this.onInstallConversionDataCanceller = appsFlyer.onInstallConversionData(
(res) => {
if (JSON.parse(res.data.is_first_launch)== true) {
if (res.data.af_status=== 'Non-organic') {
var media_source = res.data.media_source;
var campaign = res.data.campaign;
alert('This is first launch and a Non-Organic install. Media source: ' + media_source + ' Campaign: ' + campaign);
} else if (res.data.af_status=== 'Organic') {
alert('This is first launch and a Organic Install');
}
} else {
alert('This is not first launch');
}
}
);
appsFlyer.initSdk(/*...*/);
直接ディープリンク:onAppOpenAttribution
コンバージョンデータを取得するには、onAppOpenAttribution
を実装します。コードサンプル:
this.onAppOpenAttributionCanceller = appsFlyer.onAppOpenAttribution((res)=> {
console.log(res);
// implement logic to customize content
});
appsFlyer.initSdk(/*...*/);
コンバージョンデータの取得
新規インストールごとにユーザーのアトリビューションデータにアクセスします。
- リアルタイムで、SDKから直接実行されます。
- ユーザーにパーソナライズされたコンテンツを提供します。
- アプリ内の特定のアクティビティに誘導することで、エンゲージメントを向上します。ディファードディープリンク:onInstallConversionData を参照してください。
コードのサンプル:
import React, {Component} from 'react';
import {AppState, Platform, StyleSheet, Text, View, Button} from 'react-native';
import appsFlyer from 'react-native-appsflyer';
const options = {
devKey: "********",
isDebug: true,
onInstallConversionData : true
};
if (Platform.OS === 'ios') {
options.appId = "123456789";
}
this.onInstallConversionDataCanceller = appsFlyer.onInstallConversionData(
data => {
console.log("GCD");
console.log(data);
}
);
this.onAppOpenAttributionCanceller = appsFlyer.onAppOpenAttribution(
data => {
console.log("OAOA");
console.log(data);
}
);
appsFlyer.initSdk(options,(result) => {
console.log(result);
}, (error) => {
console.error(error);
}
);
type Props = {};
export default class App extends Component<Props> {
componentWillUnmount() {
// Optionaly remove listeners for deep link data if you no longer need them after componentWillUnmount
if (onInstallConversionDataCanceller) {
onInstallConversionDataCanceller();
console.log('unregister onInstallConversionDataCanceller');
onInstallConversionDataCanceller = null;
}
if (onAppOpenAttributionCanceller) {
onAppOpenAttributionCanceller();
console.log('unregister onAppOpenAttributionCanceller');
onAppOpenAttributionCanceller = null;
}
import React, {useEffect, useState} from 'react';
import {AppState, SafeAreaView, Text, View} from 'react-native';
import appsFlyer from 'react-native-appsflyer';
var onInstallConversionDataCanceller = appsFlyer.onInstallConversionData(
(res) => {
if (JSON.parse(res.data.is_first_launch)== true) {
if (res.data.af_status=== 'Non-organic') {
var media_source = res.data.media_source;
var campaign = res.data.campaign;
console.log('This is first launch and a Non-Organic install. Media source: ' + media_source + ' Campaign: ' + campaign);
} else if (res.data.af_status=== 'Organic') {
console.log('This is first launch and a Organic Install');
}
} else {
console.log('This is not first launch');
}
},
);
var onAppOpenAttributionCanceller = appsFlyer.onAppOpenAttribution((res)=> {
console.log(res);
});
appsFlyer.initSdk(
{
devKey: 'K2a*********99',
isDebug: false,
appId: '41******5',
},
(result) => {
console.log(result);
},
(error) => {
console.error(error);
},
);
const Home = (props) => {
useEffect(() => {
return () => {
// Optionaly remove listeners for deep link data if you no longer need them after componentWillUnmount
if (onInstallConversionDataCanceller) {
onInstallConversionDataCanceller();
console.log('unregister onInstallConversionDataCanceller');
onInstallConversionDataCanceller = null;
}
if (onAppOpenAttributionCanceller) {
onAppOpenAttributionCanceller();
console.log('unregister onAppOpenAttributionCanceller');
onAppOpenAttributionCanceller = null;
}
};
});
return (
{'App'}
);
};
追加API
計測
アンインストール計測
さまざまなメディアソースから来たユーザーのアンインストール率を測定します。重要なKPIに従ってキャンペーンを分析および最適化するのに役立ちます。アンインストール計測の手順を参照してください。
Androidではアンインストールを計測する方法が2つあります。
- AppsFlyerのアプリ設定ページにて、Firebaseサーバーキーを設定します。
- Firebaseデバイストークンの取得:アンインストール計測をReact Native経由で設定するには、Firebaseデバイストークンが必要です。ネイティブで計測する場合は、Firebase SDKがこのトークンを提供しますが、React Nativeの場合はそうではありません。Firebaseデバイストークンを提供するReact Native用のサードパーティライブラリを実装する必要があります。
- デバイストークンを取得したら、
updateServerUninstallToken
メソッドに渡します。
appsFlyer.updateServerUninstallToken(newFirebaseToken,(success) => //... });
iOSではアンインストールを計測する方法が2つあります。
- デバイストークンを取得します。アンインストールの計測は Appleのプッシュ通知機能が必要なため、APNSに登録するにはAppsFlyerにデバイストークンを渡す必要があります。
- デバイストークンを取得したら、
updateServerUninstallToken
メソッドに渡します。
appsFlyer.updateServerUninstallToken(deviceToken,(success) => { //... });
Sessions
カスタムのセッション間隔
React Nativeプラグインでは利用できません。こちらのディベロッパー手順を参照してください
ユーティリティ系アプリ向けバックグラウンドセッション
React Nativeプラグインでは利用できません。Androidの手順を参照してください。
オウンドメディア
プッシュ通知の計測
React Nativeプラグインでは利用できません。プッシュ通知の計測に関する詳細は、こちらを参照してください。
ユーザー招待計測
既存ユーザーが友人やコンタクトを新規ユーザーとしてアプリに招待できるようにすることで、アプリインストール数増加のきっかけとなる場合があります。
AppsFlyerを使用することで、アプリ内のユーザー招待から発生したインストールの計測を行うことが可能です。
以下の2つのステップがあります。
- OneLink IDを設定します。
- 招待リンクを生成します。
OneLink IDの設定
setAppInviteOneLinkID(oneLinkID, callback)
招待リンクの生成
appsFlyer.generateInviteLink(
{
channel: 'gmail',
campaign: 'myCampaign',
customerID: '1234',
userParams: {
myParam: 'newUser',
anotherParam: 'fromWeb',
amount: 1,
},
},
(link) => {
console.log(link);
},
(err) => {
console.log(err);
}
);
クロスプロモーションの計測
React Nativeプラグインでは利用できません。ディベロッパー向けドキュメントはこちらです。
ユーザー識別子
AppsFlyer IDの取得
AppsFlyer IDは、アプリのインストール毎に都度発行されます。AppsFlyer IDはさまざまな目的で使用できます。
- サーバー間(S2S)でイベント送信するとき
- 広告主側で持っているシステム上のユーザー情報と一致させるとき
- Pull APIとPush APIのデータをマージするときに、各データをマップしてください。
このAPIを使用してAppsFlyer IDを取得してください:
appsFlyer.getAppsFlyerUID((err,appsFlyerUID) => {
if (err) {
console.error(err);
} else {
console.log('on getAppsFlyerUID: ' + appsFlyerUID);
}
});
カスタマーユーザーIDの設定
独自の一意のカスタマーユーザーID(CUID)を設定し、一意のAppsFlyer IDと相互参照してください。
一意のCUID:
- AppsFlyerの ローデータ CSVレポート上に表示されます。
- ポストバックAPIで使用して、お客様側のユーザーIDと相互参照できます。
CUIDを設定するには、以下を使用してください:
appsFlyer.setCustomerUserId('some_user_id',(res) => {
//..
});
推奨設定設定された後に計測されたイベントにしかカスタマーユーザーIDを紐付けられないので、AppsFlyerでは、アプリ利用の一連の流れの中で、できる限り早いタイミングでカスタマーユーザーIDを設定することをお勧めしています。
trackAppLaunch
を呼び出す前に、setCustomerUserId
を呼び出してください。
- 計測されたイベントはCUIDに関連付けられます。
- 関連するデータは、インストールとアプリ内イベントのローデータレポートに表示されます。
- あとで設定した場合、CUIDはCUIDを設定したあとに計測されたイベントのみに紐づけられます。
ユーザープライバシー
オプトアウト
法律やプライバシーのコンプライアンス問題といったさまざまな事情により、オプトアウトしてすべてのSDK計測を停止する場合があります。ベストプラクティス アプリに適したシナリオを、正しい手順に沿って実装していただくことをお勧めします。
計測を停止するには:
- isStopTracking を呼び出し、true に設定してください。
stopTracking(isStopTracking, callback)
- このAPIが起動すると、AppsFlyer SDKは動作を停止し、AppsFlyerサーバーとの通信は何も発生しなくなります。
計測を再度アクティブにするには:isStopTracking を呼び出し、falseに設定してください。
データ取得からのパートナーの除外
場合によっては、アドネットワークやパートナーに対する特定ユーザーのユーザーレベルのデータ共有を停止したい場合があるかと思います。その理由としては:
- CCPAやGDPRのようなプライバシーポリシー
- ユーザーによるオプトアウト
- 一部パートナー(広告ネットワーク/第三者ツール)との競合
パートナーとのデータ共有は、setSharingFilterForPartners
メソッドで制御されます。
これらのフィルタリングメソッドは、SDK V5.4.1からサポートされています。
このフィルタリングメソッドは、SDK が初期化される毎に呼び出されなければならず、セッション全体に影響を与えます。 このフィルタを設定する必要があるかどうかを判断するのに時間がかかる場合には、 SDKの初期化を遅延 させてください。
最初のtrackAppLaunchが呼ばれるよりも前にこのメソッドがアクティブになると:
- SRN経由のユーザーはOrganicユーザーと見なされ、 そのユーザーのデータは連携パートナーとも共有されません。
- 通常のアドネットワーク (SRN以外)経由のユーザーは 、AppsFlyer上で正しく媒体へ紐付けされますが、ポストバック、API、ローデータレポート、またはその他の方法においてアドネットワークへデータは共有されません。
現在、これらのメソッドを使用してアンインストールに関するデータをフィルタリングすることはできませんが、AppsFlyerの連携設定ページ を使用して、各パートナーへのアンインストールイベントのポストバック送信は停止することができます。