React Native SDK

SDK 설치

패키지 설치

npm

npm 을 이용하여 Airbridge 의 react-native SDK 를 설치해주세요.

npm install --save airbridge-react-native-sdk

react-native link or cocoapods

아래와 같은 명령어를 실행해주세요.

cd ios
pod install

react-native link airbridge-react-native-sdk

import

프로젝트의 index.js 에 아래와 같은 코드를 통해 SDK 객체를 획득 해주세요.

import Airbridge from 'airbridge-react-native-sdk';

프로젝트 설정

Android

MainApplication.java

android/app/src/main/java/.../MainApplication.java 파일의 onCreate 함수에 아래와 같은 코드를 추가해주세요.

import co.ab180.airbridge.reactnative.AirbridgeRN;

//...

@Override
public void onCreate() {
    super.onCreate();
    AirbridgeRN.init(this, "YOUR_APP_NAME", "YOUR_APP_TOKEN");
    ...
}

'YOUR_APP_NAME' 은 대시보드의 'App Setting > 앱 기본정보' 에서 확인할 수 있습니다.
'YOUR_APP_TOKEN' 은 대시보드의 'App Setting > 토큰 관리' 에서 확인할 수 있습니다.

iOS

AppDelegate.m

ios/[프로젝트 이름]/AppDelegate.m 파일의 import 부분에 아래와 같은 코드를 추가해주세요.

#import <AirbridgeRN/AirbridgeRN.h>

ios/[프로젝트 이름]/AppDelegate.m 파일의 application:didFinishLaunchingWithOptions: 함수에 아래와 같은 코드를 추가해주세요.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    [AirbridgeRN getInstance:@"YOUR_APP_TOKEN" appName:@"YOUR_APP_NAME" withLaunchOptions:launchOptions];
    ...
}

'YOUR_APP_NAME' 은 대시보드의 'App Setting > 앱 기본정보' 에서 확인할 수 있습니다.
'YOUR_APP_TOKEN' 은 대시보드의 'App Setting > 토큰 관리' 에서 확인할 수 있습니다.

설정

airbridge.json

프로젝트 폴더에 airbridge.json 파일을 생성해주세요.
JSON 형식으로 설정값을 넣어주세요.

React Native 0.59.X 이하 버전을 사용하는 경우, 아래 설정도 필요합니다.

Xcode > Project 파일 > Build Phases > Copy Bundle Resources 로 이동해주세요.

+ 버튼을 눌러 airbridge.json 파일을 추가해주세요.

Exmaple

{
    "sessionTimeoutSeconds": 300,
    "autoStartTrackingEnabled": true,
    "userInfoHashEnabled": true,
    "trackAirbridgeLinkOnly": false,
    "facebookDeferredAppLinkEnabled": false,
    "locationCollectionEnabled": false,
    "trackingAuthorizeTimeoutSeconds": 0
}

설명

이름	타입	기본값	설명
sessionTimeoutSeconds	number	300	설정한 세션기간 내에 유저가 앱을 재실행하는 경우에는, 같은 세션으로 판단하여 앱 실행 이벤트를 전송하지 않습니다.
autoStartTrackingEnabled	boolean	true	false 로 설정하면, Airbridge.state.startTracking() 을 호출하기 전까지 이벤트를 전송하지 않습니다.
userInfoHashEnabled	boolean	true	false 로 설정하면, User Email 및 User Phone 정보를 Hash 하지않고 이벤트를 전송합니다.
trackAirbridgeLinkOnly	boolean	false	true 로 설정하면, Airbridge 딥링크로 앱이 열린 경우에만 딥링크 이벤트를 전송합니다.
facebookDeferredAppLinkEnabled	boolean	false	true 로 설정하고 Facebook SDK 가 설치되어 있으면, Facebook Deferred AppLink 를 수집합니다.
locationCollectionEnabled	boolean	false	true 로 설정하면, 해당 기기의 위치 정보를 수집합니다. (Android 전용) 사용하기 위해서는 AndroidManifest.xml 에 아래 2개 권한이 필요합니다. android.permission.ACCESS_FINE_LOCATION android.permission.ACCESS_COARSE_LOCATION
trackingAuthorizeTimeoutSeconds	number	0	timeout 을 설정하면, 설치 이벤트를 전송하기 전에 timeout 만큼 `추적 허용 선택창` 이 선택될 때 까지 기다립니다. (iOS 전용)

SDK 설치 확인

앱을 설치하고 실행 했을때 Install 이벤트가 전송되는지 확인해주세요.

대시보드로 확인

SDK 에서 발생한 Event 들은 에어브릿지 대시보드 > Raw Data > App Real-time Logs 에 출력됩니다.

에어브릿지 대시보드 > Raw Data > App Real-time Logs 항목을 클릭해 주세요.
검색어 입력 에 iOS IDFA 또는 Android GAID 를 입력해 주세요.

