Mengirim dan menerima notifikasi untuk aplikasi Flutter menggunakan Firebase Cloud Messaging

1. Pengantar

Terakhir diperbarui: 04-04-2022

Codelab ini memandu Anda dalam proses pengembangan aplikasi multi-platform dengan Firebase Cloud Messaging (FCM) menggunakan Flutter. Anda akan menulis satu bagian implementasi aplikasi, lalu membangun dan menjalankannya dengan lancar di tiga platform: Android, iOS, dan web. Anda juga akan mempelajari cara mengintegrasikan FCM di Flutter dan cara menulis kode untuk menerima dan mengirim pesan. Terakhir, codelab ini memperkenalkan fitur pemblokiran khusus platform pada FCM HTTP v1 API, yang memungkinkan Anda mengirim satu pesan yang memiliki perilaku berbeda di berbagai platform.

Prasyarat

Pemahaman dasar tentang Flutter.

Yang akan Anda pelajari

  • Cara menyiapkan dan membuat aplikasi Flutter.
  • Cara menambahkan dependensi FCM.
  • Cara mengirim pesan FCM tunggal ke aplikasi.
  • Cara mengirim pesan FCM topik ke aplikasi Anda.

Yang Anda butuhkan

  • Android Studio Versi Stabil terbaru yang dikonfigurasi dengan plugin Dart dan Flutter.

Anda dapat menjalankan codelab menggunakan salah satu perangkat berikut:

Secara opsional, untuk menjalankan codelab menggunakan platform iOS, Anda memerlukan perangkat iOS, akun Apple Developer, dan perangkat macOS dengan XCode yang terinstal.

2. Penyiapan Flutter

Jika Anda sudah menyiapkan lingkungan pengembangan Flutter, lewati bagian ini.

Untuk menyiapkan lingkungan pengembangan Flutter, ikuti langkah-langkah berikut:

  1. Mendownload dan menginstal Flutter untuk sistem operasi Anda: Install | Flutter
  2. Pastikan alat Flutter telah ditambahkan ke jalur Anda.
  3. Siapkan editor Anda untuk Flutter seperti yang ditunjukkan di Set up an editor | Flutter Pastikan untuk menginstal plugin Flutter dan Dart untuk editor Anda. Untuk codelab lainnya, Anda akan menggunakan Android Studio.
  4. Dari command line, jalankan flutter doctor, yang memindai seluruh penyiapan Anda dan mencantumkan semua dependensi yang hilang dan perlu diperbaiki. Ikuti petunjuk untuk memperbaiki dependensi penting yang hilang. Perhatikan bahwa beberapa dependensi mungkin tidak diperlukan. Misalnya, jika Anda tidak mengembangkan untuk iOS, dependensi CocoaPods yang hilang tidak akan menjadi masalah pemblokiran.
  5. Jalankan perintah ini untuk membuat aplikasi Flutter Anda di direktori fcmflutter flutter create --org com.flutter.fcm --project-name fcmflutter fcmflutter, lalu ubah direktori menjadi fcmflutter.
  1. Di Android Studio, buka File -> Open, temukan jalur aplikasi Flutter Anda, lalu klik Open untuk membuka project di Android Studio. Kode aplikasi ada dalam file lib/main.dart.

Di toolbar Android Studio, klik Panah bawah untuk memilih perangkat Android. Jika pemilih target kosong, instal perangkat Android virtual, atau browser Chrome, atau simulator iOS jika Anda memilih untuk meluncurkan aplikasi dari browser web atau perangkat iOS. Anda mungkin perlu meluncurkan perangkat secara manual dan memuat ulang daftar untuk menemukan perangkat target.

Toolbar Android Studio dengan panah drop-down menu target build ditandai.

Klik Run Tombol run di Android Studio untuk meluncurkan aplikasi.

UI aplikasi demo Flutter yang diluncurkan

Selamat! Anda telah berhasil membuat aplikasi Flutter.

3. Penyiapan Firebase dan FlutterFire

