コンテンツにスキップ

Flutter SDK

以下のガイドに沿って、FlareLane がプッシュ通知を送信するために必要な認証情報を入力します。

ターミナルでプロジェクトのルートディレクトリに移動し、以下のコマンドを実行します。

$ flutter pub add flarelane_flutter:1.9.2

ユーザーからプッシュ通知の購読をスムーズに取得するため、compileSdkVersion を 33 以上に設定してください。

// ...
android {
compileSdkVersion 33
// ...
}
// ...

対象ターゲットの Signing & Capabilities を開き、左上の + Capability をクリックして Push Notifications を選択し、追加します。

続いて Background Modes を選択し、Remote notifications を有効にします。

Push Notifications と Background Modes が有効になった Xcode の Signing & Capabilities タブ

iOS では、画像などのメディアを添付するために Notification Service Extension を作成する必要があります。

Xcode で File > New > Target を開き、Notification Service Extension を選択します。

Notification Service Extension を選択した Xcode の新規ターゲット作成ダイアログ

Product Name に適切な名前を入力します。本ガイドでは FlareLaneNotificationServiceExtension を使用します。

Product Name に FlareLaneNotificationServiceExtension を入力した Xcode の新規ターゲット設定画面

別の Scheme が有効化されないように、Cancel をクリックします。

新しい Scheme を有効化するか確認する Xcode のダイアログで Cancel が強調表示されている

次に、作成した Notification Service Extension ターゲットMinimum Deployments バージョンを、メインアプリのターゲットのバージョンに合わせて設定します。

Notification Service Extension の Minimum Deployments を設定する Xcode のターゲット設定画面

アプリと Extension の間でデータを同期するために、App Group を設定する必要があります。

対象ターゲットの Signing & Capabilities を開き、左上の + Capability をクリックして App Groups を選択し、追加します。

group.bundleID.flarelane という名前のグループを追加します**。ここで bundleID の部分は、アプリの Bundle Identifier と一致させる必要があります。**

App Groups Capability と flarelane グループを追加した Xcode の Signing & Capabilities

正常に追加できたら、その App Group を有効にします。

flarelane グループが有効になった Xcode の App Groups Capability

同様に、先ほど作成した Extension にも同じ名前の App Group を追加して有効にします。

flarelane グループが有効になった Xcode の Extension ターゲットの App Groups Capability

次に、ios ディレクトリ内の Podfile を開いて以下を追加します。

// ファイルの末尾に以下の行を追加します。
// ターゲット名には、先ほど入力した Extension の Product Name を指定してください。
target 'FlareLaneNotificationServiceExtension' do
pod 'FlareLane', '1.9.2'
end

pod install を実行して SDK のインストールを完了します。

  1. application(:didRegisterForRemoteNotificationsWithDeviceToken:) のハンドラーメソッドを追加します
import FlareLane
class AppDelegate: FlutterAppDelegate {
override func application(_ application: UIApplication, didRegisterForRemoteNotificationsWithDeviceToken deviceToken: Data) {
// 2
FlareLaneAppDelegate.shared.application(application, didRegisterForRemoteNotificationsWithDeviceToken: deviceToken)
}
}

5-5. UNUserNotificationCenterDelegate メソッドの追加

Section titled “5-5. UNUserNotificationCenterDelegate メソッドの追加”
  1. AppDelegate に UNUserNotificationCenterDelegate を割り当てます
  2. userNotificationCenter(:willPresent:withCompletionHandler:) のハンドラーメソッドを追加します
  3. ハンドラーメソッドを追加します
import FlareLane
@main
@objc class AppDelegate: FlutterAppDelegate {
override func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
// 1
UNUserNotificationCenter.current().delegate = self
}
override func userNotificationCenter(_ center: UNUserNotificationCenter, willPresent notification: UNNotification, withCompletionHandler completionHandler: @escaping (UNNotificationPresentationOptions) -> Void) {
// 2
FlareLaneNotificationCenter.shared.userNotificationCenter(center, willPresent: notification, withCompletionHandler: completionHandler)
}
override func userNotificationCenter(_ center: UNUserNotificationCenter, didReceive response: UNNotificationResponse, withCompletionHandler completionHandler: @escaping () -> Void) {
// 3
FlareLaneNotificationCenter.shared.userNotificationCenter(center, didReceive: response, withCompletionHandler: completionHandler)
}
}

5-6. UNNotificationServiceExtension メソッドの追加

Section titled “5-6. UNNotificationServiceExtension メソッドの追加”
  1. didReceive(:withContentHandler:) のハンドラーメソッドを追加します
  2. serviceExtensionTimeWillExpire() のハンドラーメソッドを追加します
import UserNotifications
import FlareLane
class NotificationService: UNNotificationServiceExtension {
override func didReceive(_ request: UNNotificationRequest, withContentHandler contentHandler: @escaping (UNNotificationContent) -> Void) {
// 1
// FlareLane から送信されたプッシュ通知に対してのみ FlareLane のメソッドが実行されるよう、ロジックを分岐させます。
if FlareLaneNotificationServiceExtensionHelper.shared.isFlareLaneNotification(request) {
FlareLaneNotificationServiceExtensionHelper.shared.didReceive(request, withContentHandler: contentHandler)
} else {
// ...
}
}
override func serviceExtensionTimeWillExpire() {
// 2
FlareLaneNotificationServiceExtensionHelper.shared.serviceExtensionTimeWillExpire()
}
}

main.dart ファイルに以下の初期化コードを追加します。プロジェクト ID はコンソールの [プロジェクト] ページで確認できます。

import 'package:flarelane_flutter/flarelane_flutter.dart';
void main() {
// 初期化コードは必ず ensureInitialized() の後で実行してください。
WidgetsFlutterBinding.ensureInitialized();
// 以下の初期化コードを追加します。
// 通知許可ダイアログを表示するタイミングを制御したい場合は、2 番目の引数を false にして、任意のタイミングで .subscribe() を呼び出してください。
FlareLane.shared.initialize("PROJECT_ID", requestPermissionOnLaunch: true);
runApp(...);
}

アプリをインストールした時点で FlareLane に作成されるデバイスは「匿名デバイス」です。別途管理している一意のユーザー IDを連携することで、FlareLane のデバイスをお客様自身のユーザー ID と紐付けることができます。

ユーザー ID の連携には多くのメリットがあります。 会員と非会員を区別できるようになるほか、いつでもユーザー ID 単位でプッシュ通知を送信できるようになるため、初回の連携時に設定しておくことをおすすめします。

一般的には、ユーザーがサインアップまたはログインに成功したタイミングで、setUserId 関数を使ってユーザー ID を連携します。

FlareLane.shared.setUserId("USER_ID");
  • FlareLane はデフォルトで、プッシュ通知がクリックされた際に https リンクやディープリンクなどの URL を自動的に処理します。 独自のクリックハンドラーを実装する必要がある場合は、URL の自動処理を無効にするをご覧ください。

アプリ内メッセージ(ポップアップ)の表示

Section titled “アプリ内メッセージ(ポップアップ)の表示”
<resources>
<!-- 通知カラーを変更します -->
<string name="flarelane_notification_accent_color">#BC0000</string>
</resources>
ガイド
モバイル SDK リファレンス
Flutter SDK リリースノート