로그 노출은 최대 5분 가량 지연될 수 있습니다.

딥링크 설정

대시보드 설정

Android

에어브릿지 대시보드 > Tracking Link > Deep Link 에 아래 2가지 정보가 필요합니다.

Android URI Scheme
Android sha256_cert_fingerprints

Android URI Scheme

사용하기 원하는 scheme 를 Android URL scheme 영역에 "://" 을 붙여 입력해주세요.

예) scheme://

Android sha256_cert_fingerprints

Google Play Store 에 등록할 때 사용한 signing key 를 준비해주세요.
다음 명령을 실행해주세요.

keytool -list -v -keystore my-release-key.keystore

Certificate fingerprints 의 SHA256 란을 복사해 Android sha256_cert_fingerprints 영역에 입력해주세요.

예) 14:6D:E9:83:C5:73:06:50:D8:EE:B9:95:2F:34:FC:64:16:A0:83:42:E6:1D:BE:A8:8A:04:96:B2:3F:CF:44:E5

iOS

에어브릿지 대시보드 > Tracking Link > Deep Link 에 아래 2가지 정보가 필요합니다.

iOS URI Scheme
iOS App ID

iOS URI Scheme

사용하기 원하는 scheme 을 에어브릿지 대시보드의 iOS URI Scheme 영역에 :// 을 붙여 입력해주세요.

예) example://

iOS App ID

https://developer.apple.com/account/resources 의 Identifiers 로 이동해 주세요.
Tracking 하고자하는 앱의 Identifier 를 클릭해 주세요.
해당 Identifier 의 App ID Prefix + . + Bundle ID 를 에어브릿지 대시보드의 iOS App ID 영역에 입력해 주세요.

예) 9JA89QQLNQ.com.apple.wwdc

프로젝트 설정

Javascript

setDeeplinkListener

딥링크 또는 지연된 딥링크 가 발생할 때 마다 호출되는 함수를 등록합니다.

Airbridge.deeplink.setDeeplinkListener((deeplink) => {
    // `딥링크` 또는 `지연된 딥링크` 가 발생했을 때, 작동할 코드
    // deeplink = YOUR_SCHEME://...

    console.log(deeplink);
});

App 을 여는 모든 Deeplink 들은 Deeplink Callback 에 전달됩니다.
Deeplink 들 중, Airbridge 를 통한 Deeplink 는 Airbridge 대시보드의 iOS URI Scheme 에 입력한 YOUR_SCHEME://... 형태로 전달됩니다.

Android

AndroidManifest.xml

android/app/src/main/AndroidManifest.xml 파일의 MainActivity 영역에 아래와 같은 android:launchMode, intent-filter 문장을 삽입해주세요.

<activity android:name=".MainActivity"
    android:launchMode="singleTask"
    ...>
    <intent-filter android:autoVerify="true">
        <action android:name="android.intent.action.VIEW" />

        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />

        <data android:scheme="http" android:host="YOUR_APP_NAME.deeplink.page" />
        <data android:scheme="https" android:host="YOUR_APP_NAME.deeplink.page" />
    </intent-filter>
    <intent-filter android:autoVerify="true">
        <action android:name="android.intent.action.VIEW" />

        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />

        <data android:scheme="http" android:host="YOUR_APP_NAME.airbridge.io" />
        <data android:scheme="https" android:host="YOUR_APP_NAME.airbridge.io" />
    </intent-filter>
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />

        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />

        <data android:scheme="YOUR_SCHEME" />
    </intent-filter>
    ...
<activity/>

YOUR_APP_NAME 에 앱 이름을 입력해주세요.
YOUR_SCHEME 부분에 대시보드에서 설정한 scheme 값을 입력해주세요.

MainActivity.java

android/app/src/main/java/.../MainActivity.java 파일에 다음 코드를 삽입해주세요.

@Override
protected void onResume() {
    super.onResume();

    AirbridgeRN.processDeeplinkData(getIntent());
}

@Override
public void onNewIntent(Intent intent) {
    super.onNewIntent(intent);
    setIntent(intent);
}

iOS

Scheme

Xcode > Project 파일 > Info > URL Types 로 이동해주세요.
identifier 와 URL Schemes 에 대시보드에서 설정한 scheme 값 을 넣어주세요.

:// 값을 없애고 넣어주세요.

Universal Link

Xcode > Project 파일 > Signing & Capabilities > Associated Domains 로 이동해주세요.
+ 버튼을 눌러 applinks:YOUR_APP_NAME.airbridge.io 를 추가해주세요.
+ 버튼을 눌러 applinks:YOUR_APP_NAME.deeplink.page 를 추가해주세요.

