Mulai menggunakan Firebase Cloud Messaging


Panduan memulai ini menjelaskan cara menyiapkan Firebase Cloud Messaging di aplikasi klien seluler dan web Anda agar dapat mengirim pesan dengan andal. Untuk lingkungan server, lihat Lingkungan server dan FCM.

Menyiapkan aplikasi klien Firebase Cloud Messaging di Flutter

Bergantung pada platform yang Anda targetkan, ada beberapa langkah penyiapan tambahan penting yang harus Anda lakukan.

iOS+

Method swizzling

Untuk menggunakan plugin FCM Flutter di perangkat Apple, method swizzling diperlukan. Jika dinonaktifkan, fitur-fitur penting Firebase seperti penanganan token FCM tidak akan berfungsi dengan benar.

Android

Layanan Google Play

Klien FCM memerlukan perangkat yang menjalankan Android 4.4 atau versi lebih tinggi dan sudah menginstal layanan Google Play, atau emulator yang menjalankan Android 4.4 dengan Google API. Perlu diperhatikan bahwa aplikasi Android bisa di-deploy tidak hanya melalui Google Play Store.

Aplikasi yang mengandalkan SDK Layanan Play harus selalu memeriksa perangkat untuk memastikan adanya APK layanan Google Play yang kompatibel sebelum mengakses fitur layanan Google Play. Sebaiknya lakukan hal ini di dua tempat: di metode onCreate() aktivitas utama, dan di metode onResume()-nya. Pemeriksaan di onCreate() memastikan bahwa aplikasi tidak dapat digunakan jika pemeriksaan tidak berhasil. Pemeriksaan di onResume() memastikan bahwa jika pengguna kembali ke aplikasi yang sedang berjalan melalui cara lain, misalnya dengan tombol kembali, pemeriksaan akan tetap dilakukan.

Jika perangkat tidak memiliki versi layanan Google Play yang kompatibel, aplikasi Anda dapat memanggil GoogleApiAvailability.makeGooglePlayServicesAvailable() agar pengguna dapat mendownload layanan Google Play dari Play Store.

Web

Konfigurasi Kredensial Web dengan FCM

Antarmuka Web FCM menggunakan kredensial Web yang disebut kunci Voluntary Application Server Identification, atau "VAPID", untuk mengizinkan permintaan kirim ke layanan web push yang didukung. Untuk membuat aplikasi Anda berlangganan notifikasi push, tautkan sepasang kunci ke project Firebase Anda. Anda dapat membuat pasangan kunci baru atau mengimpor pasangan kunci yang ada melalui Firebase console.

Menginstal plugin FCM

  1. Instal dan lakukan inisialisasi plugin Firebase untuk Flutter jika Anda belum melakukannya.

  2. Dari root project Flutter Anda, jalankan perintah berikut untuk menginstal plugin:

    flutter pub add firebase_messaging
    
  3. Setelah selesai, bangun ulang aplikasi Flutter Anda:

    flutter run
    

Mengakses token pendaftaran

Untuk mengirim pesan ke perangkat tertentu, Anda perlu mengetahui token pendaftaran perangkat tersebut. Untuk mengambil token pendaftaran untuk instance aplikasi, panggil getToken(). Jika izin notifikasi belum diberikan, metode ini akan meminta izin notifikasi dari pengguna. Jika izin sudah diberikan, metode tersebut akan menampilkan token atau menolak future karena terjadi error.

// You may set the permission requests to "provisional" which allows the user to choose what type
// of notifications they would like to receive once the user receives a notification.
final notificationSettings = await FirebaseMessaging.instance.requestPermission(provisional: true);

// For apple platforms, make sure the APNS token is available before making any FCM plugin API calls
final apnsToken = await FirebaseMessaging.instance.getAPNSToken();
if (apnsToken != null) {
 // APNS token is available, make FCM plugin API requests...
}

Di platform web, teruskan kunci publik VAPID Anda ke getToken():

final fcmToken = await FirebaseMessaging.instance.getToken(vapidKey: "BKagOny0KF_2pCJQ3m....moL0ewzQ8rZu");

Agar mendapatkan pemberitahuan setiap kali token diperbarui, berlanggananlah ke aliran data onTokenRefresh:

FirebaseMessaging.instance.onTokenRefresh
    .listen((fcmToken) {
      // TODO: If necessary send token to application server.

      // Note: This callback is fired at each app startup and whenever a new
      // token is generated.
    })
    .onError((err) {
      // Error getting token.
    });

Mencegah inisialisasi otomatis

Saat token pendaftaran FCM dibuat, library mengupload data konfigurasi dan ID ke Firebase. Jika Anda ingin mencegah pembuatan token secara otomatis, nonaktifkan inisialisasi otomatis pada waktu build.

iOS

