Android 向け Flutter

Flutter など、さまざまな方法でモバイルアプリを Contact Center AI プラットフォーム（CCAI プラットフォーム）と連携させることができます。このページでは、Flutter を使用して Android アプリに Android SDK を統合する方法について説明します。

始める前に

このページの手順を行う前に、 Flutter を使用して統合するの手順を完了しておく必要があります。

Android アプリに SDK を統合する

Android アプリに SDK を統合する手順は次のとおりです。

  1. Flutter のサンプル ディレクトリにある android/build.gradle ファイルで、minSdkVersion を 21 以降に更新します。

  2. android/src/main/AndroidManifest.xml ファイルに以下を追加します。

    <application>
  <activity
    android:name="co.ujet.android.activity.UjetActivity"
    android:exported="true">
    <intent-filter>
      <action android:name="android.intent.action.VIEW"/>
      <category android:name="android.intent.category.DEFAULT"/>
      <category android:name="android.intent.category.BROWSABLE"/>
      <!-- TODO: Change to your custom URL scheme. Config from Portal > Developer Settings > Mobile App > Enable Send SMS to Download App > Android App > URL -->
      <data
        android:host="co.ujet.flutter_example_app"
        android:path="/smartchannel"
        android:scheme="ujet" />
    </intent-filter>
  </activity>

  <meta-data
        android:name="co.ujet.android.companyKey"
        android:value="@string/ujet_company_key"/>
  <meta-data
      android:name="co.ujet.android.companyName"
      android:value="@string/ujet_company_name"/>
  <meta-data
      android:name="co.ujet.android.subdomain"
      android:value="@string/ujet_subdomain"/>
  <meta-data
      android:name="co.ujet.android.companyUrl"
      android:value="@string/ujet_company_url"/>
</application>

  3. 次のコードサンプルのように、<application> タグで android:name の値を .Application に更新します。

    <!--Change the value of android:name to .Application -->
<application
  android:name=".Application"
  android:label="Demo Application"
  android:icon="@mipmap/ic_launcher">

  4. 次のコードサンプルのように、android/build.gradle を更新します。

    allprojects {
  repositories {
    google()
    mavenCentral()
    maven {
      url "https://sdk.ujet.co/android/"
    }
  }
}

  5. 次のコードサンプルのように、android/app/build.gradle を更新します。

    dependencies {
  // Use UJET SDK version 2.6.0 or latest to support recent push notification changes.
  def ujetSdkVersion = "x.y.z"
  implementation "co.ujet.android:ujet-android:$ujetSdkVersion"
  implementation "co.ujet.android:cobrowse:$ujetSdkVersion"
}

  6. 次のコードサンプルのように、res/values/strings.xml を更新します。このファイルが存在しない場合は作成します。

    <resources>
  <string name="ujet_company_key">YOUR_COMPANY_KEY</string>
  <string name="ujet_company_name">YOUR_COMPANY_NAME</string>

  <!-- If your tenant / portal url ends with "ujet.co" then set ujet_subdomain string only (ignore
      ujet_company_url), otherwise set ujet_company_url only (ignore ujet_subdomain) following below instructions. -->
  <!-- To get subdomain, extract string content between 'https://' and first '.' of your tenant/portal URL.
      Example, If your tenant url is https://XXX.YYY.ZZZ/ then subdomain will be XXX -->
  <string name="ujet_subdomain">YOUR_SUBDOMAIN</string>

  <!-- Use tenant url as company url here, it should be in format of https://XXX.YYY.ZZZ/api/v2
      (here XXX should match with your subdomain) -->
  <string name="ujet_company_url">YOUR_COMPANY_URL</string>
</resources>

  7. Firebase プロジェクトを作成します。すでにプロジェクトがある場合は、このアプリを登録します。google-service.json ファイルをダウンロードし、example/android/app/ ディレクトリのプロジェクトに配置します。

モジュールを登録する

モジュールを登録するには、MainActivity.kt を開き、次のコードサンプルのように UJETModule を初期化します。

class MainActivity : FlutterActivity() {
    override fun configureFlutterEngine(@NonNull flutterEngine: FlutterEngine) {
        super.configureFlutterEngine(flutterEngine)

        //Register and Initialize UJETModule
        UJETModule.init(flutterEngine.dartExecutor.binaryMessenger, applicationContext)
    }
}

Android プッシュ通知を設定する

プッシュ通知をネイティブに統合する場合は、次の手順を行います。Android アプリに SDK を統合するの手順に沿って、firebase ディレクトリを Android プロジェクトにコピーして貼り付けます。

Android プッシュ通知を設定する手順は次のとおりです。

  1. 次のコードサンプルのように、アプリレベルの build.gradle ファイルにプッシュ通知用の Firebase 依存関係を追加します。

    dependencies {
  implementation platform("com.google.firebase:firebase-bom:32.8.0")
  implementation 'com.google.firebase:firebase-messaging'
}

  2. 次のコードサンプルのように、AndroidManifest.xml を更新します。

    <application>
  <service
    android:name=".firebase.MyFirebaseMessagingService"
    android:exported="false">
    <intent-filter>
      <action android:name="com.google.firebase.MESSAGING_EVENT" />
    </intent-filter>
  </service>
</application>

  3. 次のコードサンプルのように、プロジェクトのルートレベルの build.gradle に google-services プラグインを追加します。

    plugins {
  id 'com.google.gms.google-services' version '4.3.8' apply false
}

  4. 次のコードサンプルのように、プロジェクトのアプリレベルの build.gradle に google-services プラグインを追加します。

    plugins {
  id "com.android.application"
  id "kotlin-android"
  id "dev.flutter.flutter-gradle-plugin"
  id 'com.google.gms.google-services'  // google-services plugin
}

  5. 次のコードサンプルのように、MyFirebaseMessagingService を実装する FirebaseMessagingService を作成します。

    class MyFirebaseMessagingService: FirebaseMessagingService() {
      private var firebaseTokenManager: FirebaseTokenManager? = null

      override fun onCreate() {
          super.onCreate()
          firebaseTokenManager = FirebaseTokenManager(this)
      }

      override fun onNewToken(token: String) {
          firebaseTokenManager?.updateToken(token)
      }

      override fun onMessageReceived(message: RemoteMessage) {
          if (Ujet.canHandlePush(message.data)) {
              Log.d("Firebase", "Handle the push message by UJET")
          } else {
              // Handle your notifications
          }
      }
  }

  6. 次のコードサンプルのように、FirebaseTokenManager を作成します。

      class FirebaseTokenManager(context: Context) {
      private val sharedPreferences = context.getSharedPreferences("${context.packageName}_preferences", Context.MODE_PRIVATE)
      private var token: String? = null

      fun getToken(): String? {
          token = sharedPreferences.getString("firebaseToken", null)
          if (token == null) {
              FirebaseMessaging.getInstance().token.addOnCompleteListener { task: Task<String?> ->
                  if (!task.isSuccessful || task.result == null) {
                      return@addOnCompleteListener
                  }
                  token = task.result
                  updateToken(token)
              }
          }
          return token
      }

      fun updateToken(token: String?) {
          sharedPreferences
              .edit()
              .putString("firebaseToken", token)
              .apply()
      }
  }