YOUR_APP_NAME 은 대시보드의 'App Setting > 앱 기본정보' 에서 확인할 수 있습니다.

AppDelegate.m

Scheme

ios/[프로젝트 이름]/AppDelegate.m 파일을 열어주세요.
아래 코드를 추가해주세요.

- (BOOL)application:(UIApplication *)application
            openURL:(NSURL *)url
            options:(NSDictionary<UIApplicationOpenURLOptionsKey, id>*)options
{
    NSLog(@"openURL : %@", url);

    [AirbridgeRN.deeplink handleURLSchemeDeeplink:url];

    return YES;
}

func application(_ app: UIApplication,
                 open url: URL,
                 options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool
{
    NSLog(@"openURL : %@", url)

    AirbridgeRN.deeplink()?.handleURLSchemeDeeplink(url)
    
    return true
}

iOS 8.x 또는 그 이전 버전을 target 한다면 아래와 같은 코드를 추가로 적어주세요.

- (BOOL)application:(UIApplication*)application
            openURL:(NSURL*)url
  sourceApplication:(NSString*)sourceApplication 
         annotation:(id)annotation
{
    NSLog(@"openURL : %@", url);

    [AirbridgeRN.deeplink handleURLSchemeDeeplink:url];

    return YES;
}

func application(_ application: UIApplication,
                 open url: URL,
                 sourceApplication: String?,
                 annotation: Any) -> Bool
{
    NSLog(@"openURL : %@", url)

    AirbridgeRN.deeplink()?.handleURLSchemeDeeplink(url);
    
    return true;
}

Universal Link

ios/[프로젝트 이름]/AppDelegate.m 파일을 열어주세요.
아래 코드를 추가해주세요.

-  (BOOL)application:(UIApplication*)application
continueUserActivity:(NSUserActivity*)userActivity
  restorationHandler:(void (^)(NSArray* _Nullable))restorationHandler
{
    NSLog(@"continueUserActivity : %@", userActivity.webpageURL);

    [AirbridgeRN.deeplink handleUniversalLink:userActivity.webpageURL];

    return YES;
}

func application(_ application: UIApplication,
                 continue userActivity: NSUserActivity,
                 restorationHandler: @escaping ([UIUserActivityRestoring]?) -> Void) -> Bool
{
    if let webpageURL = userActivity.webpageURL {
        NSLog("continueUserActivity : %@", webpageURL)
      
        AirbridgeRN.deeplink()?.handleUniversalLink(webpageURL)
    }
    
    return true
}

딥링크 설정 확인

Airbridge 대시보드의 iOS URI Scheme 에 입력한 YOUR_SCHEME://... 형태의 딥링크를 클릭하였을 때, 앱이 열리고 Deeplink 이벤트가 전송되는지 확인해주세요.

예) example://

딥링크를 클릭해주세요.
Airbridge 대시보드 > Raw Data > App Real-time Logs 에서 Deeplink 이벤트가 존재하는지 확인해주세요.

사용자 설정

사용자 식별자 설정

SDK 에 사용자 식별자 정보를 전달하여 이후 수집되는 모든 이벤트에 입력되도록 할 수 있습니다.

이름	설명	제한
id	사용자 ID
email	사용자 Email	자동으로 SHA256 으로 Hash 됨 (옵션으로 해제가능)
phone	사용자 전화번호	자동으로 SHA256 으로 Hash 됨 (옵션으로 해제가능)
attributes	사용자 속성	최대 100개 입니다. key 는 NSString 타입이며, 최대 128자 입니다. key 는 ^[a-z_][a-z0-9_]*$ 정규식을 만족해야 합니다. value 는 NSString 또는 NSNumber 타입입니다. value 는 NSString 타입일 경우 최대 1024자 입니다.
alias	사용자의 또 다른 ID	최대 10개 입니다. key 는 NSString 타입이며, 최대 128자 입니다. key 는 ^[a-z_][a-z0-9_]*$ 정규식을 만족해야 합니다. value 는 NSString 타입이며, 최대 1024자 입니다.

코드 예시

Airbridge.state.setUser({
    ID: 'test1',
    email: '[email protected]',
});
Airbridge.state.setUser({
    email: '[email protected]',
    phone: '222-2222-2222',
});
Airbridge.state.updateUser({
    ID: 'test3',
});

위 코드는 다음과 같이 작동합니다.

User = { ID: 'test1', email: '[email protected]' }
=> User = { email: '[email protected]', phone: '222-2222-2222' }
=> User = { ID: 'test3', email: '[email protected]', phone: '222-2222-2222' }

사용자 설정 확인

사용자 설정을 완료한 후, SDK 를 통해 Event 를 전송하고, 해당 Event 에 설정한 사용자 정보가 있는지 확인해주세요.

