在 iOS 應用程式中新增推播通知

1. 簡介

上次更新時間：2020 年 1 月 6 日

Firebase 雲端通訊 (FCM) 是跨平台的訊息傳遞解決方案，能以可靠的方式傳送訊息，而且無須額外付費。

使用 FCM 時，您可以通知用戶端應用程式有新電子郵件或其他資料可以同步處理。您可以傳送通知訊息，吸引使用者再次參與並提升留存率。針對即時通訊等用途，訊息可以將最大 4 KB 的酬載傳輸到用戶端應用程式。

運作方式

實作 FCM 包括傳送和接收兩個主要元件：

  1. 受信任的環境，例如 Cloud Functions for Firebase 或應用程式伺服器，可在其中建構、指定及傳送訊息。
  2. 一種 iOS、Android 或網路 (JavaScript) 用戶端應用程式，可透過對應的平台專用傳輸服務接收訊息。

FCM 架構總覽

6636933bbe959ef2.png

FCM 仰賴以下元件組合，這些元件用於建構、傳輸及接收訊息：

  1. 撰寫或建構訊息要求的工具。通知編輯器提供以 GUI 為基礎的選項，可用於建立通知要求。如要全面自動化及支援所有訊息類型，您必須在支援 Firebase Admin SDK 或 FCM 伺服器通訊協定的受信任伺服器環境中建立訊息要求。這個環境可以是 Cloud Functions for Firebase、Google App Engine 或您自己的應用程式伺服器。
  2. FCM 後端 (還有其他函式) 會接收訊息要求、透過主題展開訊息，並產生訊息 ID 等訊息中繼資料。
  3. 平台層級傳輸層，可將訊息轉送至指定裝置、處理訊息傳送作業，以及視情況套用平台專屬的設定。這個傳輸層包括：
  • 搭載 Google Play 服務的 Android 裝置適用的 Android 傳輸層 (ATL)
  • iOS 裝置適用的 Apple 推播通知服務 (APN)
  • 網頁應用程式的網路推送通訊協定
  1. 使用者裝置上的 FCM SDK，會顯示通知，或根據應用程式的前景/背景狀態及任何相關的應用程式邏輯處理訊息。

建構項目

在這個程式碼研究室中，您要使用 FCM 的範例 iOS 應用程式新增推播通知。

課程內容

  • 如何為使用者訂閱及取消訂閱推送訊息
  • 如何處理傳入的推送訊息
  • 如何顯示通知
  • 如何回應通知點擊

軟硬體需求

  • Xcode 11.0 以上版本
  • CocoaPods 1.9.0 以上版本
  • Apple 開發人員帳戶
  • 執行應用程式的實體 iOS 裝置
  • Swift 的基本知識

2. 開始設定

下載程式碼範例

在本程式碼研究室中，您將建構自己的測試應用程式，但如果您想查看並執行現有的範例應用程式，可以下載快速入門導覽課程程式碼範例。

取得範例的方式有兩種：

  • 複製 Git 存放區：
$ git clone https://github.com/firebase/quickstart-ios.git
  • 下載 ZIP 檔案：

如果將來源下載為 ZIP 檔案，解壓縮後就會取得根資料夾 quickstart-ios。

建立新的應用程式

請按照下列步驟建立自己的測試應用程式 (詳細步驟請見 XCode 12.3)：

  1. 開啟 XCode 並選取「Create a new Xcode project」。
  2. 選取「應用程式」，然後點選「下一步」。

e56c631b086c6d8.png

  1. 輸入 Product Name (例如MessagingExample)
  2. 選取「Team」 (如果您尚未建立團隊，請在 Apple 開發人員帳戶中設定團隊)。
  3. 輸入機構 ID (例如com.your-name)
  4. 輸入 Bundle Identifier (例如com.your-name.MessagingExample，此 ID 在所有 iOS 應用程式中均不得重複)。
  5. 在「Interface」下拉式選單中選取「Storyboard」。
  6. 在「Life Cycle」下拉式選單中選取「UIKit App Delegate」。
  7. 在「Language」(語言) 部分選取「Swift」SwiftSwift。
  8. 點選「下一步」。

fb860c0fa4a02818.png

建立 APN 金鑰並將應用程式註冊至 Firebase 專案時，您會需要軟體包 ID。

3. 設定 APN

建立驗證金鑰

本節說明如何為已啟用推播通知的應用程式 ID 產生驗證金鑰。如果已有金鑰，您可以使用該金鑰，不必產生新的金鑰。

如何建立驗證金鑰：

  1. 在開發人員帳戶中前往「憑證、ID 與」設定檔，然後前往「Keys」(金鑰)。

19ae87d0f00402b1.png

  1. 按一下右上角的「新增」按鈕 (+)。

c4acd10dbc4f721f.png

  1. 輸入 APN 驗證金鑰的說明
  2. 在「金鑰服務」下方，勾選「APN」核取方塊，然後按一下「繼續」。

6a3e8ff7457a8251.png

  1. 依序按一下「Register」和「Download」。請將金鑰保存在安全的地方。此為一次性下載，之後將無法擷取此金鑰。

42c205e072fbd622.png

建立應用程式 ID

應用程式 ID 是專門用來識別應用程式的識別碼。慣例是由反向網域所代表。

  1. 前往 Apple Developer Member Center 並登入帳戶。
  2. 前往「Certificates, Identifiers and Profiles」(憑證、ID 和設定檔)。
  3. 前往「ID」。
  4. 按一下「+」按鈕建立新的應用程式 ID。e04fc394c52a866f.png
  5. 選取「應用程式 ID」圓形按鈕，然後按一下「繼續」。

d454fd5df3b8d93d.png

  1. 選取「應用程式」，然後按一下「繼續」。

3bd2e836be5e0291.png

  1. 如要建立新的應用程式 ID，請按照下列步驟操作：
  2. 輸入應用程式 ID 的「名稱」。
  3. 輸入團隊 ID。這個值必須與「會員資格」分頁中的團隊 ID 相符。
  4. 在「應用程式 ID 後置字串」部分中選取「明確應用程式 ID」，然後輸入您的軟體包 ID。7363c4d1962b486d.png
  5. 在「應用程式服務」部分中，確認已勾選「推播通知」。552ea08703f7e323.png
  6. 按一下「繼續」，確認輸入內容正確無誤：
  7. 「Identifier」的值應與團隊 ID 值和軟體包 ID 的串連值相符
  8. 推播通知應為「可設定」
  9. 按一下「Register」，建立應用程式 ID。

建立設定檔

如要在開發期間測試應用程式，您必須取得開發用設定檔，授權裝置執行尚未發布至 App Store 的應用程式。

  1. 前往 Apple Developer Member Center 並登入帳戶。
  2. 前往「Certificates, Identifiers and Profiles」(憑證、ID 和設定檔)。
  3. 在左上角的下拉式選單中，選取「iOS、tvOS、watchOS」 (如果尚未選取)，請前往「Profiles」。
  4. 按一下「+」按鈕，建立新的設定檔。1fa2342cfe45a925.png
  5. 選取「iOS App Development」做為佈建設定檔類型，然後按一下「繼續」。

507434a466220dfe.png

  1. 在下拉式選單中，選取您要使用的應用程式 ID，然後按一下「繼續」。
  2. 選取您在上一個步驟中所選擇的應用程式 ID 的 iOS 開發憑證，然後按一下 [繼續]。
  3. 選取您要納入佈建設定檔的 iOS 裝置，然後按一下 [繼續]。請務必選取所有要用於測試的裝置。
  4. 輸入這個佈建設定檔的名稱 (例如 MessagingExampleProfile)，然後按一下「產生」。

4395f04647afa997.png

  1. 點選 [下載]，將佈建設定檔儲存到 Mac。

106761fa786ba580.png

  1. 按兩下佈建設定檔即可安裝。

4. 將 Firebase 新增至您的 iOS 專案

建立 Firebase 專案

您必須先建立要連結至 iOS 應用程式的 Firebase 專案，才能將 Firebase 加進 iOS 應用程式。如要進一步瞭解 Firebase 專案，請參閱「瞭解 Firebase 專案」一文。

  1. 在 Firebase 控制台中，按一下「新增專案」，然後選取或輸入「專案名稱」。e462afd91c149238.png

如果您有現有的 Google Cloud Platform (GCP) 專案，可以從下拉式選單中選取該專案，將 Firebase 資源新增至該專案。

  1. (選用) 如要建立新專案，您可以編輯專案 ID。

Firebase 會自動為你的 Firebase 專案指派專屬 ID。請前往「瞭解 Firebase 專案」頁面，瞭解 Firebase 如何使用專案 ID。

  1. 按一下「繼續」。
  2. 為專案設定 Google Analytics，以便使用下列任一 Firebase 產品，享有最佳體驗：
  • Firebase Crashlytics
  • Firebase 預測
  • Firebase 雲端通訊
  • Firebase 應用程式內通訊
  • Firebase 遠端設定
  • Firebase A/B 測試

看到提示時，請選擇使用現有的 Google Analytics 帳戶或建立新帳戶。如果您選擇建立新帳戶，請選取 Analytics 報表位置，然後接受專案的資料共用設定和 Google Analytics 條款。

1282a798556779ab.png

48ade68c8de27d2.png

  1. 按一下「建立專案」。如果使用現有的 GCP 專案，請按一下「新增 Firebase」。

Firebase 會自動為你的 Firebase 專案佈建資源。程序完成後，系統就會將您帶往 Firebase 控制台中 Firebase 專案的總覽頁面。

向 Firebase 註冊應用程式

建立 Firebase 專案後，您可以在專案中新增 iOS 應用程式。

如要進一步瞭解在 Firebase 專案中新增應用程式的最佳做法和注意事項，包括如何處理多個建構變數，請參閱「瞭解 Firebase 專案」一文。

  1. 前往 Firebase 主控台。
  2. 在專案總覽頁面中間，按一下「iOS」iOS圖示來啟動設定工作流程。

已在 Firebase 專案中加入應用程式，點選「新增應用程式」即可顯示平台選項。

93462beb642e8987.png

  1. 在「iOS 軟體包 ID」欄位中輸入應用程式的軟體包 ID。
  2. (選用) 輸入其他應用程式資訊：「應用程式暱稱」和「App Store ID」。
  3. 按一下 [Register app] (註冊應用程式)。

2e7a00b0008344c1.png

新增 Firebase 設定檔

  1. 點選「Download GoogleService-Info.plist」，取得 Firebase iOS 設定檔 (GoogleService-Info.plist)。69004caf7d448989.png
  2. 將設定檔移至 Xcode 專案的根目錄。如果出現提示，請選擇將設定檔新增至所有目標。

7c5e0a46d07fa9c7.png

如果專案中有多個軟體包 ID，請務必在 Firebase 控制台中將每個軟體包 ID 與已註冊的應用程式建立關聯，讓每個應用程式擁有專屬的 GoogleService-Info.plist 檔案。

關閉 XCode。

在應用程式中新增 Firebase SDK

我們建議使用 CocoaPods 安裝 Firebase 程式庫。不過，如果您不想使用 CocoaPods，可以直接整合 SDK 架構，或使用 Swift Package Manager Beta 版。

  1. 如果您尚未建立 Podfile，請建立一個。如果您使用的是快速入門導覽課程範例，則其中的 Xcode 專案和 Podfile (含 Pod) 已存在。
$ cd MessagingExample
$ pod init
  1. 將您要在應用程式中使用的 Firebase Pod 新增至 Podfile。

