AppGallery Connect:如何在React Native項目中集成華為遠程配置服務(wù)

來源: 華為
作者:AppGallery Connect
時間:2020-11-27
17060
本文內(nèi)容為在React Native項目中集成華為遠程配置服務(wù)具體步驟。

集成步驟

1.安裝React Native依賴

npm install-g yarn

ia_1500000002.png

2.開通服務(wù)&創(chuàng)建工程

a)在AGC創(chuàng)建Android應(yīng)用并開通遠程配置服務(wù),添加配置項

ia_1500000003.png

b)命令行創(chuàng)建React Native工程(RemoteConfig為創(chuàng)建的工程目錄名)

npx react-native init RemoteConfig

ia_1500000004.png

c)在React Native項目中添加配置文件

將配置文件“agconnect-services.json”添加到React Native項目的android/app目錄下

ia_1500000005.png

d)配置Maven倉地址和AGC插件地址。

1)打開React Native項目android目錄下的build.gradle文件。

在allprojects->repositories里面配置maven倉地址。

在buildscript->repositories中配置maven倉地址。

在buildscript->dependencies中配置AppGallery Connect插件地址。

ia_1500000006.png

2)添加編譯依賴和AGC插件地址。

打開React Native項目android/app文件夾下的build.gradle文件,添加插件地址。

ia_1500000007.png

3.安裝插件

在項目工程目錄的pacakge.json文件下,將需要的插件加入到dependencies中:

ia_1500000008.png

然后調(diào)用npm install方法安裝這些插件,也可以用yarn

npm install

ia_1500000009.png

4.功能展示

a)應(yīng)用本地配置

將本地配置設(shè)置為map格式,調(diào)用applyDefault方法應(yīng)用到本地

ia_1500000010.png

b)獲取云端數(shù)據(jù)/獲取上次獲取的云端數(shù)據(jù)

與android相同,通過fetch接口獲取云端的配置,接口后的參數(shù)為獲取云端參數(shù)的間隔

ia_1500000011.png

同樣的,如果想獲取上次拉取的數(shù)據(jù)則通過applyLastFetch方法:

ia_1500000012.png

c)將云端數(shù)據(jù)與本地數(shù)據(jù)合并

與Android相同,調(diào)用getMergedAll完成合并

ia_1500000013.png

d)清除數(shù)據(jù)

直接調(diào)用clearAll接口清除之前拉取的數(shù)據(jù)的緩存

ia_1500000014.png

e)拉取云端某key值對應(yīng)的數(shù)據(jù)

調(diào)用getValue接口直接獲取云端相關(guān)數(shù)據(jù)

ia_1500000015.png

f)打包

在項目根目錄下使用命令yarn android可以直接打出android的包:

ia_1500000016.png

g)結(jié)果展示

當我們獲取到值以后可以看到云端的值和本地配置的值都可以正確的獲取到:

ia_1500000017.png

立即登錄,閱讀全文
版權(quán)說明:
本文內(nèi)容來自于華為,本站不擁有所有權(quán),不承擔相關(guān)法律責任。文章內(nèi)容系作者個人觀點,不代表快出海對觀點贊同或支持。如有侵權(quán),請聯(lián)系管理員(zzx@kchuhai.com)刪除!
掃碼登錄
打開掃一掃, 關(guān)注公眾號后即可登錄/注冊
加載中
二維碼已失效 請重試
刷新
賬號登錄/注冊
個人VIP
小程序
快出海小程序
公眾號
快出海公眾號
商務(wù)合作
商務(wù)合作
投稿采訪
投稿采訪
出海管家
出海管家