Untuk mengembangkan aplikasi yang terintegrasi dengan Firebase Cloud Messaging menggunakan Flutter, Anda memerlukan:

  • Project Firebase.
  • Firebase CLI yang berfungsi.
  • Penginstalan FlutterFire.
  • Aplikasi yang dikonfigurasi dan dibuat dengan flutterfire configure.

Membuat project Firebase

Jika sudah memiliki project Firebase, Anda dapat melewati langkah ini.

  1. Jika Anda memiliki Akun Google, buka Firebase dan login dengan Akun Google Anda, lalu klik Buka konsol.
  2. Di Firebase Console, klik Tambahkan project. Ikuti petunjuk untuk membuat project. Jangan centang Enable Google Analytics for this project karena Anda tidak akan menggunakannya dalam project ini.
  3. Setelah project dibuat, buka Project Settings dengan mengklik ikon roda gigi di samping Project Overview.

Screenshot Firebase Console yang dipangkas yang menyoroti ikon untuk menu setelan project dan

Project ID digunakan untuk mengidentifikasi project secara unik dan mungkin berbeda dengan Project name. Project ID akan digunakan untuk menyiapkan FlutterFire nanti.

Screenshot Firebase Console yang dipangkas dan menyoroti project ID

Selamat! Anda telah berhasil membuat project Firebase.

Menyiapkan Firebase CLI

Jika sudah menyiapkan Firebase CLI, Anda dapat melewati langkah ini.

Buka referensi Firebase CLI untuk mendownload dan menginstal Firebase CLI. Login ke Firebase menggunakan Akun Google Anda dengan perintah berikut:

firebase login

Menyiapkan FlutterFire

  1. Instal plugin FlutterFire menggunakan perintah: flutter pub add firebase_core
  2. Instal plugin FCM: flutter pub add firebase_messaging
  3. Siapkan FlutterFire CLI: dart pub global activate flutterfire_cli
  4. Konfigurasikan project Firebase di Flutter: flutterfire configure --project=fcm4flutter. Gunakan tombol panah dan spasi untuk memilih platform atau tekan Enter untuk menggunakan platform default.

Codelab ini menggunakan platform default (Android, iOS, dan web), tetapi Anda hanya dapat memilih satu atau dua platform. Jika diminta ID paket iOS, masukkan com.flutter.fcm.fcmflutter atau ID paket iOS Anda sendiri dalam format [company domain name].[project name]. Setelah perintah selesai, muat ulang halaman Firebase Console. Anda akan melihat bahwa tindakan ini telah membuat aplikasi untuk platform yang dipilih di bagian project Firebase.

Screenshot Firebase Console yang dipangkas yang menampilkan aplikasi yang dibuat untuk platform yang dipilih

Perintah ini menghasilkan file firebase_options.dart pada direktori lib, yang berisi semua opsi yang diperlukan untuk inisialisasi.

Menyiapkan Cloud Messaging untuk iOS

  1. Buka halaman developer Apple, lalu klik Create a key di tab Keys.

Screenshot yang dipangkas dari halaman Apple Developer yang menyoroti komponen halaman untuk pembuatan kunci

  1. Masukkan nama untuk kunci tersebut, lalu centang Apple Push Notifications services (APN). Screenshot yang dipangkas dari halaman Apple Developer yang menandai kotak teks untuk nama kunci baru
  2. Download file kunci, yang memiliki ekstensi file .p8. Screenshot yang dipangkas dari halaman Apple Developer yang menandai tombol untuk mendownload kunci
  3. Di Firebase console, buka Project Settings project, lalu pilih tab Cloud Messaging.

Screenshot halaman Firebase Console yang dipangkas dan menyoroti komponen untuk setelan project pembaruan

Screenshot halaman Firebase Console yang dipangkas dan menyoroti tab Cloud Messaging

  1. Upload file kunci APN untuk aplikasi iOS di tab Cloud Messaging. Masukkan ID kunci APN dari tab Cloud Messaging dan ID tim, yang dapat ditemukan di pusat langganan Apple. Screenshot yang dipangkas dari halaman Firebase Console yang menandai tombol untuk mengupload Kunci Autentikasi APN

4. Persiapan FCM

