Push Notification Sederhana Android dengan Firebase dan PHP

Notifikasi merupakan pesan singkat yang ditampilkan oleh android sebagai pengingat, komunikasi yang dikirim orang lain, atau informasi aktual lainnya. Notifikasi ini bisa berjalan diluar UI aplikasi. Notifikasi juga bisa di ketuk untuk menuju aplikasi yang Anda jalankan/melakukan tindakan langsung dari notifikasi.

Layanan untuk membuat notifikasi paling populer adalah dari Firebase yaitu Firebase Cloud Messaging (FCM). Artikel ini akan menjelaskan secara praktis bagaimana membuat push notification android dengan FCM dan php. Push notification yang akan kita buat menggunakan metode Subscribe/Unsubscribe Topic. Langsung saja kita masuk ke tutorial nya ya.

  1. Masuk ke website Firebase Console untuk membuat akun dan projek. Namun jika sudah memiliki akun google Anda akan langsung diarahkan untuk membuat projek. Untuk membuat projek klik saja tombol putih Create a project.

2. Masukkan saja nama projek yang akan Anda buat. Kemudian cek kolom “I accept the Firebase terms” kemudian tombol Continue akan berubah warna, klik saja untuk melanjutkan.

Setelah berhasil membuat projek maka nanti akan muncul nama projek Anda seperti ini :

Selanjutnya klik saja Continue.

3. Buka projek android Anda dan klik menu bar Tools > Firebase> Cloud Messaging

4. Klik Set up Firebase Cloud Messaging

Klik Connect to Firebase>Build dan tunggu hingga Anda diarahkan ke web Firebase Console.

6. Pilih projek yang sudah Anda buat tadi ya, kemudian tunggu kembali hingga muncul tombol Connect untuk menghubungkan projek android Anda ke projek Firebase. Klik saja tombol Connect nya dan tunggu hingga ada pemberitahuan sukses

7. Kembali lagi ke Android Studio IDE apabila projek Firebase berhasil terhubung ke projek android maka akan seperti ini :

8. Lanjut ke langkah ke 2 klik saja Add FCM to your app> Accept Changes maka otomatis gradle projek androidmu akan ditambahkan dengan gradle Firebase dan juga file google-services.json. Tunggu hingga proses Sync Gradle selesai

9. Langkah 3, 4, dan 5 akan kita ringkas saja menjadi 1 class Service. Buat class baru di projek Anda dan isikan dengan program dibawah ini.

ServiceMessaging.class

public class ServiceMessaging extends FirebaseMessagingService {
    private static final String TAG = "MyService";
    NotificationCompat.Builder notifBuilder;

    public ServiceMessagingAndreas() {
    }

    @Override
    public void onMessageReceived(RemoteMessage remoteMessage) {
        super.onMessageReceived(remoteMessage);
        Log.d(TAG, "From : " + remoteMessage.getFrom());

        if (remoteMessage.getData().size() > 0) {
            Log.d(TAG, "Message data payload : " + remoteMessage.getData());
        }
        if (remoteMessage.getData() != null) {
            String title = remoteMessage.getData().get("title"); //will hold FCM Title
            String message = remoteMessage.getData().get("message"); //will hold FCM message body
            sendNotification(title, message);
        }
    }

    private void sendNotification(String title, String message) {
        Intent intent = new Intent(this, MainActivity.class);
        intent.addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
        PendingIntent pendingIntent = PendingIntent.getActivity(this, 0, intent, PendingIntent.FLAG_ONE_SHOT);
        Uri defaultSoundUri = RingtoneManager.getDefaultUri(RingtoneManager.TYPE_NOTIFICATION);
        String channelID = getString(R.string.channel_id);

        notifBuilder = new NotificationCompat.Builder(this, channelID)
                .setSmallIcon(R.drawable.ic_launcher_background)
                .setContentTitle(title)
                .setContentText(message)
                .setAutoCancel(true)
                .setSound(defaultSoundUri)
                .setContentIntent(pendingIntent);
        NotificationManager notificationManager = (NotificationManager) getSystemService(Context.NOTIFICATION_SERVICE);
        //since android oreo notification channel is needed
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.O) {
            NotificationChannel channel = new NotificationChannel(channelID, "Channel human readable title", NotificationManager.IMPORTANCE_DEFAULT);
            notificationManager.createNotificationChannel(channel);
        }
        int id = (int) System.currentTimeMillis();
        notificationManager.notify(id /*ID of notification*/, notifBuilder.build());
    }
}

