(五)[極光推送通知 IOS & 安卓]React Native 從零到構建Android與IOS應用發布

由于我們都會遇到推送通知服務,而看到網上教程多半都是極光的,并且口碑都不錯,所以我也使用極光的把。

整合極光推送也耗費了不少時間,問題不斷,多虧極光官網的工作人員大力支持(郵件+QQ群),順利的調試通了極光推送,感謝!

這是極光推送的RN官方開發者群,遇到問題找群主,妥妥的,qq群:553406342


寫在前面,注意事項:

1、安卓和IOS的配置不一樣

2、IOS推送機制與安卓不一樣,安卓是直接連接極光推送服務器,而IOS則是需要通過蘋果的ANPS下發到設備


所以,安卓可以通過模擬器進行調試,而蘋果,必須要使用真機調試!!!!


準備事項:

1、注冊極光推送官網賬戶,創建推送應用 獲取appKey

2、(IOS)注冊蘋果development賬戶


安卓篇


安卓的安裝配置稍微簡單些,我推薦KenChoi的教程,鏈接:http://www.lxweimin.com/p/6721a0360af9

手動配置主要注意幾個點,當然自動配置也最好檢查一下,我遇到過重復代碼的問題

1、build.gradle需要添加jpush和jcore的依賴

2、settings.gradle需要include jpush-react-native和jcroe-react-native

3、AndroidManifest需要增加 meta-data

4、在?MainApplication.java 中注冊JPushPackage類

5、MainActivity 加入監聽事件onCreate、onPause、onResume

然后就可以通過import JPushModule from 'jpush-react-native'; 來使用jpush的方法了

值得注意的是:

JPushModule.initPush(); // 注冊監聽,在注冊props時就需要

安卓下需要在componentDidMount中監聽前加入以下代碼才能獲取推送(網上是這么說的,我沒試過刪除是否能收到,反正加了是能收到)

JPushModule.notifyJSDidLoad((resultCode) => {

????if (resultCode === 0) {

????}

});


監聽方法新版的Jpush 安卓和IOS都一致了(在?componentDidMount?中?notifyJSDidLoad?之后)

JPushModule.addReceiveNotificationListener((message) => { // 收到通知時觸發

? ? ? ? console.log(message);

});

JPushModule.addReceiveOpenNotificationListener((message) => { // 點擊托盤通知進入APP觸發

????????console.log(message);

});

然后在?componentWillUnmount 中移除監聽

JPushModule.removeReceiveCustomMsgListener();

JPushModule.removeReceiveNotificationListener();

安卓推送就OK了,一次性搞定


IOS篇

IOS非常麻煩,首先,你需要在development開發者中心中的 Certificates, Identifiers & Profiles

1、注冊 iOS Certificates 證書


創建證書

如圖,我已經創建了證書,需要創建的證書有4個,一個APNS開發者證書,一個APNS生產環境證書,一個IOS開發者證書,一個IOS生產環境證書。

關于如何創建證書,請移步:http://www.lxweimin.com/p/01224fc523d4

2、注冊APP應用,Identifiers

在Xcode的target下的General中的Signing中選擇你的team,team也就是你的蘋果開發者帳號,選擇后點擊development官網上的App Ids新增一個即可,上面的鏈接有資料

3、注冊真機調試設備,Devices

用蘋果手機連接mac,然后在itunes中點擊手機圖標,在手機信息中,點擊序列號,會變成UDID,然后在development官網上的Devices中新增一個設備,輸入名稱和UDID注冊即可

4、注冊Provisioning Profile

注冊方式跟前面差不多

這個需要注冊開發者和生產環境的profile,否則XCode選擇Signing 和push notifications時會出現紅色感嘆號

(請注意)上面的注冊完畢后,下載APNS對應的證書,然后添加到mac鑰匙串中(雙擊導入),然后右鍵對應的證書,點導出,然后需要輸入加密的密碼,你自己隨便填,然后導出.p12的文件,其中需要注意的是, 請命名好各自對應的證書,開發環境和生產環境不一樣,

而這兩個證書是需要上傳到極光推送應用配置中的IOS配置中的,會根據證書自動生成bundle ID,所以需要特別注意

做好這些工作后,就是安裝JPUSH了

與安卓不太一樣的就是

npm i -g jpush-react-native --save

yarn add jpush-react-native