Sebelum dapat menerima pesan dari FCM, aplikasi harus:

  • Melakukan inisialisasi FlutterFire.
  • Meminta izin notifikasi.
  • Mendaftar ke FCM untuk mendapatkan token pendaftaran.

Inisialisasi

Untuk menginisialisasi layanan, ganti fungsi utama (lib/main.dart) dengan kode ini:

// core Flutter primitives
import 'package:flutter/foundation.dart';
// core FlutterFire dependency
import 'package:firebase_core/firebase_core.dart';
// generated by 
flutterfire configure
import 'firebase_options.dart';
// FlutterFire's Firebase Cloud Messaging plugin
import 'package:firebase_messaging/firebase_messaging.dart';

// TODO: Add stream controller
// TODO: Define the background message handler

Future<void> main() async {
 WidgetsFlutterBinding.ensureInitialized();
 await Firebase.initializeApp(
   options: DefaultFirebaseOptions.currentPlatform,
 );

 // TODO: Request permission
 // TODO: Register with FCM
 // TODO: Set up foreground message handler
 // TODO: Set up background message handler

 runApp(MyApp());
}

Kemudian, jalankan Tools -> Flutter -> Flutter Pub Get di Android Studio untuk memuat paket yang ditambahkan di Set up FlutterFire, dan menampilkan kode dengan setelan Intellisense yang sesuai di Android Studio.

Tindakan ini akan menginisialisasi FlutterFire untuk platform saat ini DefaultFirebaseOptions.currentPlatform, yang diimpor dari file firebase_options.dart yang dihasilkan. Perhatikan bahwa initializeApp adalah fungsi asinkron, dan kata kunci await memastikan inisialisasi selesai sebelum menjalankan aplikasi.

Meminta izin

Aplikasi harus meminta izin pengguna untuk menerima notifikasi. Metode requestPermission yang disediakan oleh firebase_messaging menampilkan dialog atau pop-up yang meminta pengguna untuk memberikan atau menolak izin.

Pertama, salin kode ini ke fungsi utama di bawah komentar TODO: Request permission. settings yang ditampilkan akan memberi tahu Anda apakah pengguna telah memberikan izin. Sebaiknya minta izin hanya saat pengguna perlu menggunakan fitur yang memerlukan akses (misalnya, saat pengguna mengaktifkan notifikasi di setelan aplikasi). Dalam codelab ini, kami meminta izin saat memulai aplikasi agar lebih praktis.

final messaging = FirebaseMessaging.instance;

final settings = await messaging.requestPermission(
 alert: true,
 announcement: false,
 badge: true,
 carPlay: false,
 criticalAlert: false,
 provisional: false,
 sound: true,
);

 if (kDebugMode) {
   print('Permission granted: ${settings.authorizationStatus}');
 }

Selanjutnya, di toolbar Android Studio, pilih Chrome (web) dari pemilih target, lalu jalankan aplikasi lagi.

Screenshot yang dipangkas dari toolbar Android Studio dengan pemilih target dan tombol Run

Kemudian, tab Chrome akan terbuka dengan pop-up yang meminta izin. Jika mengklik Allow, Anda akan melihat log di konsol Android Studio: Permission granted: AuthorizationStatus.authorized. Setelah Anda mengizinkan atau memblokir permintaan izin, respons Anda akan disimpan bersama aplikasi di browser, dan pop-up tidak akan ditampilkan lagi. Perlu diperhatikan bahwa saat menjalankan aplikasi web lagi di Android Studio, Anda mungkin akan dimintai izin lagi. Screenshot yang dipangkas dari tab Chrome dengan pop-up yang meminta

Pendaftaran

Salin kode ini ke fungsi utama di bawah komentar TODO: Register with FCM untuk mendaftar ke FCM. Panggilan getToken menampilkan token pendaftaran yang dapat digunakan oleh server aplikasi atau lingkungan server tepercaya untuk mengirim pesan kepada pengguna.

// It requests a registration token for sending messages to users from your App server or other trusted server environment.
String? token = await messaging.getToken();

