Overview

Analytics Kit predefines rich analysis models to help you easily understand user behavior and gain in-depth insights into users, products, and content. As such, you can carry out data-driven operations and make informed decisions about app marketing and product optimization.
Analytics Kit implements the following functions using data collected from apps:

• Collects and reports custom events through coding.
• Sets up to 25 user attributes.
• Automatically collects events, calculates sessions, and predefines event IDs and parameters.

What You Will Create

In this codelab, you will create a demo app based on the provided demo project. After creating a demo app, you will be able to:

• Report events using the Analytics SDK.
• View event analysis reports on the cloud platform of Analytics Kit.

What You Will Learn

In this codelab, you will learn how to:

• Use the WeChat DevTools to efficiently integrate capabilities of Analytics Kit.
• Correctly use APIs of Analytics Kit.

Hardware Requirements

A computer (desktop or laptop)

Software Requirements

• WeChat mini-program IDE, for example, the WeChat DevTools
• Package management tool npm and runtime environment Node.js
• Sample code used in this codelab

To integrate Analytics Kit, you must complete the following preparations:

• Create an app in AppGallery Connect.
• Integrate the Analytics SDK.

1. Sign in to AppGallery Connect and click My projects.
2. Find your project and select the app that needs to integrate the Analytics SDK.
3. Select any menu under HUAWEI Analytics and click Enable Analytics service. (You must have the app management permission to perform this operation.)
   
4. On the Project access settings page displayed, set the data processing location and complete other settings. Then click Finish.

In this section, you will try to build a demo with the question answering function to learn how to use the main APIs of Analytics Kit. We have prepared the code for you, meaning you only need to follow the instructions in each step below to learn how to use Analytics Kit to report the events you are interested in, such as answering questions, calculating scores, and setting user attributes.

Download

Importing the Demo Project Using a Development Tool

Starting the Demo Project

1. Open the IDE for WeChat mini-programs and enable the npm function for the current project.
   
2. If the package.json file does not exist in the project, run the following command in the root directory of the project to create it:

   npm init
   

3. Start the CLI, go to the root directory of the project, and run the following command to install project dependencies:

   npm install --save @hw-hmscore/analytics-sdk-miniprogram
   

4. Go to Tools > Build npm to build the npm library file of the current project.
   
5. Click Compile or Preview in the IDE.
   
   • Click Compile to view the effect on an emulator.
   • Click Preview to view the effect on a real device.

6. View the demo effect.

   

   Your app is so far loaded with the required functions. Next, you will use Analytics Kit to report the events that interest you.

Installing SDK Dependencies

As npm is used as the package management tool, you can run the npm install command to install required dependencies. In this codelab, the SDK dependencies have been added to the package.json file, and required SDKs have been installed after the npm install command is executed in the previous step. You can check the dependencies or manually run the following command to install the dependencies:

npm install --save @hw-hmscore/analytics-sdk-miniprogram

Importing and Initializing the SDK

1. Open the app.js file and add the following code:

   // TODO: Import necessary modules.  
   import agconnect from '@agconnect/api';  
   import '@agconnect/instance';  
   import '@hw-hmscore/analytics-sdk-miniprogram';
   

2. Sign in to AppGallery Connect, click My projects, find your project, and select the app that needs to integrate the SDK. Go to Project settings, copy the agConnectConfig code snippet to your project, and initialize the SDK. In addition, you need to sign in to the WeChat Official Accounts Platform and add the url and collector_url configuration in the SDK code snippet to the domain name trustlist.

   // TODO: Replace the following code with the configuration of your app. 
   const agConnectConfig = { 
   // ... 
   }; 
   // Initialize the configuration. 
   agconnect.instance().configInstance(agConnectConfig); 
   // Initialize the Analytics Kit instance. 
   let analytics = agconnect.analytics();
   

3. Mount the Analytics Kit instance to the app's global variable so that APIs of Analytics Kit can be called from other files. The sample code uses globalData in the app.js file as the global variable.
   Assign values to global variables in the app.js file.

   this.globalData.analytics = agconnect.analytics(); 
   this.globalData.agconnect = agconnect;
   

4. Open the answerdemo.js file and add the following code to import the dependencies:

   const app = getApp();
   

5. Add the following code to implement the reportAnswer method (for reporting a custom event as an example):

   reportAnswer(answer) {  
          // TODO: Report a custom event. 
         let answerTime = this.formatDate();  
         let reportMessage = {  
            question: this.data.questions[this.data.currentNumber],  
            answer: answer,  
            answerTime: answerTime  
         }  
         app.globalData.analytics.onEvent("Answer", reportMessage);  
    }
   
   

6. Add the following code to implement the postScore method (for reporting a predefined event as an example):

   postScore() {  
         // TODO: Report a score through the SUBMITSCORE event.  
         let scoreMessage = {} 
         scoreMessage[app.globalData.agconnect.analytics.ParamName.SCORE] = this.data.score; 
         app.globalData.analytics.onEvent(app.globalData.agconnect.analytics.EventName.SUBMITSCORE, scoreMessage); 
    }
   
   

Modifying the Setting.js File

Add the following code to save user attributes:

save() {  
       this.data.sport && app.globalData.analytics.setUserProfile('favor_sport', this.data.sport);  
       wx.navigateBack();  
 }

Click Preview to start the app and trigger event reporting as prompted.

1. Sign in to AppGallery Connect and click My projects.
2. Find your project, and click the app to view its data.
3. Go to HUAWEI Analytics > Overview > Real-time overview.
4. Check the data. For details, please refer to the Analytics Kit operation guide.

FAQs

How should I perform initialization?

Perform initialization at the beginning of the app.js file. Otherwise, the processing of automatically collected lifecycle events may be affected.

How does Analytics Kit identify users?

Analytics Kit identifies users through an Anonymous Application ID (AAID).

When will the AAID be reset? How does Analytics Kit collect user statistics after AAID reset?

The AAID will be reset in the following scenarios:

• The AAID has expired.
• The user clears the mini-program data.
  A user is counted as a new one after the AAID is reset.

Why can't I view the analysis result of the data reported during the test?

You can only view some analysis results on the Real-time overview page. Analysis results on other pages such as Event analysis and Launch analysis are available the day after the corresponding data is processed.

Well done. You have successfully completed this codelab and learned how to:

• Integrate Analytics Kit.
• Call APIs of Analytics Kit.

For more information, please click the following link:

Related documents
To download the sample code, please click the button below:

Download