As an operator, one daily routine is data analysis of your app's user behavior data. For example, you may need to obtain the conversion data of each stage of the service process for users acquired from different channels, as well as payment data from your app, and then report the data obtained to an analytics platform to analyze your app performance. In practice, requirements may keep changing. Let's say you change the analytics platform to Google Analytics for the AddProduct2Cart event. You'd need to request developers to modify the code and release a new app version. The event can be reported to Google Analytics only after users have updated their app to this new version. The whole process needs a lot of time and labor.
How could you report an event to an analytics platform quickly and without modifying the code?
Dynamic Tag Manager (DTM) is your answer. With DTM, you can set event trigger conditions and configure and update tags quickly on a web-based UI, and report the event data to an analytics platform.
In this article, you will learn about how to report the $AddProduct2Cart event to Google Analytics using DTM.
Only two steps are required for reporting events to Google Analytics:
1. Modify the DTM configuration for the event $AddProduct2Cart on the Dynamic Tag Manager page in AppGallery Connect to report the event to Google Analytics.
2. Create and release a new DTM configuration version.
Before that, integrate the DTM SDK and the Analytics SDK for your app and complete tracking configuration for the $AddProduct2Cart event as follows:
1
2
3
4<p style="line-height: 1.5em;">Bundle bundle = new Bundle();
bundle.putString(PRODUCTID, "xxx");
bundle.putString(PRODUCTNAME, "xxx");
HiAnalytics.getInstance(context).onEvent(HAEventType.ADDPRODUCT2CART, bundle);</p>
The detailed operations are as follows:
1. Modify the DTM configuration.
1.1 Configure variables.
Go to Grow > Dynamic Tag Manager > Variable. Click Configure, select Event Name, and click OK.
{
"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"
}
1.2 Create a condition.
On the Condition page, click Create. On the page displayed, enter a condition name, select Custom for Type, and select Some events for Trigger. Then, set Variable to Event Name, Operator to Equals, and Value to $AddProduct2Cart.
1.3 Create a tag.
On the Tag page, click Create to create a tag for Google Analytics to track events. Configure the tag as follows:
Name: custom tag name
Extension: Google Analytics: Universal Analytics
Tracking ID: unique ID provided by Google Analytics for tracking data, in the format of UA-XXXXXXXX-X
Tracking type: Event
Event type: Click
Event operation: Add2Cart
Add the condition you have created in the Conditions area.
2. Create and release a new DTM configuration version.
On the Version page, click Create to create a new DTM configuration version. Select Create and release version so that the app with the DTM SDK integrated will periodically check and download the latest configuration and report events according to the configuration.
The configuration successfully created will be released automatically.
3. View data in Google Analytics.
3.1 Download the latest configuration version.
The default interval between two downloads of the DTM configuration is 6 hours. To download the latest configuration immediately, clear the app cache and restart the app.
3.2 Report data in real time
Events are reported every 10 minutes by default when the app is running. To report events in real time, run the following command:
adb shell setprop debug.huawei.hms.dtm.app <package_name>
3.3 View data in Google Analytics.
Add a product to the shopping cart in your app. Then, wait for several minutes and go to Real-time > Events in Google Analytics to view the data of this event.
You will find that the event category is Click and the operation is Add2Cart, which is consistent with your DTM configuration. That means, your DTM configuration is valid.
For more details, you can go to>>
For more on HUAWEI Prediction, visit>>
For more details, you can go to:
l Our official website
l Our Development Documentation page, to find the documents you need
l Reddit to join our developer discussion
l GitHub to download demos and sample codes
l Stack Overflow to solve any integration problems
Original Source
Related
In this article, we’ll learn how to use DTM in our Flutter projects.
{
"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"
}
Flutter is a free and open-source mobile UI framework. It allows you to create a native mobile application with only one codebase. This means that you can use one programming language and one codebase to create two different apps for iOS and Android. In this case, we’ll integrate the Dynamic Tag Manager (DTM) into a Flutter project. With Dynamic Tag Manager, you can dynamically update tracking tags on a web-based UI to track specific events and report data to third-party analytics platforms, tracking your marketing activity data as needed.
Configure your project on AppGallery Connect
Registering a Huawei ID
You need to register a Huawei ID to use the plugin. If you don’t have one, follow the instructions here.
Preparations for Integrating HUAWEI HMS Core
First of all, you need to integrate Huawei Mobile Services with your application. I will not get into details about how to integrate your application but you can use this tutorial as step by step guide.
Configuring the AndroidManifest.xml File
Code:
<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
Process
1. Enabling Flutter Analytics Plugin
In Flutter you are advised to integrate HUAWEI Analytics Kit for recording custom events. The Flutter Analytics Plugin enables communication between HUAWEI Analytics SDK and Flutter platform. This plugin exposes all functionality provided by HUAWEI Analytics SDK. Let’s start by integrating Flutter Analytics Plugin to our pubspec.yaml file. There are two ways to do this. For both ways, after running pub get command, the plugin is ready to use.
Code:
dev_dependencies:
flutter_test:
sdk: flutter
huawei_analytics:
path: hms/huawei_analytics
Code:
dev_dependencies:
flutter_test:
sdk: flutter
huawei_analytics: ^4.0.4
2. Operations on the Server
To access the DTM portal, perform the following steps: On the Project Setting page, go to Growing > Dynamic Tag Manager.
Click Create configuration on the DTM portal and set Configuration name, App type, Operation record, and Tracked data.
View the configuration on the Configuration management page. You can click its name to access the configuration page.
The configuration is a general term for all resources in DTM, including Overview, Variable, Condition, Tag, Group, Version, and Visual Event.
On the Overview tab page, you can view the change history and operation records of variables, conditions, and tags in the current configuration version.
A variable is a placeholder used in a condition or tag. DTM provides preset variables which can be used to configure most tags and conditions. You can also create your own custom variables.
Creating a Preset Variable
Creating a Custom Variable
Condition
A condition is the prerequisite for triggering a tag and determines when the tag is executed. A tag must contain at least one trigger condition.
Creating a Condition
Tag
A tag is used in your app to track events. DTM supports the HUAWEI Analytics and custom function templates, as well as many third-party tag extension templates. With DTM, you do not need to add additional third-party tracking tags in your app.
Creating a Tag
Create and Release a Version
Downloading a Version
Importing a Configuration File
3. Configuring the Code
Code:
import 'package:huawei_analytics/analytics.dart';
Code:
class _MyHomePageState extends State<MyHomePage> {
final HMSAnalytics hmsAnalytics = new HMSAnalytics();
Future<void> _onCustomEvent(BuildContext context) async {
String name = "Purchase";
dynamic value = {'price': 90};
await hmsAnalytics.onEvent(
name, value);
}
Code:
floatingActionButton: FloatingActionButton(
onPressed:(){
_onCustomEvent(context);
},
),
Results:
Through the Verification process, we successfully integrated Dynamic Tag Manager into Flutter project.
For more information about HUAWEI Dynamic Tag Manager (DTM), visit
https://developer.huawei.com/consumer/en/doc/development/HMSCore-Guides/introduction-0000001050043907
Related Links
Original post: https://medium.com/huawei-developers/using-dynamic-tag-manager-dtm-in-flutter-project-f052d24731e4
Nice and useful article
Why do we need to add dependecies for huawei analytics ? what is the integration relationship between Analytics and DTM?
useful sharing, thanks!!
More information like this, you can visit HUAWEI Developer Forum
Introduction:
Coding Assistant provides HMS Core APIs and sample code. We only need to drag and drop scenario cards to integrate the corresponding scenarios. Here we can simply configure the Push Kit integration environment with one click, and the tool will automatically complete the configuration.
HMS Core Tool Kit Introduction:
HMS Core Tool Kit is a plug-in Installed in Android studio to facilitate app creation, coding, conversion, debugging, testing and release. It helps to integrate HMS Core API in the most efficient way and at the lowest possible cost.
To know more about HMS tool Kit and installation process use the Link.
Integrating Procedure:
Previously we may have needed to set many configuration items while integrating push Kit and have to check them repeatedly to avoid omission. To address this issue Huawei sorted the integration process and placed the configuration items into an automatic process. This is called the automatic environment configuration in one click mode.
So, click Start Configuration to initiate an automatic check whether configuration is required for integration to be completed. If not, some will automatically be completed while the rest will have to be processed as prompted. Click Retry to check whether all of the configuration items are completed. This ensures that the entire configuration process is clear and there are no omissions.
Development Based on Scenarios and Steps:
Huawei provides scenario-based and step-based development modes.
For scenario-based development, drag a scenario card to a project to automatically insert related code, configurations, and dependencies.
For step-based development, access a card to view the detailed steps and API code snippets of a scenario, and copy code snippets to a project.
Here we are using scenario-based development.
Steps for Integrating Push Kit Via Coding Assistant:
1. Go to HMS > Coding Assistant
{
"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. Login Via opened browser
3. Provide access permission
After log in, it will be redirected to HUAWEI Dev Eco Studio home Page.
Configuration Wizard
Configuration Wizard will help us to quickly complete the necessary preparations such as registering an app and generating a signing certificate fingerprint so that we do not spend more time.
1. To setup development environment, click Configuration.
2. In Configuration Wizard, select Choose your team name, Choose kit, Choose your module and Certificate to generate the fingerprint.
Click Start Enviornmrnt Check, as follows.
3. Click Go to environment configuration, as show in below image.
Note: To solve the issues in Environment Check as App Gallery Connect cannot locate your application, Data storage location has not been set yet etc.
4. Configuration Results will show details of failed steps. Go to each and every failed steps and click the corresponding Link.
5. Click Link, it will redirect to AppGallery.
Note: Here the first issue is there is no application in AppGallery with the same package name as the application created in Android Studio. So in AppGallery we have to create an application with the same package name. We can check Event Log and can verify which steps are executed successfully.
6. Create New project.
7. Click Add app in General Information for creating app
8. Enter App name, Package name, App category and Default language.
9. In Configuration Result, click Retry, it will provide new result and prompt to set data storage location.
10. After click on Link, it redirect to AppGallaery Conect and we need to set Data Storage Location.
11. Select Data Storage location.
12. In Configuration Result, click Retry, it will provide new Configuration Results.
It prompts to enable service manually.
13. In AppGallery Connect, click Enable now Huawei PushKit.
14. In Configuration Result, click Retry, it will provide new Configuration Results. It prompts to enable API.
15. In AppGallery Connect, Enable Push Kit API as shown below.
16. In Configuration Result, click Retry. Finally it will provide success message.
Note: Check Event Log and see the details.
17. In Configuration Results click Go to Coding Assistant.
This is not the end. For full content, you can visit https://forums.developer.huawei.com/forumPortal/en/topicview?tid=0201339927413030084&fid=0101188387844930001
After learning how to release a Cocos-based app in HUAWEI AppGallery Connect, you can monitor your app's performance data using AppGallery Connect APM. Currently, the APM SDK supports only the Android platform. Take APM as an example. Let's see how to integrate a service.
Configuring Relevant Information in Cocos Creator
1. On the Service panel of Cocos Creator, find and enable APM.
{
"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. Before integrating a service, you need to associate the service with an app. Click Association. In the dialog box that is displayed, click Create. The Cocos console is displayed.
3. On the Cocos console, create a game.
4. Go back to Cocos Creator and create, refresh, or select an association.
Configuring Relevant Information in AppGallery Connect
1. Sign in to AppGallery Connect, click My projects, and find your project, and click the game you created last time on the project card.
2. Go to Quality > APM and click Enable.
3. Go to Project settings and download the latest agconnect-services.json file.
4. Save the downloaded agconnect-services.json file to the settings directory in your Cocos project.
Packaging and Running an App
Currently, AppGallery Connect APM does not provide a JavaScript SDK. Therefore, you need to package your app and install it on an Android device to view its performance data. Perform the following steps:
1. Package the current Cocos-based app. Access Cocos Creator, go to Project > Build..., choose HUAWEI AppGallery Connect, and set a package name.
Note: The package name must be the same as the package name configured in AppGallery Connect, that is, the name of the JSON file in the previous step. Otherwise, a compilation error is reported.
2. Find the corresponding APK file in the \build\jsb-link\publish\android directory of the project.
3. Install the file on an Android device by running the adb install –r packageName.apk command in the CLI.
4. Launch the app and perform normal operations. Check whether the corresponding APMS logs are generated. If so, you have integrated the APM service successfully.
Viewing App Performance Data
After the app runs for about 5 minutes, you can view its performance data in AppGallery Connect (under My projects > Quality > APM). For details, check Viewing App Performance Data.
Additional APM Features
In addition to the basic features, APM has some additional features, including custom tracing parameters. You can use these features to monitor app performance in specific scenarios, such as app sign-in and ANR problems.
1. Setting custom tracing parameters:
Code:
huawei.agc.apms.apmsService.startCustomTrace("traceID");
2. Setting the attribute names and values of a custom trace:
Code:
huawei.agc.apms.apmsService.putCustomTraceProperty(traceID, pName, pValue);
3. Creating a network request indicator instance for each network request to collect network performance data:
Code:
let id = huawei.agc.apms.apmsService.initNetworkMeasure(url, "POST");
console.log("createNetworkMeasure, id = ", id);
For more details, you can go to:
APM (AppGallery Connect) quick start for a Cocos-based app:
https://docs.cocos.com/creator/manual/en/cocos-service/agc-apm.html
AppGallery Connect APM development guide:
https://developer.huawei.com/consumer/en/doc/development/AppGallery-connect-Guides/agc-apms-introduction
Cocos Creator Integrates with AppGallery Connect APM – Releasing a Cocos-based App:
https://developer.huawei.com/consumer/en/forum/topicview?fid=0101271690375130218&tid=0203359161844040878&pid=0303359161844040067
Recently, it is found that some services of AppGallery Connect start to support cross-platform frameworks, including Flutter. Let's have a try on Remote Configuration.
Integration Procedure
1. Install the Flutter environment.
a) Download the Flutter SDK package from https://flutter.dev/docs/get-started/install/windows.
{
"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"
}
Decompress the package to any directory, for example, D:\Flutter.
b) Add Flutter to environment variables. Here, the path is D:\Flutter\flutter_windows_1.22.2-stable\flutter\bin.
c) In Android Studio, go to File > Settings > Plugins, download the Flutter and Dart plug-ins, and restart Android Studio for the plug-ins to take effect.
2. Create a project and enable Remote Configuration.
a) Create an Android project in AppGallery Connect and enable Remote Configuration.
b) Add the following configuration items to Remote Configuration.
c) In Android Studio, go to File > New > New Flutter Project… and create a Flutter project.
d) Go to Project settings > General information in AppGallery Connect. In the App information area, download the agconnect-services.json file.
e) Place the agconnect-services.json file in the directory shown in the following figure.
f) Configure the Maven repository and Remote Configuration plug-in in the app-level build.gradle file.
g) Open the build.gradle file in the android/app directory of the Flutter project and add the build dependencies and AppGallery Connect plug-in address.
3. Integrate the Remote Configuration SDK.
Add the SDK dependency of Remote Configuration to the pubspec.yaml file.
Click Pub get to synchronize the data.
4. Test basic functions.
Here I implement a simple demo app to demonstrate several of the most important functions.
In the UI design, the Mode 1:Fetch And Activate Immediately, Mode 2:Fetch And Activate Next Time, and Clear Data buttons are provided to implement the following functions:
1. Obtain data from the cloud. This operation takes effect this time.
Tap Mode 1:Fetch And Activate Immediately to call fetch and then applyLastFetched to obtain the data fetched this time. The operation will take effect immediately. Therefore, we call the getMergedAll API to apply all the settings to the device. Then, we can obtain the data from the cloud on the device. The following figure shows the tap effect.
2. Obtain the cloud data and make the setting obtained last time take effect.
The API for delaying the setting to take effect shares the same implementation logic as that for making the setting take effect immediately, and they differ in the execution sequence.
Tap Mode 2:Fetch And Activate Next Time to call apply and getMergedAll to apply the last fetch result, and then call fetch to obtain the latest setting for next use.
3. Clear the data.
To clear data, tap Clear Data to call the clearAll API.
4. Set local configuration items.
You can create a Map parameter in the*.dart file and call the applyDefault API to apply the local settings.
HTML:
Map defaults = {
'mLong': 1000,
'mString': 'hello world',
'mDouble': 3.14,
'mBoolean': true
};
AGCRemotConfig.instance.applyDefaults(defaults);
5. Package your app.
Similar to Android, you only need to run your project in Android Studio.
Precautions
Different from setting local configuration items on the Android platform, Flutter cannot use XML files to store local configuration items.
For more details, check:
Flutter official guide: https://flutter.dev/docs/get-started/install/windows
To view more about how to integrate Remote Configuration into an Android project, visit https://developer.huawei.com/consum...-connect-Guides/agc-remoteconfig-introduction.
Demo of Remote Configuration(Flutter):https://developer.huawei.com/consum...oteconfig-flutter-samplecode-0000001056579535
Is there any usage restriction?
riteshchanchal said:
Is there any usage restriction?
Click to expand...
Click to collapse
there are some restriction as follows. For more restriction, please focus on the official document
A single project can have a maximum of 2000 parameters and 500 conditions. The total length of all parameter strings cannot exceed 800 KB.
The interface invoking frequency cannot exceed 20 times per hour.
Previously, I've introduced how to quickly report app events to Google Analytics using DTM without releasing app updates. Now, the visual event tracking requirement has changed to report events to Firebase for multi-dimensional data analysis. The following uses a case to explain the process of reporting events to Firebase using DTM.
Case:
Report the $AddProduct2Cart event to Firebase using DTM.
Procedure:
1. Preparations
Before modifying the DTM configuration, ensure that you have completed the following preparations:
a. The DTM SDK has been integrated into the app.
b. The Firebase SDK has been integrated into the app.
c. The $AddProduct2Cart event has been configured for the app using the Analytics SDK.
Code:
Bundle bundle = new Bundle();
bundle.putString(PRODUCTID, "xxx");
bundle.putString(PRODUCTNAME, "xxx");
HiAnalytics.getInstance(context).onEvent(HAEventType.ADDPRODUCT2CART, bundle);
</p>
2. Modifying the DTM Configuration.
2.1 Creating a Variable
Go to Grow > Dynamic Tag Manager > Variable. Click Configure, select Event Name, and click OK.
{
"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.2 Creating a Tag.
On the Tag page, click Create to create a Firebase tag. Configure the tag as follows:
Name: Enter a custom tag name.
Extension: Select Google Analytics (Firebase).
Event name: This parameter is optional. Select the check box and enter the renamed event name AddProduct2Cart (events reported to Firebase cannot contain the dollar sign $).
Parameters for addition: Set Key to price and Value to 1000.
Set Trigger condition to the created condition.
3. Creating and Releasing a Version.
Create and release a new configuration version on the Version page. The app with the DTM SDK integrated will periodically check and download the latest configuration version and report events according to this version.
In the Create version dialog box, select Create and release version.
4. Viewing the Reported Event on Firebase.
After completing the preceding operations, you can view the reported event on Firebase.
By default, the DTM SDK checks and downloads the latest configuration version at an interval of 6 hours. To download the latest configuration version immediately, clear the app cache and restart the app. DTM will not report events immediately if the debug mode is not enabled. Instead, events are reported every 10 minutes when the app is running. To report events immediately, run the following ADB commands:
Code:
adb shell setprop debug.huawei.hms.dtm.app <package_name>
adb shell setprop debug.firebase.analytics.app <package_name>
There may be a delay of several minutes for Firebase to receive the renamed event AddProduct2Cart triggered in the app.
Go to Analytics > DebugView to view the latest reported events.
The reported event name is AddProduct2Cart. The event has the price parameter and the parameter value is 1000, which is consistent with that set in DTM. This means that the DTM configuration has taken effect.
To learn more, please visit:
Our official website
Our development documentation page to find the documents you need
Reddit to join our developer discussion
GitHub or Gitee to download the demo and sample code
Stack Overflow to solve any integration problems
Original Source