if (kDebugMode) {
  print('Registration Token=$token');
}

Di toolbar Android Studio, pilih perangkat Android dan jalankan aplikasi. Di konsol Android Studio, token pendaftaran dicetak seperti ini:

I/flutter ( 3717): Permission granted: AuthorizationStatus.authorized
I/flutter ( 3717): Registration Token=dch. . . D2P:APA9. . .kbb4

Salin kode ke editor teks, karena Anda akan menggunakannya untuk mengirim pesan nanti.

uses-sdk:minSdkVersion 16 cannot be smaller than version 19 declared in library [:firebase_messaging]

Langkah-langkah tambahan untuk menerima pesan di web

Aplikasi web memerlukan dua langkah tambahan untuk mendapatkan token pendaftaran dan memproses pesan masuk. Web harus meneruskan kunci VAPID ke getToken untuk mengizinkan permintaan kirim ke layanan web push yang didukung.

Pertama, buka tab Cloud Messaging dari project Firebase di Firebase Console, scroll ke bawah ke bagian Web configuration untuk menemukan pasangan kunci yang ada, atau buat pasangan kunci baru. Klik tombol yang disorot untuk menyalin kunci sehingga dapat digunakan sebagai vapidKey.

Screenshot yang dipangkas dari komponen Web Push Certificate pada halaman konfigurasi Web yang menandai pasangan kunci

Berikutnya, ganti kode pendaftaran di bagian Pendaftaran dengan kode ini, kemudian perbarui vapidKey:

// TODO: replace with your own VAPID key
 const vapidKey = "<YOUR_PUBLIC_VAPID_KEY_HERE>";

 // use the registration token to send messages to users from your trusted server environment
 String? token;

 if (DefaultFirebaseOptions.currentPlatform == DefaultFirebaseOptions.web) {
   token = await messaging.getToken(
     vapidKey: vapidKey,
   );
 } else {
   token = await messaging.getToken();
 }

 if (kDebugMode) {
   print('Registration Token=$token');
 }

Kemudian, buat file firebase-messaging-sw.js di bawah direktori web/ di root project Anda. Salin perintah berikut ke firebase-messaging-sw.js untuk mengizinkan aplikasi web menerima peristiwa onMessage. Lihat Menyetel opsi notifikasi di pekerja layanan untuk informasi selengkapnya.

importScripts("https://www.gstatic.com/firebasejs/9.6.10/firebase-app-compat.js");
importScripts("https://www.gstatic.com/firebasejs/9.6.10/firebase-messaging-compat.js");

// todo Copy/paste firebaseConfig from Firebase Console
const firebaseConfig = {
 apiKey: "...",
 authDomain: "...",
 databaseURL: "...",
 projectId: "...",
 storageBucket: "...",
 messagingSenderId: "...",
 appId: "...",
};

firebase.initializeApp(firebaseConfig);
const messaging = firebase.messaging();

// todo Set up background message handler

Setelah itu, di bagian Setelan Project -> tab Umum, scroll ke bawah dan temukan Aplikasi Web, salin bagian kode firebaseConfig dan tempelkan ke firebase-messaging-sw.js. Screenshot yang dipangkas dari komponen Aplikasi Web dari halaman konfigurasi Firebase

Terakhir, di toolbar Android Studio, pilih Chrome (web) di pemilih target, lalu jalankan aplikasi. Di konsol Android Studio, token pendaftaran dicetak seperti ini:

Debug service listening on ws://127.0.0.1:61538/BLQQ3Fg-h7I=/ws
Permission granted: AuthorizationStatus.authorized
Registration Token=fH. . .ue:APA91. . .qwt3chpv

Salin token pendaftaran ke editor teks agar Anda dapat menggunakannya untuk mengirim pesan di lain waktu.

Langkah-langkah tambahan untuk menerima pesan di iOS

