如何使用 Firebase (FCM) 發送 Web 推送通知？

已發表: 2021-12-29

為了促進其在 Web、IOS 和 Android 上的通知服務，Firebase 使用雲服務。 Firebase 雲消息傳遞 (FCM)通過為每個設備生成唯一令牌並隨後使用這些令牌向相應設備發送消息來運行。 為了發送網絡推送通知，Firebase 使用 javascript 生成令牌。

在此博客中，您將了解有關如何實現網絡推送通知 firebase的所有信息。

什麼是 Firebase 雲消息傳遞？

什麼是 Firebase 雲消息傳遞

Firebase Cloud Messaging 是 Google 的免費移動通知服務。 它允許第三方應用程序開發人員從 Google Cloud Messaging (GCM) 服務器向其用戶發送通知。 這使您能夠實時通知用戶可用於同步的各種數據。

它將用戶應用程序的消息上游發送到 FCM 服務器，將 FCM 服務器的消息下游發送到用戶的應用程序。 您可以使用 FCM 來吸引、保留和重新定位您的用戶，無論他們身在何處。

使用 firebase 發送網絡推送通知有什麼好處？

以下是從 firebase 發送網絡推送通知的好處。

  • 免費開始：您無需向 Google 付費即可使用 FCM 推送通知服務。 此外，它很容易擴展。  
  • 無需擔心權限：由於 FCM 庫使用清單合併，它會自動添加所需的任何權限。 這減少了您需要付出的努力。
  • 簡化註冊： FCM 用於將消息傳遞到設備的地址稱為“註冊令牌”。 這個過程現在已經異步了。 Google 圖書館會自動為您分配一個令牌。 因此，當您請求令牌時，您會收到一個註冊令牌。 要開始消息傳遞，您只需將此令牌發送到您的服務器。
  • 易於實施：實施 FCM 既快速又簡單。 由於其直觀的 API 在單個 SDK 中可用，您可以立即解決客戶的問題，而無需構建複雜的基礎架構。
  • 分析：您可以從 Firebase 免費獲得無限制的分析。 您可以獲得有關用戶應用使用情況、廣告點擊次數等的寶貴數據。 其他 Firebase 功能可與 Firebase Analytics 配合使用。 所以，你可以對所有事情採取行動。
  • 跨平台支持：由於 API 在用於 C++、JavaScript、Android 和 iOS 的單個 SDK 中可用，因此您可以將其擴展到各種平台，而無需更改您的基礎架構。
  • 常見主題消息傳遞：當您想要通知對特定主題感興趣的用戶時，您只需將消息發佈到 FCM。 FCM 會將其發送給所有訂閱該主題的用戶。 最好的事情是它對主題消息傳遞沒有任何限制。
  • 不同的主題消息傳遞： FCM 還允許客戶細分向他們發送相關消息。 例如，如果您向用戶發送與交通相關的通知，那麼您在城市 A 中的用戶將收到僅與他們所在城市相關的交通信息，而在城市 B 中的用戶將僅收到與其城市相關的交通信息。

如何使用 Firebase 發送網絡推送通知？

以下是幫助您實施網絡推送通知 Firebase 的分步說明。

1.註冊 Firebase 應用

註冊-Firebase-App
  1. 訪問此鏈接 https://console.firebase.google.com/u/0/ 並按“添加項目”標籤。
  2. 給項目名稱並選擇國家。 然後按“創建項目”選項卡。 Google 將檢查項目名稱的可用性和唯一性。
  3. 現在點擊“接受條款和條件”標籤繼續。 您的項目將在
  4. 幾秒鐘。
  5. 現在將您的 Android/IOS/Web/Unity 應用程序添加到您的項目中。 由於此博客專注於Web 推送通知 Firebase ，您需要單擊顯示為 </> 的 Web 圖標繼續。
  6. 給你的應用一個暱稱。 此暱稱僅供用戶使用。 因此，您可以使用此功能來促進更好地區分項目中的應用程序以供內部使用。
  7. 如果您的項目未在 HTTPS 服務器上運行，請為其添加託管。 如果沒有，請跳過此步驟。
  8. 現在點擊“註冊應用程序”。  
  9. 現在您的應用已註冊，您將收到一個Firebase SDK，它是一個代碼。 複製此代碼

