Inspect Network Traffic with Android Studio Flamingo

The Network Inspector is a tool that shows you how your app is using the internet, by displaying a timeline of the data sent and received. With this tool, you can check how your app is transferring data and improve the code to make it work better.

How to open App Inspection > Network Inspector

Method 1

1. Look for the navigation bar at the top of the Android Studio interface.
2. Click on the “View” menu option located in the navigation bar.
3. From the drop-down list that appears, click on “Tool Windows”.
4. In the list of Tool Windows options, select “App Inspection”.

By doing so, you should be able to access the App Inspection feature in Android Studio.

Method 2

you can find it in bottom on android studio. Just click on App Inspection and you are there.

App inpection

You can select the Network Inspector tab.

Select the device and app process you want to inspect from the App Inspection window.

The Network Inspector has a timeline at the top that shows events in real-time. If you click and drag on the timeline, you can select a specific portion of it and see more details about the network activity during that time. This allows you to inspect the data being sent and received by your app during that period and analyze it more closely.

The Network Inspector displays the request and response events as colored sections on the timeline. The yellow section indicates the time period when the request was being sent from your app to the server. The blue section shows the time period when the response was being received by your app from the server. The beginning of the blue section is when the first byte of the response was received, and the end of the blue section is when the final byte of the response was received. This helps you to see the timing and duration of the network activity between your app and the server in a visual way.

In the tab below timeline, you can select tab for more details.

1. Connection view: The Network Inspector lists files that were sent or received during a selected portion of the timeline, across all of your app’s CPU threads. It provides information about the size, type, status, and transmission duration of each request. You can see a detailed breakdown of the selected timeline showing when each file was sent or received.
   Also, when you select and item, you will get complete details for that API call.
2. Thread view: The Network Inspector displays network activity on each of your app’s CPU threads, allowing you to see which threads are responsible for each network request.
3. Rules view: Rules help test how your app handles different server responses, including status codes, headers, and message bodies, to ensure that your app works correctly and responds appropriately to errors.

Now, we will try to explore Rules view more.

Rules View

As we came to know, Rules allows us to modify network responses and headers in real-time to simulate different scenarios, which can help us to test and validate your app’s behaviour and improve its performance and reliability. We will learn how we can use this.

if you’ve used a network proxy before to alter API responses (like Charles), then think of rules as a toned-down, more user-friendly version — like Charles’ little brother who’s just starting out in the proxy game. 😎

Steps

1. Go to Rules tab.
2. Give an appropriate name to the new rule you are going to create.
3. the “Origin” subsection allows you to specify details about the response source you want to intercept, such as the server’s hostname or path. This ensures that the rule only applies to the intended requests and avoids accidental changes to other requests. Also wildcards are supported. If you keep suppose host name empty, if will become generic.
4. The “Response” subsection in the rules configuration allows you to specify how and where to modify the response that you intercepted.
5. To enable or disable a rule, you can check or uncheck the “Active” box next to the rule. The order of the rules listed determines the order in which they are applied.

GET request

you can add your rules as shown above for a GET request.

POST request

you can add your rules as shown above for a POST request.

Add query params

Request body modification

when you go Body rules and click on +. you will get a pop up to enter your desired response. you can select checkbox to replace entire body.

All set to go! now you can run your App. and check the response detail in connection view. Also will get displayed in your App.

Happy Learning!
Please share any suggestion.