npm i -g jcore-react-native --save

yarn add jcore-react-native

我試過使用

npm run configureJPush **** appname

自動配置,但是報錯提示安卓文件找不到,我MAC下并未配置安卓環境

但是代碼卻是修改了,這是最省力的,所以這一步是需要執行

然后運行

react-native link

將library加入到xcode工程中

Libraries就多了 RCTJCoreModule.xcodeproj 和?RCTJPushModule.xcodeproj

然后選擇 APP的target 點擊?Capabilities?項,將?Push Notifications 從off改為On,之前的證書OK的話,這里就是2個勾了,如果證書不OK,那請重新配置證書,將 Background Modes 從Off改為On,只勾選 Remote notifications

然后點擊?build Settings?項。將 Code Signing Identity 和它的子項全改為 iOS Developer

然后點擊?Build Phases ,展開Link Binary With Libraries ,找到UserNotifications.framework?改為 Optional

然后在Xcode左側打開 AppDelegate.h ,在UIKit后加入

#import <UIKit/UIKit.h>

//

static?NSString?*appKey=@"你的Appkey";

static?NSString?*channel=@"nil";

static?BOOL?isProduction=true;?//生產環境false?正式true

注意,由于IOS9以上禁止訪問HTTP,要求API必須請求HTTPS,所以包括極光我們需要增加策略

在info.plist的 App Transport Security Settings 下增加 Allow Arbitrary Loads = YES

在Exception Domains 下(react native init時就會創建并加入localhost訪問http的策略)增加

jpush.cn = Dictionary

然后在jpush.cn下增加?

NSExceptionAllowsInsecureHTTPLoads=YES

NSIncludesSubdomains=YES

即可完成安全策略的配置,如圖

!!!!!!注意,由于不支持HTTP,所以如果你的API是通過HTTP訪問的話,你需要創建一個跟jpush.cn配置一樣的你的域名在Exception Domains下面,否則會出現network failed錯誤!具體用頂級域名就好,多個請求域名要配置多個域名配置,馬賽克部分就是我的域名,只要配置頂級域名就可支持子域名了。


Xcode安全策略配置

然后build一下Xcode,至此,極光IOS配置完成,很簡單的但是由于不熟悉,所以走了很多彎路

然后,在IOS下必須要注冊監聽,否則無法正常監聽推送

根據群主的建議,我在index.js 中加入了

import?JPushModule?from?'jpush-react-native';

JPushModule.addnetworkDidLoginListener(()?=>?{

});

然后在component中操作和安卓一樣,在componentDidMount中監聽

JPushModule.addReceiveNotificationListener((message) => { // 收到通知時觸發

console.log(message);

});

JPushModule.addReceiveOpenNotificationListener((message) => { // 點擊托盤通知進入APP觸發

console.log(message);

});

然后在componentWillUnmount中移除監聽

JPushModule.removeReceiveCustomMsgListener();

JPushModule.removeReceiveNotificationListener();

然后上真機調試,OK,正常收到推送,至此極光推送配置完成,感謝群主HuminiOS的支持

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,825評論 6 546
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,814評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 178,980評論 0 384
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 64,064評論 1 319
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,779評論 6 414
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 56,109評論 1 330
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 44,099評論 3 450
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,287評論 0 291
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,799評論 1 338
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,515評論 3 361
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,750評論 1 375
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,221評論 5 365
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,933評論 3 351
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,327評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,667評論 1 296
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,492評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,703評論 2 380

推薦閱讀更多精彩內容

  • 此處我用的是jpush-react-native,這個是極光官網維護的,還有一個是react-antive-jpu...
    liu_520閱讀 24,304評論 95 39
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,807評論 25 708
  • 安裝 安裝,打開終端項目目錄下運行,安卓jpush-react-native jpush-react-nativ...
    45b645c5912e閱讀 3,543評論 0 4
  • 《詩經·王風·采葛》 彼采葛兮,一日不見,如三月兮! 彼采蕭兮,一日不見,如三秋兮! 彼采艾兮!一日不見,如三歲兮...
    七徽閱讀 3,056評論 55 67
  • 執子之手,與子偕老 十余混沌一日醒,緣達人相逢 傾情愿博君美眸,盡使伊彎唇 朝朝暮暮,暮暮朝朝 悠然現真心,伊篤信...
    羅若閱讀 137評論 2 4