[Hybrid APP] Cordova + Firebase 簡單實現 ios APNS推播 以及 android FCM(GCM) 推播
在以前,當專案同時有 ios & android 兩派系統用戶,後台就必須實作兩套推送方式 (APNS以及GCM),直到2016年5月的Google IO大會上推出Firebase,並推出多項新功能供大家使用,包含這次介紹的推播功能。
Google後來也將原本android推播平台 Google Cloud Messaging (GCM)全面改為 Firebase Cloud Messaging (FCM),FCM為跨平台服務,可推送ios、android、web applications,FCM推播ios其實還是使用Apple Push Notification service (APNS),只是對於開發者來說,不用去區分client平台為何,FCM自動幫你分辨並推播。
官方 FCM 展示影片:
PS.此範例使用 Cordova框架 搭配 ionic框架為實例
在cordova專案加入 cordova-plugin-fcm 套件
#cordova plugin add cordova-plugin-fcm
程式碼:
取得FCM Token:
FCMPlugin.getToken(function(token){
alert(token);
});
收到推播訊息event
FCMPlugin.onNotification(function(data){
alert(JSON.stringify(data));
});
範例圖:
至firebase平台上註冊APP
https://console.firebase.google.com
先建立專案
加入 ios以及android 應用程式
iOS 連結ID 為 APP ID (bundle ID)
將檔案下載至 cordova專案跟目錄
此項目略過 直接按繼續
Android 套件名稱 一樣為 APP ID
一樣下載至cordova專案跟目錄
到這裡,android推播部分其實已經完成,ios還必須加入APNS憑證才可以推播。
ios要有推播功能必須要有 Apple 開發者帳戶,才可以有推播功能。
至於如何申請就不再此教學,請另google
至開發者帳戶新增App ID
申請推播憑證前,需要先產生CSR憑證需求檔(此需求檔只能使用一次)
必須使用MAC OS 鑰匙圈存取產生
輸入email完後 下面選擇 儲存到硬碟即可產生CSR需求檔
上傳剛剛產生的需求檔
下載cer憑證
由於FCM需要的是.p12憑證,所以必須再使用 鑰匙圈存取,將cer轉p12
將剛剛下載的cer檔案點兩下即可匯入鑰匙圈。
至左邊 我的憑證 即可看到剛剛匯入的憑證,展開憑證,會出現本機用戶名稱,再點右鍵輸出,檔案格式必須選擇 .p12
至Firebase 匯入 APNS憑證
此伺服器金鑰須記下,之後推播需要用到
到這邊,ios也設定完畢了!
再build APP 之前要先確認 cordova APP id 是否設定正確
確定無誤後 即可build APP
#cordova build ios
#cordova build android
PS.注意 ios部分,用Xcode編譯前,要先確認推播功能有沒有打開
APP開啟時會顯示需要授權推播功能,點授權後須重開起APP才可以取得到FCM Token
推播測試
左邊功能選單 Notifications 可以測試推播功能
推送目標可以是應用程式也可以是主題或是單一裝置
此範例先使用應用程式為範例
ios收到推播畫面:
FCM 另外還可以推送 web application ,有興趣的朋友可以自己實作看看~
有任何疑問歡迎留言
By 艾摩杰~
非常棒的分享,很有幫助,感謝您!
回覆刪除謝謝您的教學,也順利推播成功。
回覆刪除請問 至 Firebase 後台的 Notification 測試推播 ,
回覆刪除這段可以改成自動新增測試訊息,然後推播嗎
請問一下, 文章內有這段話
回覆刪除申請推播憑證前,需要先產生CSR憑證需求檔(此需求檔只能使用一次)
我自己測試, 建立2個APP, 上傳同一個CSR憑證需求檔, 發現還是能正常使用耶, 所以現在不只使用一次對嗎 ?