Di iOS, tambahkan nilai metadata ke Info.plist:

FirebaseMessagingAutoInitEnabled = NO

Android

Di Android, nonaktifkan pengumpulan Analytics dan inisialisasi otomatis FCM (keduanya harus dinonaktifkan) dengan menambahkan nilai metadata ini ke AndroidManifest.xml:

<meta-data
    android:name="firebase_messaging_auto_init_enabled"
    android:value="false" />
<meta-data
    android:name="firebase_analytics_collection_enabled"
    android:value="false" />

Mengaktifkan kembali inisialisasi otomatis FCM saat runtime

Untuk mengaktifkan inisialisasi otomatis untuk instance aplikasi tertentu, panggil setAutoInitEnabled():

await FirebaseMessaging.instance.setAutoInitEnabled(true);

Nilai ini akan tetap sama setiap kali aplikasi dimulai ulang.

Mengirim pesan notifikasi pengujian

  1. Instal dan jalankan aplikasi pada perangkat target. Pada perangkat Apple, Anda harus menyetujui permintaan izin untuk menerima notifikasi jarak jauh.
  2. Pastikan aplikasi berjalan di latar belakang pada perangkat.
  3. Di Firebase console, buka halaman Messaging.
  4. Jika ini adalah pesan pertama Anda, pilih Create your first campaign.
    1. Pilih Firebase Notification messages, lalu pilih Create.
  5. Atau, di tab Campaigns, pilih New campaign, lalu Notifications.
  6. Masukkan teks pesan.
  7. Pilih Send test message dari panel kanan.
  8. Dalam kolom yang berlabel Add an FCM registration token, masukkan token pendaftaran Anda.
  9. Pilih Test.

Setelah Anda memilih Test, perangkat klien yang ditargetkan, dengan aplikasi berada di latar belakang, akan menerima notifikasi.

Untuk melihat data terkait pengiriman pesan ke aplikasi Anda, lihat dasbor pelaporan FCM, yang mencatat jumlah pesan yang terkirim dan dibuka di perangkat Apple dan Android, beserta data tayangan untuk aplikasi Android.

Menangani interaksi

Saat pengguna mengetuk notifikasi, perilaku default di Android & iOS adalah membuka aplikasi. Jika dihentikan, aplikasi akan dimulai, dan jika berada di latar belakang, aplikasi akan dialihkan ke latar depan.

Bergantung pada konten notifikasi, Anda mungkin ingin menangani interaksi pengguna saat aplikasi terbuka. Misalnya, jika pesan chat baru dikirim menggunakan notifikasi dan pengguna memilihnya, sebaiknya Anda membuka percakapan tertentu saat aplikasi terbuka.

Paket firebase-messaging menyediakan dua cara untuk menangani interaksi ini:

  1. getInitialMessage(): Jika aplikasi dibuka dari status dihentikan, metode ini akan menampilkan Future yang berisi RemoteMessage. Setelah digunakan, RemoteMessage akan dihapus.
  2. onMessageOpenedApp: Stream yang memposting RemoteMessage saat aplikasi dibuka dari status latar belakang.

Untuk memastikan pengguna mendapatkan pengalaman yang lancar, Anda harus menangani kedua skenario tersebut. Contoh kode berikut menguraikan cara melakukannya:

class Application extends StatefulWidget {
  @override
  State createState() => _Application();
}

class _Application extends State {
  // In this example, suppose that all messages contain a data field with the key 'type'.
  Future setupInteractedMessage() async {
    // Get any messages which caused the application to open from
    // a terminated state.
    RemoteMessage? initialMessage =
        await FirebaseMessaging.instance.getInitialMessage();

    // If the message also contains a data property with a "type" of "chat",
    // navigate to a chat screen
    if (initialMessage != null) {
      _handleMessage(initialMessage);
    }

    // Also handle any interaction when the app is in the background using a
    // Stream listener
    FirebaseMessaging.onMessageOpenedApp.listen(_handleMessage);
  }

  void _handleMessage(RemoteMessage message) {
    if (message.data['type'] == 'chat') {
      Navigator.pushNamed(context, '/chat',
        arguments: ChatArguments(message),
      );
    }
  }

  @override
  void initState() {
    super.initState();

    // Run code required to handle interacted messages in an async function
    // as initState() must not be async
    setupInteractedMessage();
  }

  @override
  Widget build(BuildContext context) {
    return Text("...");
  }
}

Cara Anda menangani interaksi bergantung pada penyiapan Anda. Contoh yang ditampilkan sebelumnya adalah contoh dasar penggunaan StatefulWidget.

Langkah berikutnya

Setelah Anda menyelesaikan langkah-langkah penyiapan, berikut ini beberapa opsi untuk melanjutkan penggunaan FCM untuk Flutter: