Description
This article describes how to access Developer Tools in various web browsers.
Scope
FortiGate.
Solution
Accessing the Developer tools:
|
Browser |
Windows |
Mac |
|
Google Chrome |
Press F12 or go to View -> Developer -> Developer Tools |
View -> Developer -> Developer Tools |
|
Edge |
Press Ctrl + Shift + I |
Not available |
|
Mozilla Firefox |
Select the three horizontal lines (menu) button in the upper-right corner, then select Web Developer -> Inspector or press Ctrl + Shift + I |
Tools -> Web Developer -> Inspector |
|
Safari |
Not available |
First, enable the Develop menu by going to Safari -> Preferences -> Advanced and checking Show Develop menu in menu bar. Then, click the Develop menu item. |
Steps to collect the HAR logs:
- Using the above browser-dependent method, open Developer tools.
- Go to the Network Tab:
- In the Developer Tools panel, navigate to the 'Network' tab. This is where all network requests and responses are logged.
- Select Preserve Log:
- Check the 'Preserve log' box. This ensures that the network log data is not cleared upon navigating to a new page, which is crucial for capturing information across different page loads, especially when diagnosing issues like a login failure.
- Recreate the Error:
- Perform the actions that lead to the error being investigated. If necessary, refresh the page by pressing F5 or Ctrl + R (Windows/Linux) or Cmd + R (Mac) to reproduce the error.
- Wait for the Error to be Reproduced:
- Allow the page to fully load and the error to occur while keeping an eye on the network requests in the Developer Tools.
- Export HAR File:
- Upon capturing the necessary network activity, look for the 'Export HAR' button or option. This is typically found as a small button with an arrow or in a context menu (usually denoted by three dots or lines) within the Network tab.
- Select this button to save the HAR (HTTP Archive) file to disk. This file contains all of the network data collected, and can be used for further analysis or shared with support teams.
How to analyze an HAR File after capture:
With Har File Viewer, it is possible to upload the zip file and analyze the content:
Example:
HAR file can also be opened back to the browser. Open Developer Tools -> Select Network -> Select Upload icon and browse the HAR file.
Example:
