با Firebase Cloud Messaging شروع کنید


این راهنمای سریع نحوه راه‌اندازی Firebase Cloud Messaging را در برنامه‌های موبایل و کلاینت وب شما شرح می‌دهد تا بتوانید پیام‌ها را به طور قابل اعتمادی ارسال کنید. برای محیط‌های سرور، به بخش Your server environment and FCM مراجعه کنید.

یک برنامه Firebase Cloud Messaging راه‌اندازی کنید

API جاوا اسکریپت FCM به شما امکان می‌دهد پیام‌های اعلان را در برنامه‌های وب که در مرورگرهایی که از Push API پشتیبانی می‌کنند، دریافت کنید. این شامل نسخه‌های مرورگر ذکر شده در این ماتریس پشتیبانی و افزونه‌های کروم با استفاده از Push API می‌شود.

FCM SDK فقط در صفحاتی که از طریق HTTPS ارائه می‌شوند پشتیبانی می‌شود. این به دلیل استفاده از service workerها است که فقط در سایت‌های HTTPS در دسترس هستند. اگر به ارائه‌دهنده نیاز دارید، Firebase App Hosting توصیه می‌شود و یک سطح رایگان برای میزبانی HTTPS در دامنه خودتان ارائه می‌دهد.

برای شروع کار با API جاوا اسکریپت FCM ، باید Firebase را به برنامه وب خود اضافه کنید و منطق دسترسی به توکن‌های ثبت نام را اضافه کنید.

اضافه کردن و مقداردهی اولیه FCM SDK

  1. اگر هنوز این کار را نکرده‌اید، Firebase JS SDK را نصب کنید و Firebase را مقداردهی اولیه کنید .

  2. کیت توسعه نرم‌افزاری (SDK) مربوط به Firebase Cloud Messaging JS را اضافه کنید و Firebase Cloud Messaging را مقداردهی اولیه کنید:

Web

import { initializeApp } from "firebase/app";
import { getMessaging } from "firebase/messaging";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);


// Initialize Firebase Cloud Messaging and get a reference to the service
const messaging = getMessaging(app);

Web

import firebase from "firebase/compat/app";
import "firebase/compat/messaging";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  // ...
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);


// Initialize Firebase Cloud Messaging and get a reference to the service
const messaging = firebase.messaging();

اگر از FCM برای وب استفاده می‌کنید و می‌خواهید به SDK 6.7.0 یا بالاتر ارتقا دهید، باید API ثبت FCM را برای پروژه خود در Google Cloud فعال کنید. هنگام فعال کردن API، مطمئن شوید که با همان حساب گوگلی که برای Firebase استفاده می‌کنید، به Cloud Console وارد شده‌اید و مطمئن شوید که پروژه صحیح را انتخاب کرده‌اید. پروژه‌های جدیدی که FCM SDK را اضافه می‌کنند، این API را به طور پیش‌فرض فعال می‌کنند.

پیکربندی اعتبارنامه‌های وب با FCM

رابط وب FCM از اعتبارنامه‌های وب به نام Voluntary Application Server Identification یا کلیدهای VAPID برای تأیید ارسال درخواست‌ها به سرویس‌های پشتیبانی‌شده‌ی ارسال اعلان‌های وب استفاده می‌کند. برای عضویت در برنامه‌ی خود برای ارسال اعلان‌ها، باید یک جفت کلید را با پروژه‌ی Firebase خود مرتبط کنید. می‌توانید یک جفت کلید جدید ایجاد کنید یا جفت کلید موجود خود را از طریق کنسول Firebase وارد کنید.

یک جفت کلید جدید ایجاد کنید

  1. تب Cloud Messaging را از پنل تنظیمات کنسول Firebase باز کنید و به بخش پیکربندی وب بروید.
  2. در تب گواهی‌های Web Push ، روی Generate Key Pair کلیک کنید. کنسول اعلانی مبنی بر تولید جفت کلید و رشته کلید عمومی و تاریخ اضافه شدن آن را نمایش می‌دهد.

یک جفت کلید موجود را وارد کنید

اگر یک جفت کلید موجود دارید که از قبل با برنامه وب خود استفاده می‌کنید، می‌توانید آن را به FCM وارد کنید تا بتوانید از طریق APIهای FCM به نمونه‌های برنامه وب موجود خود دسترسی پیدا کنید. برای وارد کردن کلیدها، باید دسترسی سطح مالک به پروژه Firebase داشته باشید. کلید عمومی و خصوصی موجود خود را به صورت رمزگذاری شده با URL پایه 64 وارد کنید:

  1. تب Cloud Messaging را از پنل تنظیمات کنسول Firebase باز کنید و به بخش پیکربندی وب بروید.
  2. در برگه گواهی‌های Web Push ، عبارت link text: import an existing key pair را پیدا کرده و انتخاب کنید.
  3. در پنجره‌ی «وارد کردن یک جفت کلید» ، کلیدهای عمومی و خصوصی خود را در فیلدهای مربوطه وارد کرده و روی «وارد کردن» کلیک کنید. کنسول، رشته‌ی کلید عمومی و تاریخ اضافه شدن را نمایش می‌دهد.

برای دستورالعمل‌های مربوط به نحوه افزودن کلید به برنامه خود، به پیکربندی اعتبارنامه‌های وب در برنامه خود مراجعه کنید. برای اطلاعات بیشتر در مورد قالب کلیدها و نحوه تولید آنها، به کلیدهای سرور برنامه مراجعه کنید.

پیکربندی اعتبارنامه‌های وب در برنامه شما

متد getToken(): Promise<string> به FCM اجازه می‌دهد تا هنگام ارسال درخواست‌های پیام به سرویس‌های مختلف push، از کلید VAPID برای اعتبارنامه استفاده کند. با استفاده از کلیدی که طبق دستورالعمل‌های موجود در Configure Web Credentials with FCM تولید یا وارد کرده‌اید، آن را پس از بازیابی شیء messaging به کد خود اضافه کنید:

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

const messaging = getMessaging();
// Add the public key generated from the console here.
getToken(messaging, {vapidKey: "BKagOny0KF_2pCJQ3m....moL0ewzQ8rZu"});

دسترسی به توکن ثبت نام

وقتی نیاز دارید توکن ثبت نام فعلی را برای یک نمونه برنامه بازیابی کنید، ابتدا مجوزهای اعلان را با Notification.requestPermission() از کاربر درخواست کنید. وقتی همانطور که نشان داده شده است فراخوانی شود، در صورت اعطای مجوز، یک توکن برمی‌گرداند یا در صورت رد شدن، promise را رد می‌کند:

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

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

// 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. در کنسول فایربیس، صفحه پیام‌رسانی (Messaging) را باز کنید.
  4. اگر این اولین پیام شماست، گزینه «ایجاد اولین کمپین» را انتخاب کنید.
    1. پیام‌های اعلان فایربیس و سپس ایجاد را انتخاب کنید.
  5. در غیر این صورت، در برگه کمپین‌ها ، کمپین جدید و سپس اعلان‌ها را انتخاب کنید.
  6. متن پیام را وارد کنید.
  7. از پنل سمت راست، گزینه ارسال پیام آزمایشی را انتخاب کنید.
  8. در فیلدی با عنوان « افزودن یک توکن ثبت نام FCM ، توکن ثبت نام خود را وارد کنید.
  9. آزمون را انتخاب کنید.

پس از انتخاب Test ، دستگاه کلاینت مورد نظر، با برنامه در پس‌زمینه، باید اعلان را دریافت کند.

مراحل بعدی

پس از اتمام مراحل راه‌اندازی، در اینجا چند گزینه برای ادامه کار با FCM برای وب (جاوااسکریپت) ارائه شده است: