In browser monitoring, you do not know the performance of the network transmission or the trace and performance of backend services even if you know the API response time. Therefore, you cannot immediately troubleshoot API errors in applications. The front-to-back tracing feature can resolve this issue. This feature connects the frontend and backend traces of an API request to reproduce the code execution process.
Prerequisites
Background information
Configure ARMS browser monitoring
The API and the domain name of the application have the same origin.
The API and the domain name of the application do not have the same origin.
Principle
- If automatic API reporting is enabled and the API and the domain name of the application have the same origin, the EagleEye-TraceID and EagleEye-SessionID custom headers are added to the API request headers. EagleEye-TraceID is the identifier of the trace that connects the frontend and backend.
- If the API and the domain name of the application do not have the same origin, no custom headers are added to the API request headers. This ensures that the application can send requests as expected.
- To check whether the front-to-back tracing configurations have taken effect, go to
the console and view the API request headers. If the EagleEye-TraceID and EagleEye-SessionID
headers are included in the API request headers, the configurations have taken effect.
Warning The values of EagleEye-TraceID and EagleEye-SessionID are automatically generated. We recommend that you do not manually set the values.
Scenarios and cases
If a request takes a longer time than expected, you can determine whether the cause is network transmission or backend call process based on the call timeline. You can also click thread profiling of the backend application to view the complete backend trace of the request. In this case, you can identify the cause of an API error based on the business.
-
Locate the error if the API returns an error code or a business logic error occurs.
- Log on to the ARMS console.
- In the left-side navigation pane, click Browser Monitoring. On the Browser Monitoring page, click the name of the application. In the left-side navigation pane, click API Request.
-
On the API Failure List tab of the API Link Trace(Top20) section, find the API or trace ID, and click Link Trace. You can then view the overall response time of browser monitoring and the call sequence chart of the backend application.
-
Determine whether the network transmission or backend call process takes a longer time based on the call timeline.
-
Click the Magnifier icon in the Method Stack column of the backend application to view the overall backend trace of the request. You can then locate the cause of the API error based on the business.
-
Locate the error if the response time of the API is longer than expected.
- Log on to the ARMS console.
- In the left-side navigation pane, click Browser Monitoring. On the Browser Monitoring page, click the name of the application. In the left-side navigation pane, click API Request.
-
In the API Link Trace(Top20) section, the APIs are sorted in descending order by response time. or trace ID. You can find the API or trace ID whose response time is longer than expected,
-
and click Link Trace. You can then view the overall response time of browser monitoring and the call sequence chart of the backend application.
- If the processing time of the backend application is short but the overall response time is long, the network transmission takes a longer time. Click View Details. On the details page, view the network, region, browser, device, and operating system of the access request.
- If the backend application takes a long time to process the access request, the backend processing performance is poor. Click the Magnifier icon in the Method Stack column. In the dialog box that appears, check which part of backend tracing is time-consuming to locate the problem.