사용자 설정을 해주세요.
SDK 를 통해 Event 를 전송해주세요.
Airbridge 대시보드 > Raw Data > App Real-time Logs 에서 전송한 Event 를 클릭하여 JSON 속 user 부분에 설정한 사용자 정보가 있는지 확인해주세요.

이벤트 설정

사용자의 중요한 행동들이 발생할 때, 인앱 이벤트를 전송해 유입 경로별 성과를 측정할 수 있습니다.

모든 이벤트의 파라미터는 선택적으로 추가할 수 있습니다.
그러나 이벤트에 대한 많은 정보는 정확한 통계 제공에 도움이 됨으로 추가하는 것을 권장합니다.

커스텀 이벤트 전송

SDK 를 통해 커스텀 이벤트를 전송할 수 있습니다.

Airbridge.event.custom('Custom', {
    action: 'Action custom',
    label: 'Label custom',
    value: 9999,
    attributes: {
        custom: 'value custom',
    },
    semantics: {
        transactionID: 'test transactionID',
    },
});

사용자 이벤트 전송

SDK 를 통해 사용자 관련 이벤트를 전송할 수 있습니다.

사용자 이벤트에서도 action, label, value, attributes 사용이 가능합니다.

회원가입

회원가입 이벤트 전송시, 사용자 식별자가 입력된 정보로 설정됩니다.

Airbridge.event.signUp({
    ID: 'test',
    email: '[email protected]',
    phone: '000-0000-0000',
});

로그아웃

로그아웃 이벤트 전송시, 사용자 식별자가 초기화됩니다.

Airbridge.event.signOut();

이커머스 이벤트 전송

SDK 를 통해 이커머스 관련 이벤트를 전송할 수 있습니다.

이커머스 이벤트에서도 action, label, value, attributes 사용이 가능합니다.

홈 화면 조회

Airbridge.event.viewHome();

상품 상세 조회

Airbridge.event.viewProductDetail({
    products: [
        {
            ID: '1',
            name: 'product A',
            price: 1000000,
            currency: 'KRW',
            position: 1,
            quantity: 1,
        },
    ],
});

상품 리스트 조회

Airbridge.event.viewProductList({
    listID: 'ID-1234567890',
    products: [
        {
            ID: '1',
            name: 'product A',
            price: 1000000,
            currency: 'KRW',
            position: 1,
            quantity: 1,
        },
        {
            ID: '2',
            name: 'product B',
            price: 1000000,
            currency: 'KRW',
            position: 2,
            quantity: 1,
        },
    ]
});

검색결과 조회

Airbridge.event.viewSearchResult({
    query: 'product A',
    products: [
        {
            ID: '1',
            name: 'product A',
            price: 1000000,
            currency: 'KRW',
            position: 1,
            quantity: 1,
        },
        {
            ID: '2',
            name: 'product B',
            price: 1000000,
            currency: 'KRW',
            position: 2,
            quantity: 1,
        },
    ],
});

장바구니 담기

Airbridge.event.addToCart({
    cartID: 'ID-1234567890',
    products: [
        {
            ID: '1',
            name: 'product A',
            price: 1000000,
            currency: 'KRW',
            position: 1,
            quantity: 1,
        },
        {
            ID: '2',
            name: 'product B',
            price: 1000000,
            currency: 'KRW',
            position: 2,
            quantity: 1,
        },
    ],
    currency: 'KRW',
    total: 50000,
});

결제

Airbridge.event.purchase({
    transactionID: 'transactionID-purchase',
    products: [
        {
            ID: '1',
            name: 'product A',
            price: 1000000,
            currency: 'KRW',
            position: 1,
            quantity: 1,
        },
        {
            ID: '2',
            name: 'product B',
            price: 1000000,
            currency: 'KRW',
            position: 2,
            quantity: 1,
        },
    ],
    isInAppPurchase: true,
    currency: 'KRW',
    total: 50000,
});

이벤트 전송 확인

SDK 를 통해 Event 를 전송하고, 에어브릿지 대시보드에 해당 Event 가 존재하는지 확인해주세요.

SDK 를 통해 Event 를 전송해주세요.
Airbridge 대시보드 > Raw Data > App Real-time Logs 에서 전송한 Event 가 존재하는지 확인해주세요.

고급 설정

세션 타임아웃 설정

airbridge.json 의 sessionTimeoutSeconds 값으로 세션 타임아웃을 설정할 수 있습니다.

세션 타임아웃은 millisecond 단위이며, 0 이상 604800000 (7일) 이하 인 값이어야 합니다.
세션 타임아웃의 기본값은 1000 60 5 (5분) 입니다.

사용자 정보 해시화 설정

유저의 정보 중 email, phone 정보는 자동으로 SHA256 으로 Hash 되어 전송합니다.
airbridge.json 의 userInfoHashEnabled 값으로 설정을 변경하실 수 있습니다.