您可以將任何支援的 Firebase 產品新增至您的 iOS 應用程式。

本快速入門導覽課程範例已加入 Google Analytics 和 Firebase 雲端通訊 SDK。

# Add the Firebase pod for Google Analytics
pod 'Firebase/Analytics'

# Add the pod for Firebase Cloud Messaging
pod 'Firebase/Messaging'
  1. 安裝 Pod，然後開啟 .xcworkspace 檔案即可在 Xcode 中查看專案：
$ pod install
  1. 開啟 MessagingExample.xcworkspace，然後在 Firebase 控制台中點選「Next」(下一步)。6d1f8230d16693e6.png

在應用程式中初始化 Firebase

您必須將 Firebase 初始化程式碼加進應用程式。

匯入 Firebase 模組並設定共用執行個體 (在快速入門導覽課程範例中，系統已匯入 Firebase 模組)。

  1. 將 Firebase 模組匯入 UIApplicationDelegate 中：

AppDelegate.swift

import UIKit
import Firebase // Add this line
  1. 設定 FirebaseApp 共用執行個體，通常在應用程式的 application:didFinishLaunchingWithOptions: 方法中：

AppDelegate.swift

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
  FirebaseApp.configure() // Add this line
  return true
}
  1. 在 Firebase 控制台中，點選「下一步」。f9d37423d346ff0.png
  2. Firebase SDK 已新增至您的應用程式。按一下「Continue to console」。d1b1309cd3790f66.png

5. 設定 FCM 用戶端

上傳 APN 驗證金鑰

將 APN 驗證金鑰上傳至 Firebase。

  1. 在 Firebase 控制台的專案中，依序選取齒輪圖示 >「專案設定」，然後選取「雲端通訊」分頁標籤。ba8b5f95241327fe.png
  2. 在「iOS app settings」下方的「APNs 驗證金鑰」中，按一下「上傳」按鈕。357ddc0d4b182492.png
  3. 找到您儲存金鑰的位置，選取金鑰，然後按一下「Open」。新增金鑰 ID (可在 Apple Developer Member Center 的憑證、ID 與設定檔中找到)，然後按一下「上傳」。3dae27f2327daf9e.png

註冊遠端通知

無論是啟動時或應用程式流程中的所需環節，都請註冊應用程式，以便接收遠端通知。

已在快速入門導覽課程範例中新增 registerForRemoteNotifications。

AppDelegate.swift

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
  FirebaseApp.configure()
  // [START register for remote notifications]
  if #available(iOS 10.0, *) {
    // For iOS 10 display notification (sent via APNS)
    UNUserNotificationCenter.current().delegate = self
        
    let authOptions: UNAuthorizationOptions = [.alert, .badge, .sound]
    UNUserNotificationCenter.current().requestAuthorization(options: authOptions, completionHandler: {_, _ in })
  } else {
    let settings: UIUserNotificationSettings = UIUserNotificationSettings(types: [.alert, .badge, .sound], categories: nil)
    application.registerUserNotificationSettings(settings)
  }

  application.registerForRemoteNotifications()
  // [END register for remote notifications]
  return true
}

在 AppDelegate.swift 結尾新增幾行程式碼，以指派 UNUserNotificationCenter 的委派屬性。

AppDelegate.swift

@available(iOS 10, *)
extension AppDelegate : UNUserNotificationCenterDelegate {

  // Receive displayed notifications for iOS 10 devices.
  func userNotificationCenter(_ center: UNUserNotificationCenter,
                              willPresent notification: UNNotification,
    withCompletionHandler completionHandler: @escaping (UNNotificationPresentationOptions) -> Void) {
    let userInfo = notification.request.content.userInfo

    // Print full message.
    print(userInfo)

    // Change this to your preferred presentation option
    completionHandler([[.alert, .sound]])
  }