10. Setelah itu buka file AndroidManifest.xml dan tambahkan dengan code dibawah ini :

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    package="tim.ku">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.WAKE_LOCK" />
    <uses-permission android:name="android.permission.ACCESS_NOTIFICATION_POLICY" />

    <application
        android:allowBackup="true"
        android:icon="@mipmap/icon"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/icon"
        android:supportsRtl="true"
        android:theme="@style/Theme.ku"
        android:usesCleartextTraffic="true"
        tools:targetApi="m">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

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

</manifest>

11. Langkah selanjutnya adalah membuat script php untuk menangani topik apa yang akan dipakai. Sebagai contoh script php yang digunakan :

Nama topik disesuaikan ya sama nama topik Anda. Kalau di artikel ini menggunakan nama system.

push_notif.php

<?php
//set waktu 
date_default_timezone_set("Asia/Jakarta");

// API access key from Google API's Console
define( 'API_ACCESS_KEY', 'YOUR SERVICE KEY');
$registrationIds = array( $_GET['id'] );

//koneksi database
include "inc/func.php";

$msg = array(
    'message'   => 'Hello world!',
    'title'     => 'Hi!',
    'vibrate'   => 1,
    'sound'     => 1,
    'largeIcon' => 'large_icon',
    'smallIcon' => 'small_icon');
    $fields = array
    (
        'to'  => '/topics/system',
        'data'  => $msg
    );
$headers = array
    (
        'Authorization: key=' . API_ACCESS_KEY,
        'Content-Type: application/json'
    );
    $ch = curl_init();
    curl_setopt( $ch,CURLOPT_URL, 'https://fcm.googleapis.com/fcm/send' );
    curl_setopt( $ch,CURLOPT_POST, true );
    curl_setopt( $ch,CURLOPT_HTTPHEADER, $headers );
    curl_setopt( $ch,CURLOPT_RETURNTRANSFER, true );
    curl_setopt( $ch,CURLOPT_SSL_VERIFYPEER, false );
    curl_setopt( $ch,CURLOPT_POSTFIELDS, json_encode( $fields) );
    $result = curl_exec($ch );
    curl_close( $ch );
?>

Untuk API ACCESS KEY diisi dengan Server key didapat dari projek firebase Anda di Firebase Console .

12. Kemudian kembali lagi ke projek android, kita akan membuat 2 tombol yang berfungsi untuk Subscribe dan Unsubscribe topik notif nantinya. Masuk ke activity_main.xml dan buat 2 Button/Material Button.

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="296dp"
        android:text="Subscribe"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="28dp"
        android:text="Unsubscribe"
        android:backgroundTint="@color/black"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.498"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/button" />
</androidx.constraintlayout.widget.ConstraintLayout>

13. Kemudian pada MainActivity.java tambahkan kode berikut :

public class MainActivity extends AppCompatActivity {
    Button Subscribe, Unsubscribe;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Subscribe = findViewById(R.id.button);
        Unsubscribe = findViewById(R.id.button2);

        Subscribe.setOnClickListener(view -> {
            FirebaseMessaging.getInstance().subscribeToTopic("system").addOnCompleteListener(task -> {
                FirebaseMessaging.getInstance().subscribeToTopic("system");
                String msg = getString(R.string.msg_subscribed); //==> msg_subscribed = "subscribed"
                if (!task.isSuccessful()) {
                    msg = getString(R.string.msg_subscribe_failed); //==> msg_subscribe_failed = "failed"
                }
            });
        });
        Unsubscribe.setOnClickListener(view -> {
            FirebaseMessaging.getInstance().unsubscribeFromTopic("system").addOnCompleteListener(task -> {
               FirebaseMessaging.getInstance().unsubscribeFromTopic("system");
               String msg = getString(R.string.msg_unsubscribed); //msg_unsubscribed = "unsubscribed"
                if (!task.isSuccessful()) {
                    msg = getString(R.string.msg_unsubscribe_failed); //==> msg_unsubscribe_failed = "failed unsubs"
                }
            });
        });
    }
}

14. Jika semua langkah sudah selesai jalan kan program. Klik saja button SUBSCIRBE yang tadi telah dibuat, maka akan muncul notif seperti dibawah ini:

Demikian tutorial membuat push notifikasi android dengan Firebase dan php, cukup praktis bukan?.

Add a Comment

Your email address will not be published. Required fields are marked *