Capture Network Logs (NetLog) from Edge and Chrome (and Electron)

Problems in accessing websites can often be found and fixed if the network traffic between the browser and the website is captured as the problem occurs. This short post explains how to capture such logs.

Capturing Network Traffic Logs

If someone asked you to read this post, chances are good that you were asked to capture a web traffic log to track down a bug in a website or your web browser.

Fortunately, in Google Chrome or the new Microsoft Edge (version 76+), capturing traffic is simple:

1. Optional but helpful: Close all browser tabs but one.
2. Navigate the tab to chrome://net-export
3. In the UI that appears, press the Start Logging to Disk button.
4. Choose a filename to save the traffic to. Tip: Pick a location you can easily find later, like your Desktop.
5. Reproduce the networking problem in a new tab. If you close or navigate the //net-export tab, the logging will stop automatically.
6. After reproducing the problem, press the Stop Logging button.
7. Share the Net-Export-Log.json file with whomever will be looking at it. Optional: If the resulting file is very large, you can compress it to a ZIP file.

Network Capture UI

Privacy-Impacting Options

In some cases, especially when you dealing with a problem in logging into a website, you may need to set either the Include cookies and credentials or Include raw bytes options before you click the Start Logging button.

Note that there are important security & privacy implications to selecting these options– if you do so, your capture file will almost certainly contain private data that would allow a bad actor to steal your accounts or perform other malicious actions. Share the capture only with a person you trust and do not post it on the Internet in a public forum.

Tutorial Video

If you’re more of a visual learner, here’s a short video demonstrating the traffic capture process.

In a followup post, I explore how developers can analyze captured traffic.

-Eric

Appendix A: Capture on Startup

In rare cases, you may need to capture network data early (e.g. to capture proxy script downloads and the like. To do that, close Edge, then run

msedge.exe --log-net-log=C:\some_path\some_file_name.json --net-log-capture-mode=IncludeSocketBytes

Note: This approach also works for Electron JS applications like Microsoft Teams:

%LOCALAPPDATA%\Microsoft\Teams\current\Teams.exe --log-net-log=C:\temp\TeamsNetLog.json

I suspect that this is only going to capture the network traffic from the Chromium layer of Electron apps (e.g. web requests from the nodeJS side will not be captured) but it still may be very useful.

Appendix B: Limitations – No POST Data

One important shortcoming in the current NetLog file format is that it does not contain any request body data, even if you select the “Include Raw Bytes” option. If you need the request body data, you may need to collect a HTTP Archive (HAR) file instead.

• Hit F12 to open the Developer Tools.
• Activate the Network tab.
• Ensure the recording button at the top of the tab is red
• Tick the Preserve log checkbox.
• Reproduce the problem
• Right-click entries in the the grid and choose Save all as HAR with content
• Share the HAR file only with a person you trust and do not post it on the Internet in a public forum.

Appendix C: References