Untuk menerima pesan dari FCM, perangkat iOS harus mengaktifkan Push Notifications dan Background Modes di Xcode:

  1. Di Android Studio, klik kanan nama project, lalu pilih Flutter -> Open iOS module in Xcode. Screenshot yang dipangkas dari
  2. Setelah Xcode diluncurkan, aktifkan Push Notifications dan Background Modes di tab signing & Capabilities untuk target project. Lihat Mengonfigurasi aplikasi untuk informasi selengkapnya.
  3. Di toolbar Android Studio, pilih perangkat iOS di pemilih target dan jalankan aplikasi. Setelah izin notifikasi diberikan, token pendaftaran dicetak di konsol Android Studio.

Screenshot yang dipangkas dari aplikasi iOS yang meminta izin untuk mengirim notifikasi

Selamat, Anda berhasil mendaftarkan aplikasi ke FCM. Anda siap menerima pesan, seperti yang dijelaskan di bagian berikutnya.

5. Menerima pesan dari FCM

Menyiapkan pengendali pesan

Aplikasi harus menangani peristiwa onMessage saat pesan masuk saat aplikasi berada dalam mode latar depan, dan peristiwa onBackgroundMessage saat aplikasi berada di latar belakang.

Pengendali pesan latar depan

Pertama, tambahkan pengontrol streaming setelah komentar TODO: Add stream controller dalam file main.dart untuk meneruskan pesan dari pengendali peristiwa ke UI.

import 'package:rxdart/rxdart.dart';
// used to pass messages from event handler to the UI
final _messageStreamController = BehaviorSubject<RemoteMessage>();

Untuk menambahkan dependensi rxdart, jalankan perintah ini dari direktori project: flutter pub add rxdart.

Selanjutnya, jalankan Tools -> Flutter -> Flutter Pub Get di Android Studio untuk memuat paket rxdart.dart dan menampilkan kode dengan setelan Intellisense yang sesuai di Android Studio.

Kemudian, tambahkan pengendali peristiwa untuk memproses pesan latar depan setelah komentar TODO: Set up foreground message handler. Output ini akan mencetak log dan memublikasikan pesan ke pengontrol streaming.

 FirebaseMessaging.onMessage.listen((RemoteMessage message) {
   if (kDebugMode) {
     print('Handling a foreground message: ${message.messageId}');
     print('Message data: ${message.data}');
     print('Message notification: ${message.notification?.title}');
     print('Message notification: ${message.notification?.body}');
   }

   _messageStreamController.sink.add(message);
 });

Setelah itu, ganti widget Status asli di file main.dart dengan kode ini, yang akan menambahkan pelanggan ke pengontrol streaming di widget Status dan menampilkan pesan terakhir pada widget.

class _MyHomePageState extends State<MyHomePage> {
 String _lastMessage = "";

 _MyHomePageState() {
   _messageStreamController.listen((message) {
     setState(() {
       if (message.notification != null) {
         _lastMessage = 'Received a notification message:'
             '\nTitle=${message.notification?.title},'
             '\nBody=${message.notification?.body},'
             '\nData=${message.data}';
       } else {
         _lastMessage = 'Received a data message: ${message.data}';
       }
     });
   });
 }

 @override
 Widget build(BuildContext context) {
   return Scaffold(
     appBar: AppBar(
       title: Text(widget.title),
     ),
     body: Center(
       child: Column(
         mainAxisAlignment: MainAxisAlignment.center,
         children: <Widget>[
           Text('Last message from Firebase Messaging:',
               style: Theme.of(context).textTheme.titleLarge),
           Text(_lastMessage, style: Theme.of(context).textTheme.bodyLarge),
         ],
       ),
     ),
   );
 }
}

Pengendali pesan latar belakang untuk Android/iOS

Pesan ditangani oleh pengendali onBackgroundMessage saat aplikasi berada di latar belakang. Pengendali harus berupa fungsi tingkat atas. UI dapat diupdate saat aplikasi dibawa ke latar depan dengan menangani pesan (lihat Menangani interaksi) atau menyinkronkan dengan server aplikasi.

Buat fungsi pengendali setelah komentar TODO: Define the background message handler di luar fungsi utama dan panggil di fungsi utama setelah komentar TODO: Set up background message handler.