向下。 它將在接下來的部分中使用。 如果您現在不復制它，您可以從“設置”部分中檢索它。

2. 將 Firebase 添加到您的項目中

將firebase添加到您的項目
  1. 轉到儀表板。 在側邊欄上，您會找到“設置”圖標。 點擊它。 在顯示的菜單中，單擊項目設置。
  2. 當設置頁面（常規設置）打開時，向下滾動到頁面底部並複制為所選 CDN 顯示的代碼。
  3. 最後在您的 HTML 文件中包含以下代碼。 還包括用於 firebase 消息傳遞的 CDN 腳本。

< script src = “https://www.gstatic.com/firebasejs/8.3.2/firebase-app.js” > </script>

<script src = “https://www.gstatic.com/firebasejs/8.3.2/firebase-analytics.js” > </script>

3、運營Firebase服務

1. 對於頂部提到的代碼，添加底部給出的代碼，在你找到 // Initialize Firebase 之後。

// 初始化 Firebase

firebase.initializeApp(firebaseConfig);const 消息傳遞=firebase.messaging(); //自定義函數運行firebase服務

  getStartToken(); //如果在瀏覽器中打開與項目相同的選項卡，則此代碼從服務器/您的應用程序接收消息並將消息打印到控制台

messing.onMessage(function(payload){console.log(“onMessage”,payload);});

2. 您可以將底部的代碼寫入 HTML 頁面中的單獨 js 文件中，也可以將其附加到 <script> 標記中頂部的代碼中。

messing.getToken()是一個用於使用 Firebase SDK 檢索令牌的函數。 如果找到令牌，則將其發送到服務器進行存儲，否則通過 RequestPermission() 函數尋求用戶的許可。

setTokenSentToServer()是另一個利用本地存儲分配 1 作為 sendTokenToServer 的值的函數，以防令牌已經發送到服務器，0 以防令牌發送到服務器時發生錯誤而未發送到服務器服務器或從 firebase SDK 中檢索。

4. 從項目發送通知

從項目發送消息

現在您需要從項目發送通知的所有內容都已準備就緒，以下是有關如何向您知道其令牌的最終用戶發送通知的詳細信息 -

1. 最初，您需要接收服務密鑰。 執行以下步驟-

  • 打開 Firebase 控制台
  • 點擊項目設置
  • 點擊“雲消息”
  • 您將在服務器密鑰字段中找到一個代碼。 複製它。

2.發送推送通知

讓我們使用郵遞員平台從 Firebase 發送網絡推送通知。 以下是您需要做的事情是-

3.設置POST請求類型。

4.輸入網址：https://fcm.googleapis.com/fcm/send

5. 單擊標題部分。

您需要填寫兩個標題，即授權和內容類型。

· 授權：粘貼您複製的服務器密鑰。

· 內容類型：application/JSON（JavaScript Object Notation）

6. 現在點擊打開正文部分。 粘貼 Firebase 在用戶註冊時檢索到的用戶令牌。

7. 現在發送請求。 您將能夠從服務器向您的用戶發送推送通知。

請注意，當您向用戶發送第一個推送通知時，網絡瀏覽器將請求他/她允許接收您的通知。 只有當他/她授予許可時，您才能持續發送推送。 您可以按照我們的推送通知提示確保您的用戶授予他/她的權限。

總結您現在已經明白，使用 Firebase 發送網絡推送通知並不像看起來那麼困難。 它不需要很多資源，也不需要太多時間。 此外，使用 網絡推送通知 Firebase不會影響您的網站維護或網絡應用程序的費用。 如果您仍需要有關其功能的更多詳細信息，請閱讀 Firebase 文檔。

參觀產品

另請閱讀：

  • Web 推送通知的 7 個被高估的因素
  • 網絡推送通知 | 直接電子郵件營銷策略
  • 營銷人員需要知道的 41 個 Web 推送通知統計信息
  • 2022 年 15 款最佳推送通知軟件和工具{比較}
  • Web 推送通知如何比其他營銷媒介更有效？