How Can I Quickly Integrate Remote Configuration to a Web App? - Huawei Developers

Recently, I found that Remote Configuration of AppGallery Connect now supports the web platform, which I’ve long been waiting for. Previously, it has only been supported on Android, but now it can be applied to web apps. For details about the integration demo, visit GitHub.​
Integration Steps​1. Enable the service.
a) Sign in to AppGallery Connect and create a web app.
b) Enable Remote Configuration.
c) Click New parameter and set parameters.
{
"lightbox_close": "Close",
"lightbox_next": "Next",
"lightbox_previous": "Previous",
"lightbox_error": "The requested content cannot be loaded. Please try again later.",
"lightbox_start_slideshow": "Start slideshow",
"lightbox_stop_slideshow": "Stop slideshow",
"lightbox_full_screen": "Full screen",
"lightbox_thumbnails": "Thumbnails",
"lightbox_download": "Download",
"lightbox_share": "Share",
"lightbox_zoom": "Zoom",
"lightbox_new_window": "New window",
"lightbox_toggle_sidebar": "Toggle sidebar"
}
2. Integrate the SDK.
a) Run the following command:
Code:
npm install –save @agconnect/remoteconfig
3. Implement the functions.
a) Obtain the local configuration parameters.
Create a local configuration map in the Vue.
Apply the local settings.
JavaScript:
export function applyDefault(map) {
return agconnect.remoteConfig().applyDefault(map);
}
b) Call the fetch API to fetch parameter values from the cloud.
JavaScript:
export async function fetch() {
return agconnect.remoteConfig().fetch().then(() => {
return Promise.resolve();
}).catch((err) => {
return Promise.reject(err);
});
}
c) Apply the parameter values to the local host immediately or upon the next launch.
1. Applying the parameter values immediately:
Call the apply API.
JavaScript:
export function apply() {
return agconnect
.remoteConfig().apply().then((res) => {
return Promise.resolve(res);
}
).catch(error => {
return Promise.reject(error);
});
}
2. Applying the parameter values upon the next launch:
Call the applyLastFetch API to apply the last fetched parameter values.
JavaScript:
// Load configurations.
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) Obtain all parameter values from the local host and cloud.
Call the getMergedAll API to obtain all parameter values.
JavaScript:
export function getMergedAll() {
return agconnect.remoteConfig().getMergedAll();
}
e) Call the clearAll API to clear all parameter values.
JavaScript:
export function clearAll() {
agconnect.remoteConfig().clearAll();
}
References:
Demo:
https://github.com/AppGalleryConnect/agc-demos/tree/main/Web/agc-romoteconfig-demo-javascript
Remote Configuration Development Guide:
https://developer.huawei.com/consum...-remoteconfig-web-getstarted-0000001056501223

---

Well explained, Using remote config can we change UI elements.

---

What is the basic use of Remote Config in web?

---

sujith.e said:
Well explained, Using remote config can we change UI elements.
Click to expand...
Click to collapse
yes, that is convenient for developers.

---

ask011 said:
What is the basic use of Remote Config in web?
Click to expand...
Click to collapse
You can flexibly modify the behavior and appearance of applications by changing cloud parameter values.