ส่งข้อความทดสอบไปยังแอปพื้นหลัง

ในการเริ่มต้นใช้งาน FCM ให้สร้างกรณีการใช้งานที่ง่ายที่สุด: ส่งข้อความแจ้งเตือนไปยังผู้ใช้เฉพาะเมื่อแอปอยู่ในพื้นหลังบนอุปกรณ์ หน้านี้แสดงขั้นตอนทั้งหมดเพื่อให้บรรลุสิ่งนี้ ตั้งแต่การตั้งค่าไปจนถึงการตรวจสอบ ซึ่งอาจครอบคลุมขั้นตอนที่คุณได้ทำไปแล้วหากคุณได้ ตั้งค่าแอปไคลเอนต์ JavaScript สำหรับ FCM

ตั้งค่า SDK

หากคุณยังไม่ได้ เพิ่ม Firebase ในโครงการ JavaScript ของคุณ

เข้าถึงโทเค็นการลงทะเบียน

เมื่อคุณต้องการดึงโทเค็นการลงทะเบียนปัจจุบันสำหรับอินสแตนซ์ของแอป ก่อนอื่นให้ขอสิทธิ์การแจ้งเตือนจากผู้ใช้ด้วย Notification.requestPermission() เมื่อเรียกตามที่แสดง จะส่งคืนโทเค็นหากได้รับอนุญาตหรือปฏิเสธสัญญาหากถูกปฏิเสธ:

function requestPermission() {
  console.log('Requesting permission...');
  Notification.requestPermission().then((permission) => {
    if (permission === 'granted') {
      console.log('Notification permission granted.');

FCM ต้องการไฟล์ firebase-messaging-sw.js เว้นแต่ว่าคุณมีไฟล์ firebase-messaging-sw.js แล้ว ให้สร้างไฟล์เปล่าที่มีชื่อนั้นและวางไว้ในรูทของโดเมนของคุณก่อนที่จะดึงโทเค็น คุณสามารถเพิ่มเนื้อหาที่มีความหมายลงในไฟล์ได้ในภายหลังในกระบวนการตั้งค่าไคลเอ็นต์

ในการดึงโทเค็นปัจจุบัน:

Web version 9

import { getMessaging, getToken } from "firebase/messaging";

// Get registration token. Initially this makes a network call, once retrieved
// subsequent calls to getToken will return from cache.
const messaging = getMessaging();
getToken(messaging, { vapidKey: '<YOUR_PUBLIC_VAPID_KEY_HERE>' }).then((currentToken) => {
  if (currentToken) {
    // Send the token to your server and update the UI if necessary
    // ...
  } else {
    // Show permission request UI
    console.log('No registration token available. Request permission to generate one.');
    // ...
  }
}).catch((err) => {
  console.log('An error occurred while retrieving token. ', err);
  // ...
});

Web version 8

// Get registration token. Initially this makes a network call, once retrieved
// subsequent calls to getToken will return from cache.
messaging.getToken({ vapidKey: '<YOUR_PUBLIC_VAPID_KEY_HERE>' }).then((currentToken) => {
  if (currentToken) {
    // Send the token to your server and update the UI if necessary
    // ...
  } else {
    // Show permission request UI
    console.log('No registration token available. Request permission to generate one.');
    // ...
  }
}).catch((err) => {
  console.log('An error occurred while retrieving token. ', err);
  // ...
});

หลังจากที่คุณได้รับโทเค็นแล้ว ให้ส่งไปยังเซิร์ฟเวอร์แอปของคุณและจัดเก็บโดยใช้วิธีการที่คุณต้องการ

ส่งข้อความแจ้งเตือนการทดสอบ

  1. ติดตั้งและเรียกใช้แอปบนอุปกรณ์เป้าหมาย

  2. ตรวจสอบให้แน่ใจว่าแอปอยู่ในพื้นหลังบนอุปกรณ์

  3. เปิดตัว แต่งการแจ้งเตือน และเลือกการ แจ้งเตือนใหม่

  4. ป้อนข้อความ

  5. เลือก ส่งข้อความทดสอบ

  6. ในฟิลด์ชื่อ เพิ่มโทเค็นการลงทะเบียน FCM ให้ป้อนโทเค็นการลงทะเบียนที่คุณได้รับในส่วนก่อนหน้าของคู่มือนี้

  7. คลิก ทดสอบ

หลังจากที่คุณคลิก ทดสอบ อุปกรณ์ไคลเอ็นต์เป้าหมาย (โดยมีแอปอยู่ในพื้นหลัง) ควรได้รับการแจ้งเตือนในเบราว์เซอร์

ขั้นตอนถัดไป

ส่งข้อความไปยังแอพเบื้องหน้า

เมื่อคุณส่งข้อความแจ้งเตือนได้สำเร็จในขณะที่แอปของคุณอยู่ในพื้นหลัง โปรดดูที่ รับข้อความในไคลเอ็นต์ JavaScript เพื่อเริ่มต้นส่งไปยังแอปที่อยู่เบื้องหน้า

ไปไกลกว่าข้อความแจ้งเตือน

หากต้องการไปไกลกว่าข้อความแจ้งเตือนและเพิ่มลักษณะการทำงานขั้นสูงอื่นๆ ในแอปของคุณ โปรดดูที่: