Tutorial Membuat Notifikasi Firebase Ionic

Tutorial Membuat Notifikasi Firebase Ionic

Tutorial Membuat Notifikasi Firebase Ionic

Pelajaran ini, kita akan mempelajari Tutorial Membuat Notifikasi Firebase Ionic cara mengintegrasikanĀ firebase cloud messaging (FCM)Ā dengan proyek ionik Anda.Ā Untuk penyiapan notifikasi push, kami akan menggunakan pluginĀ https://github.com/arnesson/cordova-plugin-firebase

Buat proyek ionik baru atau Anda dapat memilih proyek yang sudah ada

ionic start ionPush blank

cd ionPush

Sebelum menambahkan platform dan plugin, kami perlu mendownloadĀ google-services.json dari proyek firebase Anda.Ā Masuk ke akun firebase & pilih proyek Anda, lalu tambahkan platform android untuk proyek firebase Anda.

Isi nama paket Anda & klik Daftar Aplikasi

http://159.65.156.88/wp-content/uploads/2020/07/add-android-project.png

Unduh google-services.json

http://159.65.156.88/wp-content/uploads/2020/07/download-google-service.png

Setelah mengunduh google-services.json Anda perlu pindah ke folder root

!!!Ā Penting !!!Ā Sebelum menambahkan plugin, kami perlu menyalin & menempelkan google-service.json yang telah diunduh keĀ folder root proyekĀ AndaĀ ;Ā tidak di dalam src atau www

Tambahkan platform, plugin, dan modul npm

ionic cordova platform add android

ionic cordova plugin add cordova-plugin-firebase

npm install –save @ionic-native/firebase

Saat Anda membangun proyek, mungkin perlu beberapa menit untuk mengunduh dependensi & konfigurasi.

Kode Pemberitahuan Push Firebase Ionic

Sertakan modul plugin firebase di app.module.ts;

app.module.ts

import { Firebase } from ‘@ionic-native/firebase’;

.

.

.

providers: [

StatusBar,

SplashScreen,

Firebase,

{provide: ErrorHandler, useClass: IonicErrorHandler}

]

kita perlu bekerja dengan app.component.ts untuk mendaftarkan perangkat kita dengan server firebase menggunakan metode getToken ().

app.component.ts

import { Firebase } from ‘@ionic-native/firebase’;

.

.

.

constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen, firebase: Firebase) {

platform.ready().then(() => {

firebase.getToken().then(token => console.log(token)).catch(err=> console.log(err));

firebase.onNotificationOpen().subscribe(data=>{

console.log(data);

console.log(data.name)

}, err=> console.log(err));

});

}

kami membuat objek firebase dari Firebase plugin.firebase.getToken () memungkinkan Anda menerima pushToken untuk aplikasi tertentu pada pemicu device.firebase.onNotificationOpen (), saat pengguna mengeklik notifikasi dari bilah notifikasi!Ā data adalah objek JSON yang diterima dari server.

Baca Juga  PAGE BREAKS

Mengirim notifikasi dari Firebase

Buka opsi perpesanan cloud firebase Anda, klik pesan baru & isi detail yang diperlukan, lalu klik kirim pesan. Anda juga dapat menambahkan data khusus jika diperlukan.

http://159.65.156.88/wp-content/uploads/2020/07/sendpush.png

Karena kami menulis kode untuk menampilkan token dan pesan di konsol.Ā di sini saya telah melampirkan screenshot dari konsol

http://159.65.156.88/wp-content/uploads/2020/07/firebase-fcm-ionic-integration-1024x302-1.png

http://159.65.156.88/wp-content/uploads/2020/07/ionic-push-notification.png

 

Tinggalkan Komentar

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Need Help? Chat with us