Creating a Network Log

In this topic, you will learn how to create and save a network log from a Chrome browser. This is sometimes required when working with support, and they will ask you to send the log to them.

Video overview

The following video shows the process of creating the network log from the Chrome browser. You will save the network log as an HTTP Archive (HAR) file, which is a JSON-formatted archive file format used for logging web browser interaction with a site.

Note that the steps here guide you through creating a network log to help diagnose playback issues, but there are other cases (problems uploading videos or media assets, for example) where network logs are useful.

Once you have the developer tools open, reproduce the issue you are having in full, from the very beginning. (You may need to refresh the page to achieve this.)

For example, if you are having a problem with playback, open the developer tools, then refresh the page that contains the player, and then wait until the playback issue occurs.

If you are having a problem with uploading, open the developer tools, then start uploading, and then wait until the upload reaches failure or completion.

The developer tools need to be open before, during, and after the issue is reproduced.

Following the video, the process for creating a network log related to playback issues is shown in a step-by-step format.

Create a network log from Chrome

The following steps lead you through using Chrome to create a network log.

  1. Open a Chrome browser window or tab.
  2. To be sure cached information in the browser does not affect the network log, you will first clear browsing data. To begin this process, from the options menu (three vertical dots) click the Clear browsing data... option.
    Menu to clear browsing data
  3. Now in the actual interface, make the selections as shown in the following screenshot and click Clear browsing data button.
    Clear browsing data
  4. In the browser, again from the options menu, select Developer Tools.
    Menu to developer tools
  5. Select the Network tab from the Developer Tools.
    Network tab
  6. Paste the URL to the page that contains the Brightcove Player you are troubleshooting into the browser's address bar, and then press Enter to load the page. You will immediately see network traffic in the Network tab.
  7. Start the video if network traffic is needed when the player is playing a video.
  8. Once you have the needed network traffic, right-click in the traffic area and select Save as HAR with Content option.
    Save as HAR option
  9. Save the file and send it to the appropriate support personnel.

Create a network log from Firefox

The following steps lead you through using Firefox to create a network log.

  1. Open a Firefox browser window or tab.
  2. To be sure cached information in the browser does not affect the network log, you will first clear browsing data. To begin this process, from the options menu (three vertical lines), select the Settings option and then Privacy & Security.
    Firefox preferences
  3. Scroll down. To the right of Cookies and Site Data, click Clear Data.
    Clear Firefox cache
  4. Close the Settings tab.
  5. In the browser, again from the options menu, select More tools, then Web Developer Tools and then Network.
    Select Network option
  6. Paste the URL to the page that contains the Brightcove Player you are troubleshooting into the browser's address bar, and then press Enter to load the page. You will immediately see network traffic in the Network tab.
  7. If network traffic is needed for when the player is playing a video, start the video.
  8. Once you have the needed network traffic, right-click in the traffic area and select the Save All As HAR option.
    Save as HAR option
  9. Save the file and send to the appropriate support personnel.

Create a web archive from Safari

The following steps lead you through using Safari to create a web archive (.webarchive) file. This is not the same as a HAR file.

  1. Open a Safari browser window or tab.
  2. To be sure cached information in the browser does not affect the network log, you will first clear browsing data. If you don't see the Develop menu in the top menu, then from the Safari menu, select Safari and then Settings.
  3. In the Settings dialog, select Advanced and then select Show features for web developers.
    Safari Develop menu
  4. From the Safari menu bar, select Develop and then select Empty Caches.
  5. Paste the URL to the page that contains the Brightcove Player you are troubleshooting into the browser's address bar, and then press Enter to load the page.
  6. From the Safari menu bar, select Develop and then select Show Web Inspector.
    Web inspector
  7. In the web inspector, select the Network tab.
  8. Reload your web page in the browser. You will immediately see network traffic in the Network tab.
  9. If network traffic is needed for when the player is playing a video, start the video.
  10. Once you have the needed network traffic, click Export to generate a HAR file.
    Download Web Archive
  11. Save the file. This file may not contain the network information that support personnel may need to help with your issue.