페이스북 디퍼드 앱링크 설정

아래 설정을 통해 Facebook 의 Deferred App Link 를 SDK 에서 수집할 수 있습니다.

https://developers.facebook.com/docs/ios/getting-started 링크를 통해 Facebook SDK 를 설치해주세요.
airbridge.json 의 facebookDeferredAppLinkEnabled 값을 true 로 변경해 주세요.

facebookDeferredAppLinkEnabled 값이 YES 이고, Facebook SDK 가 설치되어 있을 때, SDK 가 Facebook Deferred App Link 를 수집합니다.

Airbridge 링크만 추적 설정

SDK 는 딥링크로 앱이 열렸을 때, 언제나 딥링크 이벤트를 전송합니다.

airbridge.json 의 trackAirbridgeLinkOnly 값이 true 로 변경되면, Airbridge 를 통한 딥링크 로 앱이 열린 경우에만 딥링크 이벤트를 전송할 수 있습니다.

Opt-out 설정

airbridge.json 의 autoStartTrackingEnabled 값이 false 로 변경되면, SDK 는 Airbridge.state.startTracking 함수가 호출 될 때 까지 이벤트를 전송하지 않습니다.

Tracking Authorize Timeout 설정 (iOS 전용)

AppTrackingTransparency.framework 를 사용해 추적 허용 선택창 을 표시하는 경우, 추적 허용 을 선택하더라도 선택하기 이전에 설치 이벤트가 전송되기 때문에 설치 이벤트에서 IDFA 수집이 불가능합니다.

airbridge.json 의 trackingAuthorizeTimeoutSeconds 에 timeout 을 설정하면, 설치 이벤트를 전송하기 전에 timeout 만큼 추적 허용 선택창 이 선택될 때 까지 기다립니다.

트래킹링크 실행 및 추적

아래와 같은 코드를 사용해서 App 에서 딥링크 동작을 수행하고, 그 동작을 추적할 수 있습니다.

Airbridge.placement.click('https://abr.ge/~~~', 'ablog://main', 'https://airbridge.io');
Airbridge.placement.impression('https://abr.ge/~~~');

click

click 함수는 해당 트래킹링크 의 click 통계를 1개 추가하고 설정된 App, Web 또는 Fallback 으로 이동합니다.

해당 트래킹링크 가 클릭되었을 때, 호출해 주세요.

click 함수에서 deeplink, fallback 은 인터넷 연결이 없을 때 사용하는 백업 링크 입니다.
deeplink 파라미터는 Custom URL Scheme 형식의 딥링크만 사용가능 합니다.
(모두 optional 파라미터 입니다.)

impression

impression 함수는 해당 트래킹링크 의 impression 통계를 1개 추가합니다.
해당 트래킹링크 가 UI 에 표시되었을 때, 호출해 주세요.

커스텀 도메인 을 사용하는 중 이라면, 커스텀 Short ID 를 사용한 트래킹링크 는 사용할 수 없습니다.
example: http://deeplink.ab180.co/custom -> 사용불가
example: http://deeplink.ab180.co/a3b1c2 -> 사용가능
example: https://abr.ge/a3b1c2 -> 사용가능

Braze 연동

SDK to SDK 방식을 사용하여 Braze 에 Airbridge 의 attribution 정보를 전송합니다.

iOS

ios/[프로젝트 이름]/AppDelegate.m 를 수정해주세요.

#import <AirBridge/AirBridge.h>
...

@interface AppDelegate () <ABTrackingDelegate>

@end

@implementation AppDelegate

...

- (void)airbridgeUserAttributed:(ABAttribution *)attribution {
    /* convert airbridge-attribution to braze-attribution */
    ABKAttributionData *abkAttributionData = [[ABKAttributionData alloc] initWithNetwork:attribution.source
                                                                                campaign:attribution.campaign
                                                                                 adGroup:attribution.adgroup
                                                                                creative:attribution.adcreative];


    /* add attribution-data to user */
    [[[Appboy sharedInstance] user] setAttributionData:abkAttributionData];

    [[[Appboy sharedInstance] user] setCustomAttributeWithKey:@"airbridge_medium"
                                               andStringValue:attribution.medium];
    [[[Appboy sharedInstance] user] setCustomAttributeWithKey:@"airbridge_ad_content"
                                               andStringValue:attribution.adcontent];
    [[[Appboy sharedInstance] user] setCustomAttributeWithKey:@"airbridge_search_keyword"
                                               andStringValue:attribution.searchKeyword];


    /* send event to Braze */
    [[Appboy sharedInstance] flushDataAndProcessRequestQueue];
}

...

@end

Android

android/app/src/main/java/.../MainApplication.java 를 수정해주세요.

import io.airbridge.AirBridge;
...

