---
title: Load Google Analytics script based on user location in Next.js
description: Learn how you can conditionally load a Google Analytics script based on your user's location
url: /kb/guide/geolocation-script
canonical_url: "https://vercel.com/kb/guide/geolocation-script"
published: 2025-11-03
last_updated: 2025-11-10
authors: Steven Tey
related:
  - /docs/edge-network/headers
install_vercel_plugin: npx plugins add vercel/vercel-plugin
---
<!-- docsgraph:related -->
## Related pages

> **For AI agents:** Follow these links to understand how this page connects to the rest of the Vercel ecosystem. For the full cross-link map (inbound, outbound, prerequisites, and semantic neighbors), see the .graph.md link below.

- [Analytics](https://docs.vercel.shop/docs/skills/enable-analytics?from=related) — Add Vercel Analytics, Vercel Speed Insights, and Google Tag Manager to the storefront.
- [@vercel/analytics](https://vercel.com/docs/analytics/package?from=related) — With the @vercel/analytics npm package, you are able to configure your application to send analytics data to Vercel.
- [Redacting Sensitive Data](https://vercel.com/docs/analytics/redacting-sensitive-data?from=related) — Learn how to redact sensitive data from your Web Analytics events.
- [Scripts](https://nextjs.org/docs/app/guides/scripts?from=related) — Optimize 3rd party scripts with the built-in Script component.
- [Analytics](https://nextjs.org/docs/app/guides/analytics?from=related) — Measure and track page performance using Next.js Speed Insights
- [Third Party Libraries](https://nextjs.org/docs/app/guides/third-party-libraries?from=related) — Optimize the performance of third-party libraries in your application with the `@next/third-parties` package.
- [Scripts](https://nextjs.org/docs/pages/guides/scripts?from=related) — Optimize 3rd party scripts with the built-in Script component.
- [Third Party Libraries](https://nextjs.org/docs/pages/guides/third-party-libraries?from=related) — Optimize the performance of third-party libraries in your application with the `@next/third-parties` package.
- [Privacy](https://vercel.com/docs/analytics/privacy-policy?from=related) — Learn how Vercel supports privacy and data compliance standards with Vercel Web Analytics.

Full cross-link map for this page: [/kb/guide/geolocation-script.graph.md](/kb/guide/geolocation-script.graph.md)
<!-- /docsgraph:related -->


When you build a site, you might want to load a script based on your users' location.

For example, you may want to only load Google Analytics in certain countries. This could be due to privacy laws amongst other reasons. Being able to load scripts based on conditions can make compliance easier.

On Vercel, you can use the [`x-vercel-ip-country` header](https://vercel.com/docs/edge-network/headers#x-vercel-ip-country) with a lazy loaded server component to conditionally load a script.

## Example

In this example you will see how to only load a Google Analytics script for countries outside of the European Union.

```tsx
import { headers } from 'next/headers'
import Script from 'next/script'
import { EU_COUNTRY_CODES } from '@/lib/constants' // list of EU country codes in ISO 3166-1 format

export default function Analytics() {
  const countryCode = headers().get('x-vercel-ip-country') || 'US'

  if (EU_COUNTRY_CODES.includes(countryCode)) {
    return null
  }

  return (
    <Script src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID" />
  )
}
```

In the code above, we use the `headers()` [function](https://nextjs.org/docs/app/api-reference/functions/headers) from [Next.js](https://nextjs.org/) to read the `x-vercel-ip-country` header of the incoming request, determine the user's location, and render the GA script only if the user is not located in an EU country using Next.js' [Script component](https://nextjs.org/docs/app/api-reference/components/script).

You can then import this component using `Suspense` in your root layout:

```tsx
import { Suspense } from 'react'
import Analytics from './analytics'

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <body>
        <Suspense>
          <Analytics />
        </Suspense>
        {children}
      </body>
    </html>
  )
}
```

This will ensure the `<Analytics/>` component is imported dynamically without blocking the render of the main layout.

Check out the demo here: [https://geolocation-script.vercel.app/](https://geolocation-script.vercel.app/)

If you are located in an EU country, the script will not be loaded. This is communicated via a banner in the UI.