Belajar Cara Mengirim Pesan Topik di Firebase Cloud Messaging


Assalamualaikum Warahmatullahi Wabarakatuh.

Didalam Firebase Cloud Messaging terdapat fitur untuk pengiriman notifikasi berdasarkan topik yang dituju, user dapat menentukan jenis topik yang ingin dikirim oleh sistem admin, misalnya didalam aplikasi kita terdapat beberapa konten, seperti kesehatan, berita dan olahraga. User dapat memilih dan berlangganan salah satu atau lebih dari beberapa pilihan topik tersebut, Misalnya jika user memilih topik kesehatan, maka pesan yang akan diterima seputar kesehatan saja.


FCM dapat digunakan untuk mengirim pesan ke beberapa perangkat yang mengikuti topik tertentu. Kita dapat menulis pesan sesuai kebutuhan, dan FMC akan mengirimkan pesan dengan baik ke perangkat yang tepat.
Materi yang harus kalian pelajari sebelumnya:

Pada tutorial berikut ini, kita akan belajar membuat project sederhana, dimana user dapat memilih salah satu atau semua topik yang terdapat didalam aplikasi, saya harap kalian sudah memahami beberapa materi yang terdapat pada tutorial sebelumnya mengenai FCM.

Belajar Cara Mengirim Pesan Topik di Firebase Cloud Messaging

1) Tambahkan Firebase kedalam Project Aplikasi,Untuk Tutorialnya kalian bisa lihat Disini

2) Selanjutnya buka file build.gradle (module:app), tambahkan library FCM berikut ini kedalam dependencies.
dependencies {
     compile 'com.google.firebase:firebase-messaging:11.6.2'
}
3) Buka AndroidManifest.xml, lalu tambahkan permission berikut ini, untuk mengijinkan apliaksi membuka socket jaringan.
<uses-permission android:name="android.permission.INTERNET" />
4) Selanjutnya, pada activity_main.xml, kita akan membuat 3 buah pilihan topik yang berbeda, yaitu kesehatan, olahraga dan berita. Menggunakan sebuah Button.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="12dp"
    android:gravity="center"
    android:orientation="vertical"
    tools:context="cianjur.developer.net.firebaseexample.MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginBottom="6dp"
        android:gravity="center"
        android:text="Pilih Topik Berlangganan"
        android:textSize="16sp"
        android:textStyle="bold" />

    <Button
        android:id="@+id/kesehatan"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Kesehatan" />

    <Button
        android:id="@+id/olahraga"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Olahraga" />

    <Button
        android:id="@+id/berita"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Berita" />
</LinearLayout>
View:


User dapat memilih salah satu atau beberapa topik berlangganan tersebut serta dapat membatalkannya.

5) Buat class baru bernama "MyNotificationManager", class ini digunakan untuk membuat notifikasi yang akan ditampilkan didepan layar pada class FirebaseMessagingService.
package cianjur.developer.net.firebaseexample;

import android.app.Notification;
import android.app.NotificationManager;
import android.app.PendingIntent;
import android.content.Context;
import android.content.Intent;
import android.graphics.BitmapFactory;
import android.support.v4.app.NotificationCompat;

public class MyNotificationManager {

    private Context context;
    private static final int NOTIFICATION_ID = 77;

    public MyNotificationManager(Context context) {
        this.context = context;
    }

    public void showNotification(String from, String notification, Intent intent){
        PendingIntent pendingIntent = PendingIntent.getActivity(
                context,
                NOTIFICATION_ID,
                intent,
                PendingIntent.FLAG_UPDATE_CURRENT
        );

        NotificationCompat.Builder builder = new NotificationCompat.Builder(context,"MyNotification");
        Notification mNotification = builder.setSmallIcon(R.mipmap.ic_launcher)
                .setAutoCancel(true)
                .setContentIntent(pendingIntent)
                .setContentTitle(from)
                .setContentText(notification)
                .setLargeIcon(BitmapFactory.decodeResource(context.getResources(), R.mipmap.ic_launcher))
                .build();

        mNotification.flags |= Notification.FLAG_AUTO_CANCEL;
        NotificationManager manager = (NotificationManager)context.getSystemService(Context.NOTIFICATION_SERVICE);
        manager.notify(NOTIFICATION_ID, mNotification);
    }
}
Pertama kita membuat 2 buah variable, yaitu context dan id notifikasi, context akan kita guanakan untuk menghubungkan class ini dengan Activity, selanjutnya kita membuat method showNotification(), didalamnya terdapat konfigurasai dan pengaturan notifikasi.

Pada method showNotification() pertama kita ambil PendingIntent untuk memulai sebuah Activity, didalam fungsi getActivity(), terdapat beberapa parameter, yaitu:
  1. this (context) : Konteks digunakan untuk memulai activity.
  2. requestCode (NOTIFICATION_ID) : “77” adalah kode permintaan pribadi untuk pengirim.
  3. intent : Objek eksplisit dari activity yang akan diluncurkan.
  4. flag : Salah satu flag yang kita gunakan yaitu  FLAG_UPDATE_CURRENT. digunakan untuk menyatakan bahwa jika PendingIntent sebelumnya sudah ada, maka akan memperbaruinya dengan Intent terakhir.

Lalu selanjutnya adalaha class NotificationCompat.Builder, digunakan untuk membangun dan menetukan atribut pada notifikasi yang akan kita buat, seperti icon, judul, isi, dll. Dan terakhir, notifikasi dibuat dengan menggunakan class NotificationManager.

