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
  1. 프로젝트 폴더에 airbridge.json 파일을 생성해주세요.
  2. JSON 형식으로 설정값을 넣어주세요.

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

  1. Xcode > Project 파일 > Build Phases > Copy Bundle Resources 로 이동해주세요.
  2. + 버튼을 눌러 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 에 출력됩니다.

  1. 에어브릿지 대시보드 > Raw Data > App Real-time Logs 항목을 클릭해 주세요.
  2. 검색어 입력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
  1. Google Play Store 에 등록할 때 사용한 signing key 를 준비해주세요.
  2. 다음 명령을 실행해주세요.
keytool -list -v -keystore my-release-key.keystore
  1. 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
  1. https://developer.apple.com/account/resources 의 Identifiers 로 이동해 주세요.
  2. Tracking 하고자하는 앱의 Identifier 를 클릭해 주세요.
  3. 해당 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
  1. Xcode > Project 파일 > Info > URL Types 로 이동해주세요.
  2. identifier 와 URL Schemes 에 대시보드에서 설정한 scheme 값 을 넣어주세요.

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

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

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

AppDelegate.m

Scheme
  1. ios/[프로젝트 이름]/AppDelegate.m 파일을 열어주세요.
  2. 아래 코드를 추가해주세요.
- (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
}
  1. 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
  1. ios/[프로젝트 이름]/AppDelegate.m 파일을 열어주세요.
  2. 아래 코드를 추가해주세요.
-  (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://

  1. 딥링크를 클릭해주세요.
  2. 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 에 설정한 사용자 정보가 있는지 확인해주세요.

  1. 사용자 설정을 해주세요.
  2. SDK 를 통해 Event 를 전송해주세요.
  3. 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.signIn({
    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 가 존재하는지 확인해주세요.

  1. SDK 를 통해 Event 를 전송해주세요.
  2. 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 에서 수집할 수 있습니다.

  1. https://developers.facebook.com/docs/ios/getting-started 링크를 통해 Facebook SDK 를 설치해주세요.
  2. 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.jsontrackingAuthorizeTimeoutSecondstimeout 을 설정하면, 설치 이벤트를 전송하기 전에 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

  1. android/app/src/main/java/.../MainActivity 파일에 다음 코드를 수정해주세요.
-     AirbridgeRN.getDeeplink().fetch(getIntent())
+     AirbridgeRN.processDeeplinkData(getIntent())

iOS

  1. ios/[프로젝트 이름]/AppDelegate 파일의 다음 코드를 수정해주세요.
-     AirbridgeRN.deeplink()?.handleURLSchemeDeeplink(url, withSourceBundle: sourceApplication)
+     AirbridgeRN.deeplink()?.handleURLSchemeDeeplink(url)

설정

  1. 프로젝트 폴더에 airbridge.json 파일을 생성해주세요.

  2. 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

  1. Xcode > Project 파일 > Signing & Capabilities > Associated Domains 로 이동해주세요.
  2. + 버튼을 눌러 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 가 에러난 경우
  1. 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()
.     );
. }
  1. ios/xxx.xcodeproj 를 수정해주세요.
  2. 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;
. }