Objective: Debugging ads on websites is essential to ensure optimal performance and maximize ad revenue. Recording HTTP Archive (HAR) and Charles sessions provides valuable insights into the behavior of ads on your site, enabling you to diagnose issues (such as creative not rendering, line item not delivering etc) and optimize ad delivery. In this guide, we’ll explore step-by-step instructions for recording HAR and Charles sessions specifically tailored to debugging Google Ads.
What is a HAR?
A HAR (HTTP Archive) file is a log of a web browser’s interaction with a website. It contains detailed information about each request made by the browser, including request and response headers, cookies, timings, and more. Google HAR Analyser report files are often used for debugging web performance issues and analyzing website behavior by using har analyzer.
Recording Google or your web browser’s HAR Sessions for Ad Troubleshooting and Debugging:
1. Open Developer Tools: Launch your web browser and navigate to the webpage containing Ads that you want to debug.
2. Access Developer Tools: Press F12 or right-click anywhere on the page and select “Inspect” to open the Developer Tools panel.
3. Navigate to Network Tab: In the Developer Tools panel, go to the “Network” tab.
4. Start Recording: By default the recording will be ‘ON’. If not, click the “Record” button or press Ctrl + E to begin recording network activity.
5. Refresh the Page: To trigger the loading of Ads and recording the ad requests in Network tab.
6. Save HAR File: Right-click anywhere on the network log and select “Save as HAR with Content” to save the HAR file locally.
7. Open saved HAR: Once the HAR file is saved, you can open this using below tools:
- HAR Analyzer : Click on choose file > Select the saved .har file.
- Charles. Click on File > Open > Select the .har file you saved.
What is Charles?
Charles is a web debugging proxy application that allows you to monitor and inspect the HTTP and HTTPS traffic between your web browser and the internet. With Charles, you can view detailed information about each request and response, including headers, bodies, timings, and more. Charles can also record sessions, allowing you to save and analyze the HTTP traffic for later inspection.
Recording Charles Sessions:
- Download and Install Charles: Download and install Charles proxy software from the official website.
- Configure Proxy Settings: Open Charles and go to the “Proxy” menu. Ensure that “Enable Proxy” is checked.
- Configure Proxy Settings: In your charles proxy settings, configure the proxy to point to localhost on port 8888 (default for Charles).
- Install the Charles SSL certificate: From the menu, select Help > SSL Proxying > Install Charles Root Certificate.
- If you want to record a session for a mobile device, first ensure your mobile proxy IP address and port is the same as shown in your charles app. (Below is a example from iOS device).
- Next step is to install the SSL certificate. For mobile or any remote device, install the certificate by visiting the site ‘chls.pro/ssl’.
- If its a iOS 10 device, first download the certificate from the your browser using the link: chls.pro/ssl and enable the certificate by navigating to Settings > General > About > Certificate.
- Once the above steps are done, you will get a notification on your charles app requesting permission to allow the device. Click on Allow.
- Start Recording: Ensure the recording button is toggled ‘ON’. By default it will be ‘ON’.
- Open/Refresh the Page: With Charles running, navigate to the webpage which you want to troubleshoot. Charles will automatically start recording network logs.
- Stop Recording: Once the desired logs are captured, click the “Stop Recording” button in Charles.
- Save Session: Save the Charles session file (.chls) by pressing ‘Ctrl + S’ or ‘File > Save session’, for further analysis.
Parameters you can look in HAR/Charles for troubleshooting Ad calls.
- Open the HAR Analyzer.
- Click on ‘Choose file’ and open the Google or respective platform’s HAR file you saved.
- Similarly if you are using Charles, open the saved .chls session in charles app.
- Search for the Ad call/request by appending ‘securepubads’.
- You will get ad calls/requests triggered from the page, click on any one of the ad requests you want to debug.
Below are a few important parameters which will be helpful for you to debug the ad requests:
| Parameters | Description |
|---|---|
| Request URL | Full Ad Request URL |
| Status code | It should be alway 200, if you find any other number it means there is some issue in the ad request. |
| Remote Address | Gives IP address from where the page is accessed. |
| Google-Creative-Id | Gives you the creative ID served from GAM |
| Google-Lineitem-Id | Gives you the line item ID served from GAM -1: Adx served for this request -2: Request went unfilled |
| iu_part | This will give you the ad unit path. For example: 1431212:1024243,Test,abc - 1431212: Parent GAM Network code - 1024243: Child GAM Network code - Test: Parent Ad unit - abc: Child Ad unit |
| prev_iu_szs | Ad slot sizes sent in the ad request |
| prev_scp | Give you slot level key values passed in the ad request |
| cust_params | Gives you page level key values passed in the ad request |
| Adks | This gives the ad slot IDs. These IDs are unique to each slot. |
What support does DataBeat offer?
The DataBeat Ad Ops team offers invaluable support in leveraging HAR and Charles sessions for ad troubleshooting. With our expertise, we analyze recorded data to identify patterns and anomalies, troubleshoot issues affecting ad performance, and provide strategic recommendations to optimize ad delivery and effectiveness. Through collaboration with publishers and continuous optimization efforts, the Ad Ops team ensures that ads are optimized, driving maximum revenue generation and campaign success.
