SDKを導入する

前提条件

本SDKは、React Native 0.60 以上で動作することを確認しております。

なお各プラットフォーム毎に導入条件が定められております。

導入手順(共通)

パッケージをインストールする

npm または yarn を利用してパッケージをインストールしてください。

npm install --save @react-native-karte/core
yarn add @react-native-karte/core

パッケージのインストールが完了したら、対応するプラットフォーム毎の導入手順に従い設定を進めてください。

🚧

利用可能なパッケージについて

@react-native-karte/core パッケージはイベントトラッキング機能のみを提供します。
アプリ内メッセージ・プッシュ通知受信などのその他機能については、別途パッケージを導入する必要があります。
利用可能なモジュールについては、利用可能なパッケージ一覧 をご覧ください。

導入手順(iOS)

STEP1: Pod をインストール

npx pod-install ios

STEP2: SDKの初期化コードを追加する

次にアプリケーションにSDKの初期化コードを追加します。

  1. SDKのインポート宣言を追加
    UIApplicationDelegate を実装したクラスがあるファイルの先頭にインポート宣言を追加します。
@import KarteCore;
  1. SDKの初期化コードを追加
    application(_:didFinishLaunchingWithOptions:) メソッド内に初期化コードを追加します。
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
  [KRTApp setupWithAppKey:@"アプリケーションキー" configuration:KRTConfiguration.defaultConfiguration];
  ...
}

🚧

アプリケーションキーについて

初期化時に指定するアプリケーションキーは、KARTE管理画面に記載されているAPIキーとは異なります。
アプリケーションキーは営業担当よりお送りするメールに記載されておりますので、そちらをご確認ください。

STEP3: URLスキームハンドラを追加する

KARTEで独自に定義したURLスキームを処理するために、application(_:open:options:) メソッド内にハンドラを追加します。

- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options {
  return [KRTApp application:app openURL:url];
}

なお iOS13 から利用可能な UISceneDelegate を実装している場合は、scene(_:willConnectTo:options:) および scene(_:openURLContexts:) メソッド内にハンドラを追加します。

- (void)scene:(UIScene *)scene willConnectToSession:(UISceneSession *)session options:(UISceneConnectionOptions *)connectionOptions {
  UIOpenURLContext *URLContext = connectionOptions.URLContexts.anyObject;
  if (URLContext) {
    [KRTApp application:[UIApplication sharedApplication] openURL:URLContext.URL];
  }
}

- (void)scene:(UIScene *)scene openURLContexts:(NSSet<UIOpenURLContext *> *)URLContexts {
  UIOpenURLContext *URLContext = URLContexts.anyObject;
  if (URLContext) {
    [KRTApp application:[UIApplication sharedApplication] openURL:URLContext.URL];
  }
}

🚧

Objective-C から SDK を利用する

Objective-C から SDK を利用した場合、ビルド時にエラーが発生する場合があります。
エラーが発生した場合は、こちら の記事を参考にしてください。

導入手順(Android)

STEP1: SDKの初期化コードを追加する

  1. SDKのインポート宣言を追加
    android.app.Application クラスを継承したクラスがあるファイルの先頭にインポート宣言を追加します。
import io.karte.android.KarteApp
  1. SDKの初期化コードを追加
    onCreate メソッド内に初期化コードを追加します。
public class YourApplication extends Application {
  
  @Override
  public void onCreate() {
    super.onCreate();
    KarteApp.setup(this, "アプリケーションキー");
  }
}

STEP2: 暗黙的インテントを解決するための設定を追加する(オプション)

一部の機能 *1 を利用するためには、暗黙的インテントを解決するための設定を AndroidManifest.xml に追加する必要があります。

*1. 管理画面に表示したQRコードを読み込みによるSDK機能の呼び出し

<activity android:name=".XxxActivity">
  <intent-filter>
    <action android:name="android.intent.action.MAIN" />
    <category android:name="android.intent.category.LAUNCHER" />
    
    <!-- 任意のActivityに対して、以下の指定を行なってください -->
    <data android:scheme="<アプリ毎に定義したスキーム名を指定>" android:host="karte.io" /> 
  </intent-filter>
</activity>

利用可能なパッケージ一覧

KARTE React Native SDKでは機能毎にパッケージを提供しております。
利用する機能に応じて、部分的にパッケージを導入することが可能です。

なお core パッケージの導入は必須です。

Package name

Description

@react-native-karte/core

イベントトラッキング機能を提供します。

@react-native-karte/in-app-messaging

アプリ内メッセージ機能を提供します。(導入手順)

@react-native-karte/notification

プッシュ通知の受信および効果測定機能を提供します。(導入手順)

@react-native-karte/variables

設定値配信機能を提供します。(導入手順)

@react-native-karte/visual-tracking

ビジュアルトラッキング機能を提供します。(導入手順)