Как установить Google Tag Manager на своем сервере: пошаговый гайд

Рассказываем, как безопасно интегрировать Google Tag Manager (GTM) с вашим собственным сервером, чтобы повысить защиту данных и соответствовать требованиям законодательства.

Следуя этому пошаговому руководству, вы сможете перенести функционал GTM на ваш сервер и использовать собственный поддомен вместо стандартного www.googletagmanager.com. Загрузка GTM будет происходить через ваш домен: например, gtm.example.com.

Благодарим команду DataGo! за помощь в составлении гайда.

Почему стоит установить GTM на своем сервере

Как это работает

Процесс основан на перенаправлении запросов к серверу Google через ваш локальный сервер при загрузке скрипта GTM.

Если говорить вкратце, такими будут основные шаги для настройки Server GTM на вашем сервере:

1. Создание двух поддоменов: один для рабочей версии контейнера, другой для режима предпросмотра.

2. Работа с серверным контейнером GTM: создание и настройка.

3. Развертывание сервисов на поддоменах: настройка серверного окружения для обработки запросов.

4. Настройка интеграции с веб-контейнером: указание новых эндпоинтов в параметрах тегов.

5. Изменения в коде сайта: замена стандартного URL GTM на ваш собственный поддомен.

А теперь подробнее.

1. Создание двух поддоменов

Для начала необходимо создать два домена третьего уровня на вашем хосте:

Режим preview нужен для предварительного просмотра. Он позволяет тестировать и проводить отладку контейнера тегов перед тем, как изменения будут опубликованы на сайте.

Почему важно использовать два домена вместо одного? Это связано с рекомендациями Google: так режим предварительного просмотра будет работать корректно.

Убедитесь, что оба домена направлены на серверы, где будет развернут сервис Server GTM.

2. Работа с серверным контейнером GTM

1. Начните с создания серверного контейнера в GTM.

2. В появившейся форме выберите опцию «Добавить сервер тегов вручную». Это позволит вам получить специальную закодированную строку, необходимую для настройки контейнера на вашем сервере.

Сохраните полученную строку и передайте ее инженерам, чтобы они могли связать контейнер с сервисом, работающим на ваших серверах.

3. Откройте настройки контейнера.

4. Укажите адрес preview контейнера для включения режима предварительного просмотра прямо в интерфейсе GTM.

Чтобы получить конфигурационную строку, достаточно нажать на кнопку «Настроить сервер тегов» и выбрать вариант «Добавить сервер тегов вручную».

После того, как вы укажете preview-домен, настройки контейнера должны выглядеть так:

3. Развертывание сервисов на поддоменах

1. Подготовьте выделенные или виртуальные серверы для настройки необходимых сервисов (например, можете арендовать виртуальные машины в Yandex Cloud).

2. Установите на серверах Docker и разверните предоставленный Google образ.

gcr.io/cloud-tagging-10302018/gtm-cloud-image:stable

Для работы в режиме продакшн потребуется указать только параметр CONTAINER_CONFIG (это закодированная строка, которая формируется на основе настроек серверного контейнера GTM).

Для режима preview нужно указать дополнительные параметры:

RUN_AS_PREVIEW_SERVER=true и PREVIEW_SERVER_URL=https://gtm-preview.domain.ru

Весь входящий HTTP-трафик должен быть перенаправлен на развернутый Docker образ.

Готовая конфигурация для развертки сервисов

docker-compose.yml

nginx.conf

Требования для стабильности Server GTM

Чтобы Server GTM работал стабильно, нужно построить систему с высокой доступностью и распределенной архитектурой:

4. Настройка интеграции с веб-контейнером

1. В разделе «Клиенты» серверного контейнера GTM нажмите кнопку «Создать».

2. Выберите предустановленный клиент: «Google Менеджер тегов: веб-контейнер».

3. Укажите идентификатор контейнера и выберите соответствующий регион.

5. Изменения в коде сайта

Замените точку доступа в сниппете GTM на продакшн-эндпоинт https://gtm.domain.ru.

Учтите, что идентификатор GTM-XXXXXXXX при этом не меняется. Он должен быть таким же, как в текущей версии классического веб-GTM.

Head:

<!-- Google Tag Manager -->  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':  new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],  j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=  'https://gtm.domain.ru/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);  })(window,document,'script','dataLayer','GTM-XXXXXXXX');</script>  <!-- End Google Tag Manager -->

Body:

<!-- Google Tag Manager (noscript) -->  <noscript><iframe src="https://gtm.domain.ru/ns.html?id=GTM-XXXXXXXX'"  height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>  <!-- End Google Tag Manager (noscript) -->

Официальная документация по настройке от Google

Возьмите под контроль продвижение своего сайта Исправьте ошибки, которые мешают сайту выйти в топ, и вы увидите рост трафика и дохода. Анализировать 🔍 Подпишись на @prcynews в телеграм — оставайся в курсе последних SEO новостей и свежих материалов.

Автор:
Влад Андрюхин
Источник