// TODO: Define the background message handler
Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
 await Firebase.initializeApp();

 if (kDebugMode) {
   print("Handling a background message: ${message.messageId}");
   print('Message data: ${message.data}');
   print('Message notification: ${message.notification?.title}');
   print('Message notification: ${message.notification?.body}');
 }
}

void main() {
 ...

 // TODO: Set up background message handler
 FirebaseMessaging.onBackgroundMessage(_firebaseMessagingBackgroundHandler);

 runApp(MyApp());
}

Pengendali pesan latar belakang untuk web

Mulai dari firebase_Messaging versi 11.2.8, penanganan pesan latar belakang pada platform berbasis web memerlukan alur yang berbeda. Oleh karena itu, Anda perlu menambahkan pengendali pesan terpisah di pekerja layanan web/firebase-messaging-sw.js.

messaging.onBackgroundMessage((message) => {
 console.log("onBackgroundMessage", message);
});

Menyiapkan server aplikasi

  1. Impor kode server awal dengan membuka project https://github.com/FirebaseExtended/firebase_fcm_flutter/tree/main/server di Android Studio. Server adalah project Java berbasis Gradle dengan dependensi pada SDK firebase-admin, yang menyediakan fungsionalitas pengiriman pesan FCM.
  2. Siapkan Akun Layanan Firebase yang memungkinkan Firebase Admin SDK mengizinkan panggilan ke FCM API. Buka Project Settings di Firebase console, lalu pilih tab Service accounts. Pilih 'Java', lalu klik Generate new private key untuk mendownload cuplikan konfigurasi. Screenshot yang dipangkas yang menandai cuplikan konfigurasi Admin SDK dari komponen akun Layanan di halaman Setelan project
  3. Ganti nama file menjadi service-account.json, lalu salin ke jalur src/main/resources project server.

Mengirim pesan pengujian

Di file FcmSender.java, sendMessageToFcmRegistrationToken akan menulis pesan notifikasi dengan payload data. Token pendaftaran menargetkan instance aplikasi yang dikirimi pesan.

private static void sendMessageToFcmRegistrationToken() throws Exception {
   String registrationToken = "REPLACE_WITH_FCM_REGISTRATION_TOKEN";
   Message message =
       Message.builder()
           .putData("FCM", "https://firebase.google.com/docs/cloud-messaging")
           .putData("flutter", "https://flutter.dev/")
           .setNotification(
               Notification.builder()
                   .setTitle("Try this new app")
                   .setBody("Learn how FCM works with Flutter")
                   .build())
           .setToken(registrationToken)
           .build();

   FirebaseMessaging.getInstance().send(message);

   System.out.println("Message to FCM Registration Token sent successfully!!");
 }
  1. Salin token pendaftaran Android yang disalin dari bagian Pendaftaran, dan tempelkan ke nilai untuk variabel registrationToken.
  2. Klik Run Tombol run di Android Studio untuk menjalankan fungsi utama dan mengirim pesan ke pengguna melalui FCM. Screenshot yang dipangkas dari ikon Run yang ditampilkan di samping fungsi utama FcmSender.java di Android Studio

Saat aplikasi Android berjalan di latar belakang, pesan muncul di baki notifikasi.

Screenshot yang dipangkas dari pesan yang muncul di baki notifikasi Android

Saat aplikasi Android berada di latar depan, Anda akan melihat log di konsol Android Studio: "Menangani pesan latar depan". Konten pesan juga ditampilkan di UI karena UI berlangganan pesan baru ke pengontrol streaming.

Screenshot yang dipangkas dari konten pesan yang ditampilkan di aplikasi Android

Jika Anda menempelkan token pendaftaran dan mengirim pesan dari server aplikasi atau lingkungan server tepercaya lainnya, Anda akan melihat perilaku yang serupa:

  • Saat aplikasi web berada di latar belakang (misalnya, saat aplikasi disembunyikan oleh jendela lain atau tab lain sedang aktif), Anda akan melihat notifikasi web.

Screenshot yang dipangkas dari notifikasi web yang ditampilkan di browser Chrome

  • Saat aplikasi web ada di latar depan, Anda dapat melihat log di Konsol Chrome dengan mengklik kanan web dan memilih Inspect. Konten pesan juga ditampilkan di UI. Screenshot yang dipangkas dari Konsol Chrome dengan log debug

