> ## Documentation Index
> Fetch the complete documentation index at: https://docs.oneviewhub.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Use a reverse proxy

> Set up a reverse proxy to improve SEO and data quality with Google Tag Manager Server-Side

<Frame caption="Using a reverse proxy with a single FPID (First-Party ID) cookie is the reference architecture for modern websites.">
  <img src="https://mintlify.s3.us-west-1.amazonaws.com/oneview/frontend/assets/reverse-proxy-architecture.png" alt="Diagram showing the reverse proxy architecture for a website with multiple frontends." style={{height: "100%"}} className="rounded-md" />
</Frame>

Using a reverse proxy on your **website** with a **single** `FPID` (**First-Party ID**) cookie is the **reference architecture** for modern websites:

* **Cookie Blocking**: Safari's Intelligent Tracking Prevention (ITP) allows <Tooltip tip="Cookies set by the exact domain and subdomain as the one you are visiting">same-origin</Tooltip> cookies to work, but limits the lifetime of <Tooltip tip="Cookies set by the same domain, (but a different subdomain) than the one you are visiting">same-site</Tooltip> ones. A reverse proxy ensures that all cookies are set by the same origin.
* **Script Blocking**: Privacy extensions and ad blockers often use domain-based blocklists. Content served from your own domain is less likely to be blocked than third-party hosted content.
* **SEO**: Subdirectories consolidate link equity and domain authority more cleanly. All content shares the same origin, which can simplify your SEO strategy.

Using your own domain for data collection means sending data using the **same IP address** of your website, for **all your frontend services**:

| Service           | Before              | After                      |
| ----------------- | ------------------- | -------------------------- |
| **Website**       | `www.example.com`   | unchanged                  |
| **App**           | `app.example.com`   | `www.example.com/app/`     |
| **Blog**          | `blog.example.com`  | `www.example.com/blog/`    |
| **Store**         | `store.example.com` | `www.example.com/store/`   |
| **Documentation** | `docs.example.com`  | `www.example.com/docs/`    |
| **Tag Server**    | `gtm.example.com`   | `www.example.com/api/gtm/` |

This means dedicating a <Tooltip tip="Part of main your domain's URL path after the slash (e.g., example.com/blog)">subdirectory</Tooltip> of your <Tooltip tip="Complete domain name, including subdomain (www), host name (example), and top-level (com) domain">Fully Qualified Domain Name</Tooltip> (FQDN) to each service.

## Prerequisites

<Note>
  If you need support setting up a reverse proxy, you can contact us at [support@oneviewhub.com](mailto:support@oneviewhub.com).
</Note>

* You need **admin** access to your website **hosting provider**
* You need **admin** access to your **Google Tag Manager Server Container** configuration
* If you use **multiple frontends** (e.g. React website, WordPress blog, etc...), you need access to **all of them**

## How it works