@Override
public void onCreate() {
    super.onCreate();

    ...
    /* Braze init */
    registerActivityLifecycleCallbacks(new AppboyLifecycleCallbackListener(...));
    ...

    /* Airbridge-ReactNative-SDK init */
    AirbridgeRN.init(this, "YOUR_APP_NAME", "YOUR_APP_TOKEN");


    /* Braze integration with Airbridge-Android-SDK */
    AirBridge.turnOnIntegration(new AppBoyIntegrator());
}

Airbridge-Braze 연동 관련 코드는 Braze init 아래에 작성되어야 합니다.

업데이트

이전 버전에서 SDK 를 업데이트 하시는 경우, 아래를 확인해주세요.

1.1.X => 1.2.X

npm

package.json 의 Airbridge React Native SDK 버전을 교체해주세요.

...
    "airbridge-react-native-sdk": "1.2.1",
...

다음 명령어를 실행해주세요.

npm install
cd ios
pod install

npm install
react-native link airbridge-react-native-sdk

Android

android/app/src/main/java/.../MainActivity 파일에 다음 코드를 수정해주세요.

-     AirbridgeRN.getDeeplink().fetch(getIntent())
+     AirbridgeRN.processDeeplinkData(getIntent())

iOS

ios/[프로젝트 이름]/AppDelegate 파일의 다음 코드를 수정해주세요.

-     AirbridgeRN.deeplink()?.handleURLSchemeDeeplink(url, withSourceBundle: sourceApplication)
+     AirbridgeRN.deeplink()?.handleURLSchemeDeeplink(url)

설정

프로젝트 폴더에 airbridge.json 파일을 생성해주세요.
JSON 형식으로 설정값을 넣어주세요.

Exmaple

{
    "sessionTimeoutSeconds": 300,
    "autoStartTrackingEnabled": true,
    "userInfoHashEnabled": true,
    "trackAirbridgeLinkOnly": false,
    "facebookDeferredAppLinkEnabled": false,
    "locationCollectionEnabled": false
}

설명

이름	타입	기본값	설명
sessionTimeoutSeconds	number	300	설정한 세션기간 내에 유저가 앱을 재실행하는 경우에는, 같은 세션으로 판단하여 앱 실행 이벤트를 전송하지 않습니다.
autoStartTrackingEnabled	boolean	true	false 로 설정하면, Airbridge.state.startTracking() 을 호출하기 전까지 이벤트를 전송하지 않습니다.
userInfoHashEnabled	boolean	true	false 로 설정하면, User Email 및 User Phone 정보를 Hash 하지않고 이벤트를 전송합니다.
trackAirbridgeLinkOnly	boolean	false	true 로 설정하면, Airbridge 딥링크로 앱이 열린 경우에만 딥링크 이벤트를 전송합니다.
facebookDeferredAppLinkEnabled	boolean	false	true 로 설정하고 Facebook SDK 가 설치되어 있으면, Facebook Deferred AppLink 를 수집합니다.
locationCollectionEnabled	boolean	false	true 로 설정하면, 해당 기기의 위치 정보를 수집합니다. (Android 전용) 사용하기 위해서는 AndroidManifest.xml 에 아래 2개 권한이 필요합니다. android.permission.ACCESS_FINE_LOCATION android.permission.ACCESS_COARSE_LOCATION

1.0.X => 1.1.X

Install

구버전 SDK 를 uninstall 해주세요.

npm uninstall react-native-airbridge-bridge

신버전 SDK 를 install 해주세요.

npm install --save airbridge-react-native-sdk

아래와 같은 명령어를 실행해주세요.

cd ios
pod install

react-native link airbridge-react-native-sdk

Javascript

DeeplinkListener

getInitialDeeplink 함수를 제거하고 setDeeplinkListener 함수만 사용해주세요.

- Airbridge.deeplink.getInitialDeeplink().then((deeplink) => {
-
- });
. 
. Airbridge.deeplink.setDeeplinkListner((deeplink) => {
. 
. });

Android

AndroidManifest.xml

android/app/src/main/AndroidManifest.xml 파일의 MainActivity 영역에 아래와 같은 intent-filter 문장을 삽입해주세요.

