最近發現華為AGC 遠端配置服務開始支援Web 平臺了，之前只支援Android 版本，期待Web 版本很久了，也迫不及待地整合體驗了一下，整合的Demo 見 Github 。

整合步驟

1.   開通服務

a)    登入 AGC ，建立JS 應用

b)    開通遠端配置

c)    點選“新增配置項”，新增遠端配置的配置項

2.   整合SDK

a)   輸入指令將npm 下載到專案中

npm install –save @agconnect/remoteconfig

3.   接入功能

a)   獲取本地配置項

在vue 中建立本地配置map

應用本地配置

export function applyDefault(map) {
  return agconnect.remoteConfig().applyDefault(map);
}

b)    獲取雲端配置項

直接呼叫fetch 介面獲取雲端配置

export async function fetch() {
  return agconnect.remoteConfig().fetch().then(() => {
    return Promise.resolve();
  }).catch((err) => {
    return Promise.reject(err);
  });
}

c)   將配置應用到本地，分為實時應用到本地和生效上次配置兩種。

   實時應用到本地：

直接呼叫apply 介面：

export function apply() {
  return agconnect
    .remoteConfig().apply().then((res) => {
        return Promise.resolve(res);
      }
    ).catch(error => {
      return Promise.reject(error);
    });
}

   生效上次獲取的配置：

呼叫applyLastFetch 介面獲取上次fetch 到的配置

//載入配置
export function applyLastLoad() {
  return agconnect
    .remoteConfig().loadLastFetched().then(async (res) => {
        if (res) {
          await agconnect.remoteConfig().apply(res);
        }
        return Promise.resolve(res);
      }
    ).catch(error => {
      return Promise.reject(error);
    });
}

d)   合併本地雲端配置

直接呼叫getMergedAll 介面合併所有配置項

export function getMergedAll() {
  return agconnect.remoteConfig().getMergedAll();
}

e)    清除配置項

呼叫clearAll 介面清除配置項

export function clearAll() {
  agconnect.remoteConfig().clearAll();
}

f)    效果展示

點選獲取，遠端配置生效合併本地和雲端的配置項，點選確定最終顯示出所有的配置項。

 

想要了解更多相關內容，請參考：

在web 平臺整合華為AGC 遠端配置：

Web 整合華為AGC 遠端配置開發指南： https://developer.huawei.com/consumer/cn/doc/development/AppGallery-connect-Guides/agc-remoteconfig-web-getstarted-0000001056501223

原文連結： https://developer.huawei.com/consumer/cn/forum/topic/0202448065023410670?fid=0101271690375130218

原作者： Mayism