6) Selanjutnya kita buat class baru bernama "MyFirebaseMessagingService" yang mengekstends FirebaseMessagingService, untuk menagani pesan yang diterima oleh client.
package cianjur.developer.net.firebaseexample;

import android.content.Intent;

import com.google.firebase.messaging.FirebaseMessagingService;
import com.google.firebase.messaging.RemoteMessage;

public class MyFirebaseMessagingService extends FirebaseMessagingService {


    @Override
    public void onMessageReceived(RemoteMessage remoteMessage) {
        //Memeriksa apakan pesan berisi muatan pemberitahuan
        if(remoteMessage.getNotification() != null){
            setNotification(remoteMessage.getFrom(), remoteMessage.getNotification().getBody());
        }
    }

    private void setNotification(String from, String notification){
        MyNotificationManager myNotificationManager = new MyNotificationManager(getApplicationContext());
        myNotificationManager.showNotification(from, notification, new Intent(getApplicationContext(), MainActivity.class));
    }
}
Pada method setNotification(), kita memanggil class MyNotification, untuk memasukan data-data yang diperlukan, seperti data from dan notifikasi, yang didapat dari Server FCM, dan juga konteks Activity kita.

7) Daftarkan pada AndroidManifest.xml, dengan intent-filter "com.google.firebase.INSTANCE_ID_EVENT", agar class tersebut dapat menangkap pesan di latar depan aplikasi.
<service
    android:name=".fcm.MyFirebaseMessagingService">
    <intent-filter>
        <action android:name="com.google.firebase.MESSAGING_EVENT"/>
    </intent-filter>
</service>
8) Buka class MainActivity, disini kita akan menggunakan fungsi subscribeToTopic() dari FCM, yang digunakan untuk menentukan topik pilihan user serta kita juga akan menggunakan fungsi unsubscribeFromTopic() untuk membatalkan pada topik yang dipilih.
package cianjur.developer.net.firebaseexample;

import android.annotation.SuppressLint;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.Toast;

import com.google.firebase.messaging.FirebaseMessaging;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

    //Deklarasi Variable
    private Button subKesehatan, subBerita, subOlahraga;
    boolean berlangganan1 = false, berlangganan2 = false, berlangganan3 = false;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        subKesehatan = findViewById(R.id.kesehatan);
        subKesehatan.setOnClickListener(this);
        subOlahraga = findViewById(R.id.olahraga);
        subOlahraga.setOnClickListener(this);
        subBerita = findViewById(R.id.berita);
        subBerita.setOnClickListener(this);
    }

    @SuppressLint("SetTextI18n")
    @Override
    public void onClick(View v) {
        switch (v.getId()){
            case R.id.kesehatan:
                if(berlangganan1){
                    FirebaseMessaging.getInstance().unsubscribeFromTopic("Kesehatan");
                    subKesehatan.setText("Kesehatan");
                    berlangganan1 = false;
                    Toast.makeText(MainActivity.this, "Berhenti Berlangganan dari Topik Kesehatan", Toast.LENGTH_SHORT).show();
                }else {
                    FirebaseMessaging.getInstance().subscribeToTopic("Kesehatan");
                    subKesehatan.setText("Kesehatan(Berlangganan)");
                    berlangganan1 = true;
                    Toast.makeText(MainActivity.this, "Berlangganan topik Kesehatan", Toast.LENGTH_SHORT).show();
                }
                break;

            case R.id.berita:
                if(berlangganan2){
                    FirebaseMessaging.getInstance().unsubscribeFromTopic("Berita");
                    subBerita.setText("Berita");
                    berlangganan2 = false;
                    Toast.makeText(MainActivity.this, "Berhenti Berlangganan dari Topik Berita", Toast.LENGTH_SHORT).show();
                }else {
                    FirebaseMessaging.getInstance().subscribeToTopic("Berita");
                    subBerita.setText("Berita(Berlangganan)");
                    berlangganan2 = true;
                    Toast.makeText(MainActivity.this, "Berlangganan topik Berita", Toast.LENGTH_SHORT).show();
                }
                break;

            case R.id.olahraga:
                if(berlangganan3){
                    FirebaseMessaging.getInstance().unsubscribeFromTopic("Olahraga");
                    subOlahraga.setText("Olahraga");
                    berlangganan3 = false;
                    Toast.makeText(MainActivity.this, "Berhenti Berlangganan dari Topik Olahraga", Toast.LENGTH_SHORT).show();
                }else {
                    FirebaseMessaging.getInstance().subscribeToTopic("Olahraga");
                    subOlahraga.setText("Olahraga(Berlangganan)");
                    berlangganan3 = true;
                    Toast.makeText(MainActivity.this, "Berlangganan topik Olahraga", Toast.LENGTH_SHORT).show();
                }
                break;
        }
    }
}
Dengan menggunakan variable boolean, kita dapat menandai apakah tombol tersebut sudah di subscribe/berlangganan atau tidak, saat user mengklik salah satu tombol tersebut, maka akan mengsubscribenya dan untuk membatalkannya, user dapat mengkliknya lagi.

9) Jalankan project tersebut, lalu klik salah satu atau beberapa topik, setelah itu buka Firebase Console kalian, pada Cloud Messaging, buat pesan baru seperti berikut ini.


Demo:

  

Terimakasih atas kunjungannya, semoga tutorial yang saya berikan bisa bermanfaat untuk kalian semua, selebihnya, mohon maaf bila ada kesalahan.

Wassalamualaikum Warahmatullahi Wabarakatuh.
Wildan M Athoillah
Wildan M Athoillah Blogger dan spesialis pembuat aplikasi android.