+ <intent-filter android:autoVerify="true">
+     <action android:name="android.intent.action.VIEW" />
+
+     <category android:name="android.intent.category.DEFAULT" />
+     <category android:name="android.intent.category.BROWSABLE" />
+
+     <data android:scheme="http" android:host="YOUR_APP_NAME.deeplink.page" />
+     <data android:scheme="https" android:host="YOUR_APP_NAME.deeplink.page" />
+ </intent-filter>
. <intent-filter android:autoVerify="true">
.     <action android:name="android.intent.action.VIEW" />
. 
.     <category android:name="android.intent.category.DEFAULT" />
.     <category android:name="android.intent.category.BROWSABLE" />
. 
.     <data android:scheme="http" android:host="YOUR_APP_NAME.airbridge.io" />
.     <data android:scheme="https" android:host="YOUR_APP_NAME.airbridge.io" />
. </intent-filter>
. <intent-filter>
.     <action android:name="android.intent.action.VIEW" />
. 
.     <category android:name="android.intent.category.DEFAULT" />
.     <category android:name="android.intent.category.BROWSABLE" />
. 
.     <data android:scheme="EXAMPLE_SCHEME" />
. </intent-filter>

MainActivity.java

android/app/src/main/java/.../MainActivity.java 을 수정해주세요.

. import co.ab180.airbridge.reactnative.AirbridgeRN;
. 
. public class MainActivity extends ReactActivity {
+     @Override
+     protected void onResume() {
+         super.onResume();
+ 
+         AirbridgeRN.getDeeplink().fetch(getIntent());
+     }
+  
.     @Override
.     public void onNewIntent(Intent intent) {
.         super.onNewIntent(intent);
.         setIntent(intent);
.     }
. }

iOS

Xcode

Universal Link

Xcode > Project 파일 > Signing & Capabilities > Associated Domains 로 이동해주세요.
+ 버튼을 눌러 applinks:YOUR_APP_NAME.deeplink.page 를 추가해주세요.

YOUR_APP_NAME 은 대시보드의 'App Setting > 앱 기본정보' 에서 확인할 수 있습니다.

AppDelegate.m

ios/.../AppDelegate.m 을 수정해주세요.

. - (BOOL)application:(UIApplication *)application
.             openURL:(NSURL *)url
.             options:(NSDictionary<UIApplicationOpenURLOptionsKey, id>*)options
. {
-     [AirbridgeRN.instance handleURLSchemeDeeplink:url
-                                withSourceBundle:options[UIApplicationOpenURLOptionsSourceApplicationKey]];
+     [AirbridgeRN.deeplink handleURLSchemeDeeplink:url
+                                withSourceBundle:options[UIApplicationOpenURLOptionsSourceApplicationKey]];
. 
.     return YES;
. }
. 
. - (BOOL)application:(UIApplication*)application
.             openURL:(NSURL*)url
.   sourceApplication:(NSString*)sourceApplication 
.          annotation:(id)annotation
. {
-     [AirbridgeRN.instance handleURLSchemeDeeplink:url
-                                withSourceBundle:sourceApplication];
+     [AirbridgeRN.deeplink handleURLSchemeDeeplink:url
+                                withSourceBundle:sourceApplication];
. 
.     return YES;
. }

iOS 8.x 또는 그 이전 버전을 target 한다면 아래와 같은 코드를 추가로 수정해주세요.

. -  (BOOL)application:(UIApplication*)application
. continueUserActivity:(NSUserActivity*)userActivity
.   restorationHandler:(void (^)(NSArray* _Nullable))restorationHandler
. {
-     [AirbridgeRN.instance handleUniversalDeeplink:userActivity.webpageURL];
+     [AirbridgeRN.deeplink handleUniversalLink:userActivity.webpageURL];
. 
.     return YES;
. }

0.2.X => 1.0.X

1. terminal

구버전 SDK 를 unlink 해주세요.

react-native unlink react-native-airbridge-bridge

`react-native unlink react-native-airbridge-bridge` 가 에러난 경우

android/app/src/main/java/.../MainApplication.java 를 수정해주세요.

- import com.reactlibrary.AirbridgeBridgePackage;

. @Override
. protected List<ReactPackage> getPackages() {
.     return Arrays.<ReactPackage>asList(
+         new MainReactPackage()
-         new MainReactPackage(),
-         new AirbridgeBridgePackage()
.     );
. }

ios/xxx.xcodeproj 를 수정해주세요.
Libraries 안의 AirbridgeBridge.xcodeproj 를 삭제해주세요.

구버전 SDK 를 uninstall 해주세요.

npm uninstall react-native-airbridge-bridge

신버전 SDK 를 install 해주세요.

npm install --save airbridge-react-native-sdk

신버전 SDK 를 link 해주세요.

react-native link airbridge-react-native-sdk

2. index.js

index.js 에서 require 를 import 로 바꿔주세요.

- const Airbridge = require('react-native-airbridge-bridge');
+ import Airbridge from 'airbridge-react-native-sdk';

3. Build.gradle

android/app/build.gradle 를 수정해주세요.

. dependencies {
.     ...
-     implementation 'io.airbridge:sdk-android:1.5.+'
-     implementation 'com.android.installreferrer:installreferrer:1.0'
.     ...
. }

4. AndroidManifest.xml

android/app/src/main/AndroidManifest.xml 를 수정해주세요.