  func userNotificationCenter(_ center: UNUserNotificationCenter,
                              didReceive response: UNNotificationResponse,
                              withCompletionHandler completionHandler: @escaping () -> Void) {
    let userInfo = response.notification.request.content.userInfo

    // Print full message.
    print(userInfo)

    completionHandler()
  }
}

設定訊息委派代表

如要接收註冊權杖，請在呼叫 [FIRApp configure] 後導入訊息委派通訊協定，並設定 FIRMessaging 的 delegate 屬性。舉例來說，如果您的應用程式委派代表符合訊息委派通訊協定，您可以將 application:didFinishLaunchingWithOptions: 上的委派設為本身 (在快速入門導覽課程範例中，系統已設定委派代表)。

AppDelegate.swift

func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
  FirebaseApp.configure()
  Messaging.messaging().delegate = self // Add this line
  // [START register for remote notifications]
  if #available(iOS 10.0, *) {
    // For iOS 10 display notification (sent via APNS)
    UNUserNotificationCenter.current().delegate = self
        
    let authOptions: UNAuthorizationOptions = [.alert, .badge, .sound]
    UNUserNotificationCenter.current().requestAuthorization(options: authOptions, completionHandler: {_, _ in })
  } else {
    let settings: UIUserNotificationSettings = UIUserNotificationSettings(types: [.alert, .badge, .sound], categories: nil)
    application.registerUserNotificationSettings(settings)
  }

  application.registerForRemoteNotifications()
  // [END register for remote notifications]
  return true
}

在 AppDelegate.swift 結尾新增幾行程式碼，以指派 FIRMessaging 的委派屬性。

AppDelegate.swift

extension AppDelegate : MessagingDelegate {
  func messaging(_ messaging: Messaging, didReceiveRegistrationToken fcmToken: String?) {
    print("Firebase registration token: \(String(describing: fcmToken))")
    
    let dataDict:[String: String] = ["token": fcmToken ?? ""]
    NotificationCenter.default.post(name: Notification.Name("FCMToken"), object: nil, userInfo: dataDict)
  }
}

新增功能

您已在「建立應用程式 ID」部分新增「推播通知」功能，但也必須按照下列步驟在 XCode 上新增這項功能 (以下步驟請參閱 XCode 12.3)：

  1. 在導覽器區域按一下專案名稱。
  2. 依序按一下 [登入與]功能。
  3. 按一下「+ 功能」。

eaf41aefb3bf2c9e.png

  1. 按兩下「背景模式」。
  2. 再次按一下「+ 功能」。
  3. 按兩下「推播通知」。
  4. 在「背景模式」部分中，勾選「遠端通知」。

e5d0fc08651e04a9.png

6. 傳送通知訊息

您可以按照下列步驟傳送測試訊息：

  1. 在目標裝置上安裝並執行應用程式。您必須接受權限要求，才能接收遠端通知。
  2. 在 XCode 記錄檔中取得註冊權杖。

a2e49a92f9807d34.png

  1. 確認應用程式在裝置的背景執行。
  2. 開啟通知編輯器，然後選取「新通知」。
  3. 輸入訊息文字。f485d7fbd2456ae0.png
  4. 選取「傳送測試郵件」。
  5. 在標示為「新增 FCM 註冊權杖」的欄位中，輸入您在步驟 2 取得的註冊權杖。
  6. 按一下 [測試]。

按一下「測試」之後，指定的用戶端裝置 (應用程式在背景執行) 應該會在通知中心收到通知。

如要進一步瞭解傳送至應用程式的訊息，請參閱 FCM 報告資訊主頁，其中會記錄在 iOS 和 Android 裝置上傳送及開啟的訊息數量。

6570eea7b5228513.png

7. 恭喜

恭喜，您已成功傳送測試訊息！

FCM 還有其他功能與設定 (例如主題訂閱)。

如要瞭解詳情，請參閱官方開發人員文件。

後續步驟

請查看部分程式碼研究室。

其他資訊