Marker.io's Network Requests Recorder is part of our Developer Tools suite, designed to help developers easily understand, reproduce, and fix issues faster by providing logs of all network requests that occurred during a session. This guide is a step-by-step walkthrough of how to use the Network Requests Recorder.
How it Works
Here’s a simple overview of how the Network Requests Recorder functions:
Report an Issue: A user reports a website issue using the Marker.io widget.
Log Network Requests: During the session, all network requests are automatically logged and transmitted.
Review the Logs: Team members can access these logs on the issue page, similar to viewing a browser’s developer tools.
Filter Requests: You can filter recorded logs based on the type of request to make finding specific details easier.
Integration Access: If your project is linked to an integration like Jira, you will have a quick access link to see any failed requests.
Getting Started
Follow these steps to start using the Network Requests Recorder:
Embed the Widget: Add your widget’s snippet code to your website or web application. This is necessary for recording to work correctly.
Enable the Network Requests Recorder:
Go to your project settings.
Find the Developer Tools menu under the widget settings.
Toggle the Network Requests Recorder to 'Enabled' to begin recording network requests.
Exclude Sensitive Data:
You can prevent sensitive data from being recorded by excluding specific values in headers and JSON bodies within your Developer Tools settings.
Handling GraphQL Queries & Repetitive Requests
Important: Some GraphQL queries or API calls may not appear in the logs if Marker.io identifies them as identical, repeated requests without unique identifiers. For example, if your application sends the same endpoint request multiple times without differentiating parameters, those calls may be considered duplicates and filtered out.
How to Ensure All Requests Appear:
Append Unique Parameters: For GraphQL calls, consider appending unique query parameters to the endpoint (e.g.,
https://api.example.com/graphql?operation=GetUserData). Adding an operation name or any unique identifier to the URL ensures that each request is recognized as distinct and will be logged.Use Operation Names: If possible, include the GraphQL operation name in the request URL. This helps Marker.io differentiate one GraphQL call from another.
Viewing Multiple Fetches & Limitations
Currently, the Marker.io UI allows toggling visibility for a limited number of fetch requests at a time. If your application makes many simultaneous requests (e.g., dozens of GraphQL queries or API calls), you may need to:
Adjust Filters: Use the filters to quickly find the request type you need.
Unique Identifiers: Ensure each request is uniquely identifiable as noted above.
Frequently Asked Questions
Here are some common questions users have about the Network Requests Recorder:
Does the Network Requests Recorder slow down my website?
No, it doesn't. The Marker.io script runs entirely in the background and shouldn’t affect your website’s performance. See here for more details.
How do I enable or disable the Network Requests Recorder?
After embedding the Marker.io script on your site, navigate to any project under Widget > Developer Tools > Network Requests and toggle the setting to enable or disable the recorder.
Does it record sensitive information?
Yes, but you have control over what gets recorded. In your Developer Tools settings, you can exclude specific keys from all headers and JSON bodies to protect sensitive information.
Need Help?
If you have any questions, comments, or corrections, chat with us at the bottom right of our web pages.