Redacting Sensitive Data

Sometimes, URLs and query parameters may contain sensitive data. This could be a user ID, a token, an order ID, or any other data that you don't want to be sent to Vercel Analytics. In this case, you may not want them to be tracked automatically. To prevent sensitive data from being sent to Vercel, you can pass in the beforeSend function that allows modifying data before it is sent to us.

You can return null if you want to ignore the event, otherwise you can return it so it's being tracked correctly.

<Analytics
  beforeSend={(event) => {
    if (event.url.includes('/private')) {
      return null;
    }
    return event;
  }}
/>

To apply changes to the event, you can parse the URL and adjust it to your needs before you return the modified event.

In this example the query parameter secret gets removed on all events.

<Analytics
  beforeSend={(event) => {
    const url = new URL(event.url);
    url.searchParams.delete('secret');
    return {
      ...event,
      url: url.toString(),
    };
  }}
/>

You can also use beforeSend to allow users to opt-out of all tracking by setting a localStorage value (for example va-disable).

<Analytics
  beforeSend={(event) => {
    if (localStorage.getItem('va-disable')) {
      return null;
    }
    return event;
  }}
/>

If you are using a non-React based framework and use the inject function, you can pass beforeSend in the options object.

import { inject } from '@vercel/analytics';

inject({
  beforeSend: (event) => {
    if (event.url.includes('/private')) {
      return null;
    }
    return event;
  },
});