Mengirim pesan ke topik di Web/JavaScript

Berdasarkan model publikasi/langganan, messaging topik FCM dapat digunakan untuk mengirim pesan ke beberapa perangkat yang mengikuti topik tertentu. Anda menulis pesan topik sesuai kebutuhan, dan FMC akan menangani perutean serta mengirimkan pesan dengan baik ke perangkat yang tepat.

Misalnya, pengguna aplikasi perkiraan pasang setempat dapat memilih untuk menerima topik "pemberitahuan arus pasang surut" dan menerima notifikasi tentang kondisi penangkapan ikan air asin yang optimal di area tertentu. Pengguna aplikasi olahraga dapat berlangganan update skor otomatis pertandingan langsung untuk tim favoritnya.

Beberapa hal yang perlu diingat tentang topik:

  • Messaging topik sangat cocok untuk konten seperti cuaca, atau informasi lainnya yang tersedia untuk umum.
  • Pesan topik dioptimalkan untuk throughput, bukan latensi. Untuk pengiriman yang cepat dan aman ke satu perangkat atau sekelompok kecil perangkat, targetkan pesan ke token pendaftaran, bukan topik.
  • Jika Anda perlu mengirim pesan ke beberapa perangkat per pengguna, sebaiknya gunakan messaging grup perangkat untuk kasus penggunaan tersebut.
  • Pengiriman pesan topik mendukung langganan tak terbatas untuk setiap topik. Namun, FCM memberlakukan batasan pada area berikut ini:
    • Satu instance aplikasi hanya dapat berlangganan maksimal 2.000 topik.
    • Jika Anda menggunakan impor batch untuk berlangganan instance aplikasi, setiap permintaan dibatasi ke 1.000 instance aplikasi.
    • Frekuensi langganan baru dibatasi kapasitasnya per project. Jika Anda mengirim terlalu banyak permintaan berlangganan dalam waktu singkat, server FCM akan merespons dengan respons 429 RESOURCE_EXHAUSTED ("kuota terlampaui"). Coba lagi dengan backoff eksponensial.

Membuat aplikasi klien berlangganan topik

Dengan token pendaftaran dan nama topik, Anda dapat menambahkan token ke topik menggunakan API server Google Instance ID. Panggil Instance ID API di endpoint ini dengan memberikan token pendaftaran dan nama topik instance aplikasi:

 https://iid.googleapis.com/iid/v1/<REGISTRATION_TOKEN>/rel/topics/<TOPIC_NAME>

Misalnya, untuk membuat instance aplikasi berlangganan ke topik berjudul "movies", kirim permintaan POST berikut ke endpoint dan tambahkan kunci API server di header autorisasi seperti berikut:

https://iid.googleapis.com/iid/v1/nKctODamlM4:CKrh_PC8kIb7O...clJONHoA/rel/topics/movies
Content-Type:application/json
Authorization:key=AIzaSyZ-1u...0GBYzPu7Udno5aA

Jangan pernah mengirimkan permintaan jenis ini dari klien karena kepekaan kunci server.

Permintaan yang berhasil akan menampilkan HTTP 200 OK. Untuk mengetahui informasi lebih lanjut tentang respons terhadap error dan cara mengirim sekumpulan permintaan, baca bagian Membuat peta hubungan untuk instance aplikasi

Menerima dan menangani pesan topik

FCM mengirim pesan topik dengan cara yang sama seperti pesan downstream lainnya. Cara menangani pesan pada klien bergantung pada status latar depan/latar belakang halaman web dan faktor lain yang dijelaskan di bagian ini.

Perilaku pesan berbeda-beda, tergantung pada apakah halaman berada di foreground (memiliki fokus), di background, tersembunyi di balik tab lain, atau tertutup sepenuhnya. Dalam semua kasus, halaman harus menangani callback onMessage. Namun saat halaman berada di background, Anda mungkin juga perlu menangani setBackgroundMessageHandler atau mengonfigurasi notifikasi tampilan untuk mengizinkan pengguna memindahkan aplikasi web Anda ke foreground.

Status Aplikasi Notification Data Keduanya
Latar depan onMessage onMessage onMessage
Latar belakang (pekerja layanan) Notifikasi yang ditampilkan oleh SDK setBackgroundMessageHandler Notifikasi yang ditampilkan oleh SDK

Menangani pesan ketika aplikasi web berada di latar depan

Untuk menerima peristiwa onMessage, aplikasi Anda harus menentukan pekerja layanan messaging Firebase dalam firebase-messaging-sw.js. Atau, Anda dapat menentukan pekerja layanan yang ada dengan useServiceWorker.

// Give the service worker access to Firebase Messaging.
// Note that you can only use Firebase Messaging here, other Firebase libraries
// are not available in the service worker.
importScripts('https://www.gstatic.com/firebasejs/4.8.1/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/4.8.1/firebase-messaging.js');

// Initialize the Firebase app in the service worker by passing in the
// messagingSenderId.
firebase.initializeApp({
  'messagingSenderId': 'YOUR-SENDER-ID'
});

// Retrieve an instance of Firebase Messaging so that it can handle background
// messages.
const messaging = firebase.messaging();