permission

-     <uses-permission android:name="android.permission.INTERNET" />
-     <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />

MainActivity

.     <activity android:name=".MainActivity"
          ...
+         android:launchMode="singleTask">

5. MainApplication.java

android/app/src/main/java/.../MainApplication.java 을 수정해주세요.

- import io.airbridge.*;

. @Override
. public void onCreate() {
.     super.onCreate();
-     AirBridge.init(this, "[앱 이름]", "[앱 토큰]");
+     AirbridgeRN.init(this, "[앱 이름]", "[앱 토큰]");
.     ...
. }

6. MainActivity.java

android/app/src/main/java/.../MainActivity.java 을 수정해주세요.

+ import co.ab180.airbridge.reactnative.AirbridgeRN;

+ public class MainActivity extends ReactActivity {
+   @Override
+   public void onNewIntent(Intent intent) {
+       super.onNewIntent(intent);
+       setIntent(intent);
+   }

7. Podfile

ios/Podfile 을 수정해주세요.

target '[프로젝트 이름]' do
-   pod 'AirBridge', '1.6.2'
end

아래 명령어를 terminal 에서 실행해주세요.

pod install

8. AppDelegate.m

ios/.../AppDelegate.m 을 수정해주세요.

- #import <AirBridge/AirBridge.h>
+ #import <AirbridgeRN/AirbridgeRN.h>

.           - (BOOL)application:(UIApplication *)application 
. didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 
. {
-     [AirBridge getInstance:@"YOUR_APP_TOKEN(앱 토큰)" appName:@"YOUR_APP_NAME(앱 이름)" withLaunchOptions:launchOptions];
+     [AirbridgeRN getInstance:@"YOUR_APP_TOKEN(앱 토큰)" appName:@"YOUR_APP_NAME(앱 이름)" withLaunchOptions:launchOptions];
.     ...
. }

. - (BOOL)application:(UIApplication *)application
.             openURL:(NSURL *)url
.             options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
. {
-     [[AirBridge instance] handleURL:url];
+     [AirbridgeRN.instance handleURLSchemeDeeplink:url withSourceBundle:options[UIApplicationOpenURLOptionsSourceApplicationKey]];.
.
.     return YES;
. }

. - (BOOL)application:(UIApplication *)application 
.             openURL:(NSURL *)url
.   sourceApplication:(NSString *)sourceApplication 
.          annotation:(id)annotation
. {
-     [[AirBridge instance] handleURL:url];
+     [AirbridgeRN.instance handleURLSchemeDeeplink:url withSourceBundle:options[UIApplicationOpenURLOptionsSourceApplicationKey]];
. 
.     return YES;
. }

iOS 8.x 또는 그 이전 버전을 target 한다면 아래와 같은 코드를 추가로 수정해주세요.

.   - (BOOL)application:(UIApplication *)application 
.  continueUserActivity:(NSUserActivity *)userActivity
.    restorationHandler:(void (^)(NSArray * _Nullable))restorationHandler
. {
-     [[AirBridge instance] handleURL:url];
+     [AirbridgeRN.instance handleUniversalDeeplink:userActivity.webpageURL];
. 
.     return YES;
. }

SDK 설치

패키지 설치

npm

react-native link or cocoapods

import

프로젝트 설정

Android

MainApplication.java

iOS

AppDelegate.m

설정

airbridge.json

Exmaple

설명

SDK 설치 확인

대시보드로 확인

딥링크 설정

대시보드 설정

Android

Android URI Scheme

Android sha256_cert_fingerprints

iOS

iOS URI Scheme

iOS App ID

프로젝트 설정

Javascript

setDeeplinkListener

Android

AndroidManifest.xml

MainActivity.java

iOS

Scheme

Universal Link

AppDelegate.m

Scheme

Universal Link

딥링크 설정 확인

사용자 설정

사용자 식별자 설정

코드 예시

사용자 설정 확인

이벤트 설정

커스텀 이벤트 전송

사용자 이벤트 전송

회원가입

로그인

로그아웃

이커머스 이벤트 전송

홈 화면 조회

상품 상세 조회

상품 리스트 조회

검색결과 조회

장바구니 담기

결제

이벤트 전송 확인

고급 설정

세션 타임아웃 설정

사용자 정보 해시화 설정

페이스북 디퍼드 앱링크 설정

Airbridge 링크만 추적 설정

Opt-out 설정

Tracking Authorize Timeout 설정 (iOS 전용)

트래킹링크 실행 및 추적

click

impression

Braze 연동

iOS

Android

업데이트

1.1.X => 1.2.X

npm

Android

iOS

설정

Exmaple

설명

1.0.X => 1.1.X

Install

Javascript

DeeplinkListener

`react-native unlink react-native-airbridge-bridge` 가 에러난 경우