Skip to main content
All CollectionsIntegrations
Integrating Core Web Vitals Data with Botify
Integrating Core Web Vitals Data with Botify
Updated over 4 months ago

πŸ›  This article describes how to set up your Botify project to ingest your Core Web Vitals field metrics.

Overview

Core Web Vitals field metrics integration in Botify is based on the Chrome User Experience Report (CrUX) API. This Google API is powered by real user measurement of key user experience metrics across the public web.

Prerequisite

You must have your Google Search Console (GSC) performance data integrated with your Botify project for Botify to ingest your Core Web Vitals field metrics. Because field metrics are only available on your most visited URLs, we will query the Google API to request Core Web Vitals on your most clicked pages based on GSC data.

Setting up the Integration

In addition to this prerequisite, you will need to complete the following for each project before Botify can start ingesting your Core Web Vitals field metrics:

Create a Dedicated Google API Key

Botify will access the Chrome UX Report API on your behalf to import your Core Web Vitals data. This Google API is free: there are no additional costs to you.

To create the API key:

  1. Log in to your Google account and navigate to APIs & Services > Credentials.
    ​

  2. Click the Create Project link.
    ​

    ​

  3. Create a new GCP project with a name between 4 and 30 characters using only letters, numbers, spaces, and hyphens, and then click Create.
    ​

    ​

  4. From the Create Credentials menu, select API key.
    ​

    ​

  5. The generated API Key displays. Copy the key to your system clipboard.
    ​

Enable the CrUX API

  1. Navigate to the Chrome UX Report API page.

  2. Select the project associated with the API Key you created above from the dropdown list.

  3. Click the Enable button to enable the CrUX API.
    ​

  4. Optional for developers: To test if the API key is operational, use the following command in the terminal with the URL of your homepage and your API Key:

curl https://chromeuxreport.googleapis.com/v1/records:queryRecord?key=YOUR_API_KEY \ --header 'Content-Type: application/json' \ --data '{"url": "URL_OF_YOUR_HOMEPAGE", "formFactor": "desktop"}'

Restrict the API Key

Since we only use the Chrome UX Report API provided by Google, we recommend you edit the API key to restrict access to only this API.

To edit the API key:

  1. Click the Edit API key link in the API creation confirmation dialog.

  2. In the API Restrictions section, select the Restrict key option.

  3. Select "Chrome UX Report API" from the dropdown list, then save.

🚧 Important:

If you have multiple Botify projects, you must create an API Key and a linked GCP project for every Botify project. Google applies quotas per API Key and related GCP projects: sharing a single API Key on multiple projects will impact the number of URLs from which Botify can get Core Web Vitals field metrics.

Adding the API Key to Project Settings

After creating a dedicated API Key, wait a few minutes for the key to become active, and then follow these steps to add the key to your Botify project. Repeat these steps with different API Keys if you have multiple projects.

  1. In Botify, navigate to your Project Settings using the cog icon in the bottom left corner.
    ​

  2. In the Data Sources section, navigate to the Core Web Vitals tab.

  3. Paste your API Key, then click Save and Import Web Vitals Data. Your API Key will be verified, and an error message will display the information you need if the verification is unsuccessful.
    ​

Botify will start ingesting Core Web Vitals field metrics the day after you save your API key.

πŸ‘‰ Note:

  • As a security measure, your API Key is stored encrypted.

  • Since Google doesn’t provide historical data, you will get Core Web Vitals field metrics from the day you save your key in Botify Settings.

Troubleshooting

One of the following conditions may explain why Botify is not able to ingest your Core Web Vitals data:

API Key Not valid

If you encounter an API Key Not Valid error, please generate a new API Key from the Google Cloud Credentials page. Wait a few minutes for the key to become active, and then copy-paste it into Botify settings as directed above and save the updated API Key.

Valid API Key but CrUX API is not activated

This scenario could happen if you didn't create the API Key via the Credentials page. Repeat the steps in the Enabling the CrUX API section, and copy-paste the key into your Botify project settings again.


Contact Support

If you need any assistance, please contact Support.

Did this answer your question?