Mini Program Application Access¶

By introducing the SDK file, collect performance metrics, error logs, and resource request data from mini program applications, and report them to the Guance platform to visually analyze the performance of mini program applications.

Prerequisites (Datakit Access)¶

Install DataKit;
Configure the RUM Collector;
Configure DataKit to be accessible via the public network and install the IP geolocation database.

Start Access¶

Go to RUM > Create Application > Web;
Enter the application name;
Enter the application ID;
Select the application access method:
Public DataWay: Directly receives RUM data without installing the DataKit collector.
Local Environment Deployment: Receives RUM data after meeting the prerequisites.

Access Methods¶

Datakit AccessPublic OpenWay

Ensure DataKit is installed and configured to be accessible via the public network and install the IP geolocation database;
Obtain parameters such as applicationId, env, version from the console, and start accessing the application;
When integrating the SDK, set datakitOrigin to the DataKit domain name or IP.

Obtain parameters such as applicationId, clientToken, and site from the console, and start accessing the application;
No need to configure datakitOrigin when integrating the SDK; data will be sent to the public DataWay by default.

Usage¶

Introduce the code in the mini program's app.js file as follows:

Note: The introduction must be done before the App() initialization.

NPMCDN

For the NPM package introduction method, refer to the official WeChat npm introduction method

const { datafluxRum } = require('@cloudcare/rum-miniapp')
// Initialize Rum
datafluxRum.init({
  datakitOrigin: '<DATAKIT ORIGIN>',// Required, Datakit domain address. Must be added to the WeChat mini program admin backend domain whitelist.
  site: "http://172.16.212.186:9529", // Domain name of the site corresponding to the public DataWay
  clientToken: "a993f53a8ea04bc6b9350e5e670a3a3b", // Client token required for public DataWay reporting, generated when creating the application in the Guance console.
  applicationId: '<Application ID>', // Required, application ID generated by the dataflux platform.
  env: 'testing', // Optional, the environment of the mini program.
  version: '1.0.0', // Optional, the version of the mini program.
  service: 'miniapp', // The service name of the current application.
  trackInteractions: true,
  traceType: 'ddtrace', // Optional, defaults to ddtrace. Currently supports 6 types: ddtrace, zipkin, skywalking_v3, jaeger, zipkin_single_header, w3c_traceparent.
  allowedTracingOrigins: ['https://api.example.com',/https:\/\/.*\.my-api-domain\.com/],  // Optional, a list of all requests allowed to inject the headers required by the trace collector. Can be the request origin or a regex.
})

Download the file and introduce it locally.

const { datafluxRum } = require('./lib/dataflux-rum-miniapp.js')
// Initialize Rum
datafluxRum.init({
  datakitOrigin: '<DATAKIT ORIGIN>',// Required, Datakit domain address. Must be added to the WeChat mini program admin backend domain whitelist.
  site: "http://172.16.212.186:9529", // Domain name of the site corresponding to the public DataWay
  clientToken: "a993f53a8ea04bc6b9350e5e670a3a3b", // Client token required for public DataWay reporting, generated when creating the application in the Guance console.
  applicationId: '<Application ID>', // Required, application ID generated by the dataflux platform.
  env: 'testing', // Optional, the environment of the mini program.
  version: '1.0.0', // Optional, the version of the mini program.
  service: 'miniapp', // The service name of the current application.
  trackInteractions: true,
  traceType: 'ddtrace', // Optional, defaults to ddtrace. Currently supports 6 types: ddtrace, zipkin, skywalking_v3, jaeger, zipkin_single_header, w3c_traceparent.
  allowedTracingOrigins: ['https://api.example.com',/https:\/\/.*\.my-api-domain\.com/],  // Optional, a list of all requests allowed to inject the headers required by the trace collector. Can be the request origin or a regex.
})

Configuration¶

Initialization Parameters¶

Parameter	Type	Required	Default Value	Description
`applicationId`	String	Yes		Application ID created from Guance.
`datakitOrigin`	String	Yes		DataKit data reporting Origin; ❗️ Must be added to the mini program admin backend request whitelist.
`site`	String	Yes (Required for `Public DataWay` reporting)		Domain name of the site corresponding to the public DataWay. Note: `Protocol (including ://), domain name (or IP address) [and port number]`. For example: https://www.dataway.com, http://100.20.34.3:8088
`clientToken`	String	Yes (Required for `Public DataWay`)		Client token required for public DataWay reporting, generated when creating the application in the Guance console.
`env`	String	No		The current environment of the mini program application, e.g., prod: production environment; gray: grayscale environment; pre: pre-release environment; common: daily environment; local: local environment.
`version`	String	No		The version number of the mini program application.
`service`	String	No		The service name of the current application, defaults to `miniapp`, supports custom configuration.
`sampleRate`	Number	No	`100`	Percentage of metric data collection: `100` means full collection, `0` means no collection.
`trackInteractions`	Boolean	No	`false`	Whether to enable user behavior collection.
`traceType`	Enum	No	`ddtrace`	Configure the trace tool type. If not configured, defaults to `ddtrace`. Currently supports 6 types: `ddtrace`, `zipkin`, `skywalking_v3`, `jaeger`, `zipkin_single_header`, `w3c_traceparent`. ❗️ 1. `opentelemetry` supports 4 types: `zipkin_single_header`, `w3c_traceparent`, `zipkin`, `jaeger`. 2. Configuring the corresponding traceType requires setting different `Access-Control-Allow-Headers` for the corresponding API service. Refer to APM How to Associate RUM.
`traceId128Bit`	Boolean	No	`false`	Whether to generate `traceID` in 128 bytes. Corresponds to `traceType`, currently supports `zipkin`, `jaeger`.
`allowedTracingOrigins`	Array	No	`[]`	【New】A list of all requests allowed to inject the headers required by the `ddtrace` collector. Can be the request origin or a regex. Origin: `Protocol (including ://), domain name (or IP address) [and port number]`. _For example: `["https://api.example.com", /https:\\/\\/._\\.my-api-domain\\.com/]`*
`isIntakeUrl`	Function	No	`function(url) {return false}`	Custom method to determine whether to collect data for the corresponding resource based on the request resource URL. Default collects all. Return: `false` means to collect, `true` means not to collect. ❗️ 1. The return result of this parameter method must be of Boolean type, otherwise it is considered an invalid parameter. 2. Version requirement is 2.1.10 and above.

Notes¶

The DataKit domain name corresponding to datakitOrigin must be added to the mini program admin backend request whitelist.
Because the WeChat mini program request resource APIs wx.request and wx.downloadFile currently do not support returning the profile field in the returned data on iOS systems, this leads to incomplete collection of timing-related data in the collected resource information. There is currently no solution: request, downloadFile, API Support Status.
After enabling user behavior collection with trackInteractions, due to WeChat mini program restrictions, it is not possible to collect the content and structure data of controls. Therefore, in the mini program SDK, we adopt a declarative programming approach. By setting the data-name attribute in the wxml file, you can add a name to the interactive element to facilitate locating operation records during subsequent statistics. For example:

<button bindtap="bindSetData" data-name="setData">
  setData
</button>