In order to use your domain to improve your data quality, you need to set up a [reverse proxy](https://en.wikipedia.org/wiki/Reverse_proxy) on your website that forwards requests to your Google Tag Manager Server Container.

<Steps>
  <Step title="Configuring the reverse proxy">
    <Tabs>
      <Tab title="You are self-hosting">
        You can send events using your website own domain, by using a <Tooltip tip="A load balancer is a technology designed to distribute the workload between different servers or applications, with more features than a reverse proxy">load balancer</Tooltip> to serve all your customer-facing traffic.

        * If using AWS, see [Amazon CloudFront](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Introduction.html)
        * If using Google Cloud, see [Google Cloud Load Balancing](https://docs.cloud.google.com/load-balancing/docs/https/setup-global-ext-https-external-backend)
        * If using Azure, see [Azure Front Door](https://docs.microsoft.com/en-us/azure/frontdoor/front-door-overview)
        * If using Cloudflare Enterprise, see [Origin Rules](https://developers.cloudflare.com/rules/origin-rules/)
      </Tab>

      <Tab title="You are using a site builder">
        | CMS     | Supported | Solution                                                                                                                                                                                                                                                              |
        | ------- | :-------: | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
        | Framer  |     ✅     | You must use [Framer Custom Proxy Setup](https://www.framer.com/help/articles/how-to-self-host-using-reverse-proxy/)                                                                                                                                                  |
        | Hubspot |     ✅     | You must use [Hubspot CMS Enterprise](https://developers.hubspot.com/docs/cms/best-practices/testing-staging-performance/reverse-proxy-support)                                                                                                                       |
        | Webflow |     ✅     | You must use [Webflow Enterprise](https://webflow.com/enterprise)                                                                                                                                                                                                     |
        | Kinsta  |     ✅     | You must use [Kinsta Reverse Proxy Add-on](https://kinsta.com/docs/wordpress-hosting/wordpress-domains/wordpress-reverse-proxy/)                                                                                                                                      |
        | Wix     |     ✅     | You must use [Wix Enterprise](https://www.wix.com/enterprise)                                                                                                                                                                                                         |
        | Shopify |     ✅     | You must use [Cloudflare for Platforms](https://developers.cloudflare.com/cloudflare-for-platforms/cloudflare-for-saas/saas-customers/provider-guides/shopify/) option for **Shopify** to apply [Origin Rules](https://developers.cloudflare.com/rules/origin-rules/) |
      </Tab>

      <Tab title="You are using a hosting platform">
        If you are using a hosting platform, you can use their serverless functions to set up a lightweight <Tooltip tip="A proxy server is a go-between or intermediary that forwards requests for content to different servers">reverse proxy</Tooltip>:

        * If using Cloudflare Pages, see [Workers](https://developers.cloudflare.com/workers/)
        * If using Vercel, see [Edge Runtime](https://vercel.com/docs/functions/runtimes/edge-runtime)
        * If using Netlify, see [Edge Functions](https://docs.netlify.com/edge-functions/overview/)
      </Tab>
    </Tabs>

    <br />
  </Step>

  <Step title="Forwarding traffic to your Tag Manager Server Container">
    **Request Forwarding**

    <Info>
      This step allows your **Tag Manager Server Container** to receive events from your website through your own domain.
    </Info>

    You need to make sure that all requests to a subpath of your choosing, such as `/api/gtm`, are forwarded to your Google Tag Manager Server Container endpoint.

    The exact endpoint URL depends on your Tag Manager Server provider:

    * **Google Cloud**: Your server container URL (e.g., `gtm-xxxxx-xxxxx.uc.r.appspot.com`)
    * **Stape**: Your server container URL (e.g., `gtm-xxxxx.stape.io`)
    * **Other providers**: Consult your provider's documentation

    ***

    **Cookie Forwarding**

    <Info>
      This steps allows your Tag Manager Server Container to **manage cookies** on your behalf, compliant with [Apple® ITP](/platform/guides/sending-events/advanced-setup/intelligent-tracking-prevention) requirements.
    </Info>

    Make sure you also proxy the `Cookie` and `Set-Cookie` headers. This enables your Tag Manager Server Container to automatically manage cookies for you. Most reverse proxies will **automatically forward all cookies** by default.

    Although your Tag Manager Server Container **ignores non-relevant cookies**, if you operate in **highly regulated** industries, you can configure your reverse proxy to only forward cookies that are required for tracking to work properly:

    * `FPID`: (**"First-Party ID"**) The native Google Analytics 4® cookie holding the **anonymous**`client_id` for the current browser

    ***

    **Headers Forwarding**

    <Info>
      This step allows OneView to:

      * identify **you** as a **OneView customer**
      * identify **your traffic** origin to apply **region-specific** regulations (*e.g. GDPR, CCPA, etc...*)

      If OneView is not able to identify your traffic origin, the **strictest regulation** will be applied to your data.
    </Info>

    |  Required  |                  Header                  |                                                                                          Value                                                                                          |
    | :--------: | :--------------------------------------: | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------: |
    |      ✅     |              `Authorization`             |                                                                         Your **API key** (e.g. `Bearer <token>`)                                                                        |
    | (optional) | <nobr>`X-Forwarded-CountryRegion`</nobr> |                               The user's country and region in a single [ISO 3166-2](https://en.wikipedia.org/wiki/ISO_3166-2) code (for example: `US-CA`)                              |
    | (optional) |    <nobr>`X-Forwarded-Country`</nobr>    |                                 The user's country as an [ISO 3166-1 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) code (for example: `US`)                                |
    | (optional) |     <nobr>`X-Forwarded-Region`</nobr>    | The user's region subdivision code (for example: `CA`). This is the second half of the [ISO 3166-2](https://en.wikipedia.org/wiki/ISO_3166-2#Current_codes) code (for example: `US-CA`) |

    <AccordionGroup>
      <Accordion title="How do I configure geolocation headers?" icon="wrench">
        <Tabs>
          <Tab title="You are self-hosting">
            You can configure geolocation headers at the load balancer or CDN level when you self-host.

            | Provider              |  Supported  | Geolocation headers / method                                                              | Documentation                                                                                                            |
            | --------------------- | :---------: | ----------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------ |
            | AWS                   |      ✅      | `CloudFront-Viewer-Country`, `CloudFront-Viewer-Country-Region` via Origin Request Policy | [📖 Guide](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/adding-cloudfront-headers.html)            |
            | Google Cloud          |      ✅      | Custom headers using `{client_country}` and `{client_region}` variables                   | [📖 Guide](https://cloud.google.com/load-balancing/docs/custom-headers)                                                  |
            | Azure                 | ✅ (partial) | Azure Front Door only exposes the `{geo_country}` in its Rules Engine.                    | [📖 Guide](https://learn.microsoft.com/en-us/azure/frontdoor/standard-premium/how-to-configure-rule-set)                 |
            | Cloudflare Enterprise |      ✅      | Use Transform Rules to add visitor location headers                                       | [📖 Guide](https://developers.cloudflare.com/rules/transform/managed-transforms/reference/#add-visitor-location-headers) |
          </Tab>

          <Tab title="You are using a site builder">
            | Provider | Supported | Geolocation headers / method                                                                     | Documentation                                                                                                                                                    |
            | -------- | :-------: | ------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
            | Framer   |     ✅     | You can use **AWS** or **Cloudflare**.                                                           | [📖 Guide](https://www.framer.com/help/articles/how-to-self-host-using-reverse-proxy/#how-to-set-it-up)                                                          |
            | Hubspot  |     ✅     | You can use **AWS**.                                                                             | [📖 Guide](https://developers.hubspot.com/docs/cms/best-practices/testing-staging-performance/reverse-proxy-support#set-up-a-reverse-proxy-in-amazon-cloudfront) |
            | Webflow  |     ⚠️    | Contact Webflow Enterprise Support.                                                              | -                                                                                                                                                                |
            | Kinsta   |     ⚠️    | Contact Kinsta Support.                                                                          | -                                                                                                                                                                |
            | Wix      |     ⚠️    | Contact Wix Enterprise Support.                                                                  | -                                                                                                                                                                |
            | Shopify  |     ✅     | You can use **Cloudflare for Platforms** and **Transform Rules** to add visitor location headers | [📖 Guide](https://developers.cloudflare.com/rules/transform/managed-transforms/reference/#add-visitor-location-headers/)                                        |
          </Tab>

          <Tab title="You are using a hosting platform">
            | Provider         | Supported | Geolocation headers / method                                               | Documentation                                                                                           |
            | ---------------- | :-------: | -------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------- |
            | Cloudflare Pages |     ✅     | `request.cf.country`, `request.cf.regionCode` mapped to headers via Worker | [📖 Guide](https://developers.cloudflare.com/workers/runtime-apis/request/#incomingrequestcfproperties) |
            | Vercel           |     ✅     | Automatic `X-Vercel-IP-Country` and `X-Vercel-IP-Country-Region` headers   | [📖 Guide](https://vercel.com/kb/guide/geo-ip-headers-geolocation-vercel-functions)                     |
            | Netlify          |     ✅     | Geo available via `context.geo`                                            | [📖 Guide](https://docs.netlify.com/edge-functions/api/#geo)                                            |
          </Tab>
        </Tabs>
      </Accordion>
    </AccordionGroup>

    ***
  </Step>

  <Step title="Update your frontend code">
    Update your frontend code to send events to your custom domain endpoint.

    If you're using Google Tag Manager Web Container, configure it to send events to your server container at your custom domain:

    ```javascript theme={"dark"}
    gtag('config', 'G-XXXXXXXXXX', {
      'server_container_url': '/api/gtm',
    });
    ```
  </Step>
</Steps>