Posted on by Li Mayism

How to Integrate Remote Configuration of AppGallery Connect in React Native

If you want to experience the remote configuration function, see the GitHub demo.

Integration Procedure

  1. Install the React Native dependency.
    1. npm install -g yarn
  2. Create a project and enable Remote Configuration.
    • a) Create an Android app in AppGallery, add it to a project, enable Remote Configuration, and add a parameter.
    • b) Run the following command to create a React Native project. In this example, we named the project RemoteConfig.
      • npx react-native init RemoteConfig 
    • c) Add the configuration file to your React Native project. Add the agconnect-services.json file to the android/app directory of the React Native project.
    • d) Configure the Maven repository address and AppGallery Connect plug-in address.
      1. Open the build.gradle file in the androiddirectory of your React Native project.
        • Go to allprojects > repositories and configure the Maven repository address.
        • Go to buildscript > repositories and configure the Maven repository address.
        • Go to buildscript > dependencies and configure the AppGallery Connect plug-in address.
      2. Add build dependencies and the AppGallery Connect plug-in address. Open the build.gradle file in the android/app directory of the React Native project and add the plug-in address.
  3. Install the plug-in.
    • Add the plug-in to dependencies under the package.json file in your project.
    • Call npm install or yarn installto install the plug-in.
      • npm install
  4. Use the Remote Configuration service.
    • a) Apply the local settings. You can set the local settings to Map format and call the applyDefault API to apply them.
    • b) Fetch the cloud data or the parameter values fetched last time. Call the fetch API to fetch parameter values from the cloud with an interval. Similarly, call applyLastFetch to fetch data that is fetched from the cloud last time.
    • c) Merge the local and cloud data. Call getMergedAll to merge the local and cloud data.
    • d) Clear the data. Call the clearAll API to clear the cached data that is fetched earlier.
    • e) Fetch the value of a key from the cloud. Call getValue to fetch related data from the cloud.
    • f) Package the APK file. Run the yarn android command under the root directory of your project.
    • g) Result. You can obtain all required parameter values and on-cloud parameter values.

For moreļ¼š