You can use a hook function to customize the configuration for resource speed test data reporting, and the system will calculate and collect the function execution duration. Then, you can use custom speed test to analyze the function execution duration in multiple dimensions.
onBeforeRequest
This hook function will be called before all requests are sent, and all request content will be passed in to its parameters. The content to be reported must be returned.
function changeURLArg(url,arg,arg_val) {
var pattern=arg+' = ([^&]*)';
var replaceText = arg+'='+arg_val;
if (url.match(pattern)) {
var tmp = '/('+ arg+'=)([^&]*)/gi';
tmp = url.replace(eval(tmp),replaceText);
return tmp;
}
return url;
}
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
onBeforeRequest(log) {
if (log.type === 'performance') {
log.url = changeURLArg(log.url, 'platform', type)
}
return log
}
});
beforeReport
1. This hook will be executed before log reporting (by the /collect?
API); for example:
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
beforeReport(log) {
console.log(log);
return log;
}
});
throw new Error('An error occurred.');
Note:
The above log
will have the following fields:
1. level
: log level. For example, '4'
indicates error log.
2. msg
: log content.
3. Below are all log levels:
{ level: '1', name: 'API request log (allowed log)' }
{ level: '2', name: 'General log (aegis.info or aegis.infoAll)' }
{ level: '4', name: 'JavaScript execution error' }
{ level: '8', name: 'Promise error' }
{ level: '16', name: 'Ajax request exception' }
{ level: '32', name: 'JavaScript loading exception' }
{ level: '64', name: 'Image loading exception' }
{ level: '128', name: 'CSS loading exception' }
{ level: '256', name: 'console.error (reserved)' }
{ level: '512', name: 'Audio/Video resource exception' }
{ level: '1024', name: 'retcode exception' }
{ level: '2048', name: 'aegis report' }
{ level: 4096, name: 'PV' }
{ level: 8192, name: 'Custom event' }
2. If this hook returns false
, the log won't be reported. This feature can be used to filter out errors that don't need to be reported; for example:
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
beforeReport(log) {
if (log.level === '4' && log.msg && log.msg.indexOf('An error that doesn't need to be reported') !== -1) {
return false
}
return log;
}
});
throw new Error('An error that doesn't need to be reported');
In the above sample code, if the error content contains the An error that doesn't need to be reported
keywords, it won't be reported to the RUM backend.
onReport
This hook is executed after a log is successfully reported, and its usage is similar to that of beforeReport
. Their only difference is that all parameters received by this hook are of an already reported log, but the parameters received by beforeReport
are of a log to be reported.
beforeReportSpeed
1. This hook will be executed before the speed test data is reported (/speed?
); for example:
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
reportApiSpeed: true,
reportAssetSpeed: true,
beforeReportSpeed(msg) {
console.log(msg);
return msg
}
});
Note:
The above msg
will have the following fields:
1. url
: request address of this resource.
2. type
: resource type. Valid values: fetch
: Aegis will report the resource as an API request; static
: Aegis will report the resource as a static resource.
3. duration
: resource request duration.
4. method
: http method
used when the resource is requested.
5. status
: status code returned by the server.
6. payload
: complete resource request information provided to you (this field won't be reported to the Aegis backend and can be manipulated by you)The complete data structure is as follows:
payload.type
: resource request type, which is used to distinguish between the original request types. Valid values: 'fetch'
and 'xhr'
.
payload.sourceURL
: complete URL request connection.
payload.status
: request status code.
payload.headers
: all request headers, whose values are all strings.
payload.data
: complete request resource, which you can customize. If the request type is fetch
, it is the response
object; if the request type is xhr
, it is the XMLHttpRequest
object.
In the above sample code, every time after Aegis collects the loading details of a resource, it will use such details (i.e., msg
returned above) as parameters to call the beforeReportSpeed
hook.
2. If you have configured this hook, the final content reported by Aegis is subject to the execution result of the hook; for example:
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
reportApiSpeed: true,
reportAssetSpeed: true,
beforeReportSpeed(msg) {
msg.type = 'static';
return msg;
}
});
In the above sample code, all msg.type
parameters are set to static
, indicating that all resources, even API requests, will be reported as static resources.3. You can use this hook to correct the Aegis type and judge incorrect requests.
Samples
You have an API https://example.com/api
whose response header Content-Type
is text/html
. In normal case, RUM will report this API as a static resource; however, it must be reported as an API request in your business. Then, you can configure Aegis with following hook for correction:
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
reportApiSpeed: true,
reportAssetSpeed: true,
beforeReportSpeed(msg) {
if (msg.url === 'https://example.com/api') {
msg.type = 'fetch';
}
}
});
1. You can also block the speed test data reporting of a resource as follows:
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
reportApiSpeed: true,
reportAssetSpeed: true,
beforeReportSpeed(msg) {
if (msg.url.indexOf('https://example.com/api') !== -1) {
return false
}
}
});
beforeRequest
This hook will be executed before log reporting; for example:
Note:
The SDK version must be 1.24.44 or above.
const aegis = new Aegis({
id: 'pGUVFTCZyewxxxxx',
beforeRequest: function(msg) {
if (msg.logs && msg.logs.level === '4' && msg.logs.msg && msg.logs.msg.indexOf('An error that doesn't need to be reported') !== -1) {
return false
}
return msg;
}
});
Here, msg
will have the following fields:
1. logType: log type. Valid values:
custom: custom speed test.
event: custom event.
log: log.
performance: page speed test.
pv: PV.
speed: API and static resource speed test.
vitals: Web Vitals.
2. logs: reported log content:
If logType
is 'custom'
, logs
will be in the format of {name: "white screen time", duration: 3015.7000000178814, ext1: '', ext2: '', ext3: ''}
.
If logType
is 'event'
, logs
will be in the format of {name: "ios", ext1: "", ext2: "", ext3: ""}
.
If logType
is 'performance'
, logs
will be in the format of {contentDownload: 2, dnsLookup: 0, domParse: 501, firstScreenTiming: 2315, resourceDownload: 2660, ssl: 4, tcp: 4, ttfb: 5}
.
If logType
is 'speed'
, logs
will be in the format of {connectTime: 0, domainLookup: 0, duration: 508.2, isHttps: true, method: "get", status: 200, type: "static", url: "https://xxxxxx", urlQuery: "max_age=1296000"}
.
If logType
is 'vitals'
, logs
will be in the format of {delta: 1100, entries: [PerformancePaintTiming], id: "v1-1629344653118-4916457684758", name: "LCP", value: 1100}
.
If logType
is 'log'
, logs
will be in the format of {msg: "log details", level: '4', ext1: '', ext2: '', ext3: '', trace: ''}
.
Note:
Valid values of level
:
{ level: '1', name: 'API request log (allowed log)' }
{ level: '2', name: 'General log (aegis.info or aegis.infoAll)' }
{ level: '4', name: 'JavaScript execution error' }
{ level: '8', name: 'Promise error' }
{ level: '16', name: 'Ajax request exception' }
{ level: '32', name: 'JavaScript loading exception' }
{ level: '64', name: 'Image loading exception' }
{ level: '128', name: 'CSS loading exception' }
{ level: '256', name: 'console.error (reserved)' }
{ level: '512', name: 'Audio/Video resource exception' }
{ level: '1024', name: 'retcode exception' }
{ level: '2048', name: 'aegis report' }
{ level: 4096, name: 'PV' }
{ level: 8192, name: 'Custom event' }
If this hook returns false
, the log won't be reported. This feature can be used to filter out errors and logs that don't need to be reported.
afterRequest
This hook will be executed after speed test data reporting; for example:
Note:
The SDK version must be 1.24.44 or above.
const aegis = new Aegis({
id: "pGUVFTCZyewxxxxx",
afterRequest: function(msg) {
console.log(msg);
}
});
Here, msg
will have the following fields:
1. isErr: whether the request reporting API has an error.
2. result: response of the reporting API.
3. logs: reported log content.
4. logType: log type, which is the same as logType
in beforeRequest
.
Was this page helpful?