6. Mengirim pesan topik

Fitur penggantian platform FCM HTTP v1 API memungkinkan permintaan pengiriman pesan memiliki perilaku yang berbeda di platform yang berbeda. Salah satu kasus penggunaan fitur ini adalah menampilkan konten pesan notifikasi yang berbeda berdasarkan platformnya. Fitur ini paling banyak digunakan saat menargetkan beberapa perangkat (yang mungkin mencakup beberapa platform) dengan pesan topik. Bagian ini akan memandu Anda melakukan langkah-langkah untuk membuat aplikasi menerima pesan topik yang disesuaikan untuk setiap platform.

Berlangganan ke topik dari klien

Untuk berlangganan topik, panggil metode messaging.subscribeToTopic di akhir fungsi utama di file main.dart aplikasi Flutter.

// subscribe to a topic.
const topic = 'app_promotion';
await messaging.subscribeToTopic(topic);

[Opsional] Berlangganan ke topik dari server untuk web

Anda dapat melewati bagian ini jika Anda tidak melakukan pengembangan di platform web.

FCM JS SDK saat ini tidak mendukung langganan topik sisi klien. Sebagai gantinya, Anda dapat berlangganan menggunakan API pengelolaan topik sisi server Admin SDK. Kode ini mengilustrasikan langganan topik sisi server dengan Java Admin SDK.

 private static void subscribeFcmRegistrationTokensToTopic() throws Exception {
   List<String> registrationTokens =
       Arrays.asList(
           "REPLACE_WITH_FCM_REGISTRATION_TOKEN"); // TODO: add FCM Registration Tokens to
   // subscribe
   String topicName = "app_promotion";

   TopicManagementResponse response =     FirebaseMessaging.getInstance().subscribeToTopic(registrationTokens, topicName);
   System.out.printf("Num tokens successfully subscribed %d", response.getSuccessCount());
 }

Buka server aplikasi dan klik Run Tombol run di Android Studio untuk menjalankan fungsi utama di file FcmSubscriptionManager.java:

Screenshot yang dipangkas dari ikon Run yang ditampilkan di samping fungsi utama FcmSubscriptionManager.java di Android Studio

Mengirim pesan dengan penggantian platformke topik

Sekarang Anda siap untuk mengirim pesan penggantian platform topik. Dalam cuplikan kode berikut:

  • Anda membuat permintaan kirim dengan pesan dasar dan judul "A new app is available".
  • Pesan tersebut menghasilkan notifikasi tampilan dengan judul "A new app is available" di platform iOS dan web.
  • Pesan tersebut menghasilkan notifikasi tampilan dengan judul "A new Android app is available" di perangkat Android.
private static void sendMessageToFcmTopic() throws Exception {
   String topicName = "app_promotion";

   Message message =
       Message.builder()
           .setNotification(
               Notification.builder()
                   .setTitle("A new app is available")
                   .setBody("Check out our latest app in the app store.")
                   .build())
           .setAndroidConfig(
               AndroidConfig.builder()
                   .setNotification(
                       AndroidNotification.builder()
                           .setTitle("A new Android app is available")
                           .setBody("Our latest app is available on Google Play store")
                           .build())
                   .build())
           .setTopic("app_promotion")
           .build();

   FirebaseMessaging.getInstance().send(message);

   System.out.println("Message to topic sent successfully!!");
 }

Pada fungsi utama file FcmSender.java, hapus tanda komentar sendMessageToFcmTopic();. Klik Run Tombol run di Android Studio untuk mengirim pesan topik.

7. Ringkasan dan langkah selanjutnya

Singkatnya, Anda telah mempelajari cara melibatkan pengembangan aplikasi multi-platform menggunakan Flutter dan FCM, yang mencakup penyiapan lingkungan, integrasi dependensi, serta penerimaan dan pengiriman pesan. Untuk mempelajari lebih lanjut, lihat materi berikut:

Codelabs

Referensi