Ketika aplikasi Anda ada di latar depan (pengguna melihat halaman web), Anda dapat menerima payload data dan notification secara langsung di halaman.

// Handle incoming messages. Called when:
// - a message is received while the app has focus
// - the user clicks on an app notification created by a service worker
//   `messaging.setBackgroundMessageHandler` handler.
messaging.onMessage(function(payload) {
  console.log('Message received. ', payload);
  // ...
});

Menangani pesan saat aplikasi web ada di latar belakang

Semua pesan yang diterima saat aplikasi ada di latar belakang memicu notification tampilan di browser. Anda dapat menentukan pilihan untuk notification ini, seperti judul atau tindakan klik, baik dalam permintaan pengiriman dari server aplikasi Anda, atau menggunakan logika pekerja layanan pada klien.

Mengatur pilihan notification dalam permintaan pengiriman

Untuk pesan notifikasi yang dikirim dari server aplikasi, FCM JavaScript API mendukung kunci click_action. Biasanya hal ini diatur ke halaman dalam aplikasi web Anda:

https://fcm.googleapis.com//v1/projects/<YOUR-PROJECT-ID>/messages:send
Content-Type: application/json
Authorization: bearer <YOUR-ACCESS-TOKEN>

{
  "message": {
    "topic": "matchday"
    "notification": {
      "title": "Background Message Title",
      "body": "Background message body"
    },
    "webpush": {
      "fcm_options": {
        "link": "https://dummypage.com"
      }
    }
  }
}

Jika tindakan klik menunjuk ke halaman yang sudah terbuka di tab browser, klik pada notifikasi akan membawa tab tersebut ke latar depan. Jika halaman belum terbuka, klik pada notifikasi akan membuka halaman di tab baru.

Karena pesan data tidak mendukung click_action, sebaiknya Anda menambahkan payload notifikasi ke semua pesan data. Atau Anda dapat menangani notification menggunakan pekerja layanan.

Penjelasan mengenai perbedaan antara pesan notifikasi dan pesan data dapat dibaca di bagian Jenis pesan.

Menetapkan opsi notifikasi dalam pekerja layanan

Untuk pesan notification dan pesan data, Anda dapat menyetel pilihan notification dalam pekerja layanan. Pertama, inisialisasikan aplikasi Anda dalam pekerja layanan:

// Give the service worker access to Firebase Messaging.
// Note that you can only use Firebase Messaging here, other Firebase libraries
// are not available in the service worker.
importScripts('https://www.gstatic.com/firebasejs/4.8.1/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/4.8.1/firebase-messaging.js');

// Initialize the Firebase app in the service worker by passing in the
// messagingSenderId.
firebase.initializeApp({
  'messagingSenderId': 'YOUR-SENDER-ID'
});

// Retrieve an instance of Firebase Messaging so that it can handle background
// messages.
const messaging = firebase.messaging();

Untuk mengatur pilihan, panggil setBackgroundMessageHandler di firebase-messaging-sw.js. Dalam contoh ini, kita menetapkan pilihan untuk judul, isi, ikon, dan tindakan klik.

messaging.setBackgroundMessageHandler(function(payload) {
  console.log('[firebase-messaging-sw.js] Received background message ', payload);
  // Customize notification here
  var notificationTitle = 'Background Message Title';
  var notificationOptions = {
    body: 'Background Message body.',
    icon: '/firebase-logo.png'
  };

  return self.registration.showNotification(notificationTitle,
    notificationOptions);
});

Membuat permintaan kirim

Dari sisi server, mengirim pesan ke topik Firebase Cloud Messaging sangat mirip dengan mengirim pesan ke setiap perangkat atau ke grup pengguna. Server aplikasi menetapkan kunci to dengan nilai seperti /topics/yourTopic. Developer bisa memilih nama topik apa pun yang cocok dengan ekspresi reguler: "/topics/[a-zA-Z0-9-_.~%]+".

Permintaan HTTP POST topik

Mengirim ke 1 topik:

https://fcm.googleapis.com/fcm/send
Content-Type:application/json
Authorization:key=AIzaSyZ-1u...0GBYzPu7Udno5aA
{
  "to" : "/topics/foo-bar",
  "priority" : "high",
  "notification" : {
    "body" : "This is a Firebase Cloud Messaging Topic Message!",
    "title" : "FCM Message",
  }
}

Respons HTTP topik

//Success example:
{
  "message_id": "1023456"
}

//failure example:
{
  "error": "TopicsMessageRateExceeded"
}

Pesan XMPP topik

Mengirim ke 1 topik:

<message id="">
  <gcm xmlns="google:mobile:data">
{
  "to" : "/topics/foo-bar",
  "priority" : "high",
  "notification" : {
    "body" : "This is a Firebase Cloud Messaging Topic Message!",
    "title" : "FCM Message",
  }
}
  </gcm>
</message>

Respons XMPP topik

//Success example:
{
  "message_id": "1023456"
}

//failure example:
{
  "error": "TopicsMessageRateExceeded"
}

Langkah berikutnya

Kirim masukan tentang...

Butuh bantuan? Kunjungi halaman dukungan kami.