Analytics

Создать

Ах, сафари интеллектуальное отслеживание профилактика — подарок, который продолжает давать. Почти доил эту корову для всех это стоит, я был уверен, что там будет мало, придется вернуться к этой теме. Может быть, я думал, было бы лучше, чтобы просто сидеть и наблюдать как горит этот мир.

Но тогда г-н Чарльз Фарина, хороший друг и очень дружных он практически канадских, искушали меня на тестировании быстрый доказательство концепции веб-сервиса, что бы вернуть нам наши куки.

Как оказалось, это не все, что отнимает много времени, чтобы сделать, и он работает довольно хорошо. Нужны доказательства? Посетите этот сайт в сафари и проверьте истечения _ga куки-файлов. Круто, да?

Create

В данной статье, я покажу вам, как установить его.

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

Вы также можете выполните действия, описанные в этой статье, смотрите видео выше.

Оглавление

  • Но почему?
  • Как это работает?
  • Что вам потребуется
  • Шаг 1: Установите Гугл облако
  • Шаг 2: клонировать репозиторий на GitHub
  • Шаг 3: создать и развернуть приложение Приложение двигателя
  • Шаг 4: сопоставление пользовательского домена в конечную точку
  • Шаг 5: Проверьте в браузере
  • Шаг 6: изменение аналитики Гугл теги
  • Устранение неполадок
  • Я не вижу никаких tracker.mywebservice.com запросов
  • Я вижу запрос на tracker.mywebservice.com но это не
  • Я вижу набор-печенье командлет заголовка, но срок действия файла cookie, его не меняет
  • У меня проблемы с настройкой приложение Приложение двигателя или что-то еще
  • Заключительные мысли
  • Но почему?

    С ИТП 2.1, сафари шапки куки-файлы, написанные с помощью яваскрипт до максимальной 7-дневного срока. Библиотека аналитика Гугл записывает файл cookie-файлов с помощью яваскрипта. Эрго, на сафари, в Гугл Аналитике куки сохраняется пользовательские данные только в течение 7 дней за один раз, то есть, если пользователь заходит на сайт с более 7 дней между посещениями, они будут рассматриваться в качестве нового пользователя в их ответный визит.

    С ИТП 2.2, срок действия куки устанавливается в 24 часа.

    Create

    От https://webkit.org/blog/8828/intelligent-tracking-prevention-2-2/

    Тем не менее, сафари, совсем не (в настоящее время) крышка куки, установленные с Набор-печенье в HTTP-заголовок. Почему? Потому что создание установки Мак{{Эс использования набор-печенье заголовка требует ресурсы для разработчиков и это всегда преднамеренное решение, как справиться с первой стороны настойчивости.

    Основной говядина ИТП против сторонних библиотек на JavaScript, выполняющий код, который перенаправляет первая партия для хранения чего-то другого, чем первый-участником сбор данных (а именно, кросс-сайте отслеживания).

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

    Но я не волнует. Я просто хочу, чтобы решать саму проблему, а затем поделиться решение.

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

    Create

    Я на этом блоге уже более шести лет, и мои навыки в рисовании процесс диаграммы или блок-схемы только все хуже и хуже. Извините за выше беспорядок.

    Вот как эта установка работает:

    1. Когда пользователь загружает страницу, а Гугл Аналитика трекер генерируется первое событие Джорджия.

    2. Этот трекер проверяет, если браузер имеет _ga куки-файлов. Если нет, создается новый.

    3. Если в URL-адрес имеет междоменный линкер параметров и трекер имеет allowLinker:истинный поле, то трекер будет использовать эти параметры для обновления _ga куки-файлов.

    4. Поскольку этот файл создается файл cookie с помощью JavaScript, то она подвержена ИТП 2.1. Таким образом, в узнать о том, что на странице просмотр тегов, веб-сервис вызывается с просьбой вернуть файл cookie с именем _ga значение из куки генерируется analytics.js.

    5. Веб-служба возвращает это в набор-печенье заголовка, и, таким образом, _ga cookie-файлов обновляется как через HTTP-куки, игнорируя влияние ИТП ИТП 2.1 и 2.2.

    Единственный способ выше работает плавно, добавляя новые (и плохо документированы) cookieUpdate поле в теге параметры. Это поле гарантирует, что трекер вообще не обновлять срока действия куки-файла если он найден. Это имеет важное значение, так как в противном случае каждый раз, когда трекер инициализируется файл файл cookie обновляется из файла файле cookie на языке JavaScript и файлов куки.

    Что вам потребуется

    Для решение работать, вам потребуется следующее:

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

    2. Домен, для которого вы имеете полный доступ к настройкам ДНС. Этот домен должен разделять один и тот же корневой/Родительский домен, из которого вы будете отправлять запросы к веб-службе. Так что если ваш сайт находится на www.website.comдомен нужно создавать как веб-сервис должен быть поддомен (или домен) website.com.

    3. Необходимый доступ для изменения настроек каждый тег Гугл Аналитикс, что пожары на сайте.

    Домена очень важен Сопоставление. Поскольку веб-служба использует набор-печенье заголовок, чтобы установить cookie-файл, он может сделать это только в контексте, если заголовок устанавливает куки на имя общих как домен, из которого происходящих запрос (например, www.website.com) и домен, подключенные к веб-службе (например, tracker.website.com).

    Шаг 1: Установите Гугл облако

    Во-первых, посещение управления биллинга с вашей любимой идентификатор в Google и создать новый платежный счет для вашей организации или проекта облаке Гугл. Если у вас уже есть биллинг настройка учетных записей, вы можете пропустить этот шаг. Вам потребуется добавить данные кредитной карты для ситуаций, когда вы удар мимо бесплатных квот. Не волнуйся! Вы можете добавить бюджета на ваш счет, чтобы избежать сюрпризов.

    Далее, откройте в Google облако консоли с таким же логином, и нажмите, чтобы создать проект.

    Create

    Дайте проекту Имя и убедитесь в том, чтобы изменить идентификатор, так что это легче запомнить / ручка. Вам будет предложено добавить учетную запись выставления счетов для проекта, поэтому выберите тот, который вы только что создали, или на любой счет, который вы хотите использовать.

    Далее, посетите https://console.cloud.google.com/apis/api/cloudbuild.googleapis.com/overview и нажмите кнопку Включить в API для включения облачных API для сборки. Нам нужно это загрузить наши конфигурации в облаке.

    Наконец, перейдите к https://cloud.google.com/sdk/install и следуйте инструкциям. Вы хотите установить Гугл облако СДК, так что вы можете запускать большинство необходимых команд из командной строки.

    После установки пакета SDK, запустить gcloud init в в в терминале или командной строке программы. Это будет инициализировать облако Гугл СДК для вас, и это позволит вам выбрать, в каком проекте, чтобы активировать (выбрать тот, который вы создали ранее в этой главе).

    Шаг 2: клонировать репозиторий на GitHub

    Во-первых, убедитесь, что у вас есть в ГИТ клиент установлен. Я использую клиент командной строки в этих примерах, но не стесняйтесь использовать графический интерфейс (графический интерфейс пользователя) клиента, если вы пожелаете.

    Как только ГИТ клиент установлен, выполните команду в Git клон https://github.com/sahava/cookie-bouncer-service.git в каталог по вашему выбору, чтобы клонировать исходный код на свой компьютер.

    Create

    Давайте вспомним.

  • Вы создали в Гугл облачная платформа проекта, связанного с расчетного счета с облачным API для сборки включен.

  • У вас установлен Гугл облако СДК, а у вас есть инициализировать его с таким же логином, который вы использовали при создании проекта облаке Google, то вы и настроили его, чтобы установить свой новый проект в качестве активного проекта.

  • Вы склонируете репозиторий на Гитхабе.

  • Шаг 3: создать и развернуть приложение Приложение двигателя

    Ваш следующий шаг заключается в создании приложения двигателя приложения. Приложение движок от Гугл полностью управляемая платформа приложений бессерверную. Это похоже на облегченный среде виртуальной машины, где компания Google обрабатывает такие вещи, как масштабирование и поколение экземпляр для вас.

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

    Хотя в папке, куда вы склонировали репозиторий в Git, выполните следующую команду:

    gcloud приложение создать

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

    Create

    Далее открываем файл app.js для редактирования и найдите строк, содержащих константное allowedHosts = [...]. В этом массиве, вы должны добавить все имена хостов , с которых вы планируете обращаться к веб-сервису. Помните, что они должны разделить корневой домен все пользовательские Домены вы карту к веб-службе. Например, на моем сайте я только собираюсь вызвать веб-службу из https://www.gtmtools.com и любой из его страниц, так что я бы просто добавить:

    константный allowedHosts = [
    'https://www.gtmtools.com'
    ];
    

    Create

    Если бы я и хотел, чтобы карта что-то вроде service.simoahava.com приложение службы двигателя (да, можно добавить несколько доменов), я мог бы также добавить https://www.simoahava.com в список разрешенных источников.

    Далее выполните:

    приложение gcloud развернуть

    Create

    Он мож развернет приложение, используя исходный код из репозитория. Внимание! Вы должны быть в папке с Приложение.и в YAML файл из репозитория для этой команды, чтобы работать.

    Он Скоро скажет вам, что работает все. Вы можете затем введите gcloud приложение просматривать автоматически откроется окно браузера, в приложении корень. Если это работает, вы должны увидеть предупреждение о том, что вам-запросы не поддерживаются.

    Create

    Почему он жалуется вам потому, что конечная точка не настроена для обработки вам запросов. Это только для того, чтобы обрабатывать пост-запросы.

    Вы почти веб-службой закончили с. Тот кусочек мозаики, который отсутствует на карте веб-сервиса для пользовательского домена, так что он может установить куки на ваш сайт с Набор-печенье заголовка.

    Шаг 4: сопоставление пользовательского домена в конечную точку

    Обзор https://console.cloud.google.com/appengine/settings/domains и убедитесь, что у вас есть свой проект приложения системы.

    Нажмите кнопку добавить пользовательский домен, получить домен, проверка началась.

    Из выберите домен, который вы хотите использовать, выберите проверить новый домени введите имя домена в соответствующее поле. Нажмите Кнопку Проверить.

    Create

    Это будет трансфер вы что-то, что очень похож на экран проверка домена консоли поиска в Google. Вы должны убедиться, что вы являетесь владельцем домена, вы пытаетесь карту на приложения двигателя.

    Create

    Например, я использую GoDaddy не в качестве моего провайдера, поэтому легко просто следуйте инструкциям и добавить необходимые записи тхт.

    Create

    После того как вы сделали изменения, вы должны ждать, пока ДНС-записи для распространения. Иногда это происходит очень быстро, иногда это может занять несколько часов. Так просто остановиться на проверки страницы, и нажмите кнопку Проверить каждый сейчас и потом, чтобы увидеть, если ТХТ-записи были обновлены.

    Create

    После того как домен будет подтвержден, вы можете нажать вперед шаги, чтобы добавить пользовательский домен для проекта приложения двигателя. Гугл будет выдавать бесплатные протокол SSL-сертификат для домена, обеспечения безопасности конечной точки за протокола HTTPS-соединение.

    На последнем шаге, обновить записи в DNS для обеспечения безопасности, он перечислит вам целый ряд А и аааа — записей вам необходимо добавить в настройки ДНС для хоста, который вы хотите отобразить в приложении двигателя. Например, в моем примере tracker.gtmtools.comя получаю следующие записи:

    Create

    В компании GoDaddy я сейчас их добавил, как указано:

    Create

    Теперь, опять же, это вопрос просто жду записей для распространения. Когда все работает, как правило, хорошо в течение 24 часов после внесения изменений, вы должны быть в состоянии посетить https://tracker.yourdomain.comт. е. пользовательский домен вы только что пометили, и он должен вернуть вам похожие ошибки ты увидел, когда зашел в приложение двигателя конечной точки напрямую.

    Шаг 5: Проверьте в браузере

    Теперь пришло время, чтобы сделать быстрый тест браузера. Перейдите к одному из доменов, которые вы настроили в app.js в allowedHosts массива (см. В этой главе для повышения квалификации). Использовать браузер сафари.

    Затем откройте консоль яваскрипта — это КМД-опт-Си на Мак, но вы можете также найти его в меню разработки.

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

    константный конечной точки = 'https://tracker.gtmtools.com';
    домен константной = 'gtmtools.com';
    константный используем XHR-запрос = новый запрос();
    то то XHR.открыть('сообщение', конечная точка);
    то то XHR.добавляет('тип содержимого', 'приложение/JSON с');
    то то XHR.withCredentials = true;в в
    то то XHR.отправить(в формате JSON.преобразовать в строки({имя: 'testCookie', значение: 'testValue', параметры: {домен: домен, maxAge: 1000*60*60*24*365*2}}));
    

    Это формирует сообщение-запрос к конечной точке настройки, согласно которой веб-служба возвращает файл cookie с именем testCookie с значение testValue, написано на корневого домена. Поскольку вы не указываете срок действия, файл «cookie» не будет иметь истечение двух лет.

    Если все получилось, вы должны увидеть запрос после вернуться с ответом говорю, что куки был обработан. Кроме того, ответ должен иметь правильный набор файлов куки заголовка. Наконец, куки-файл должен появиться в разделе «хранение» консоли разработчика в сафари.

    Create

    Create

    Create

    Так вот как вы создаете файлы «куки» без срока давности в сафари после пит-2.1!.

    Но давайте проверим последний шаг — как включить в Гугл Аналитике.

    Шаг 6: изменение аналитики Гугл теги

    Чтобы сделать _ga cookie-файл для работы с веб-сервисом, вам нужно сделать две вещи.

    1. Добавить cookieUpdate поле со значением значение ложь для каждого аналитика Гугл тегом стрельба на странице. Это абсолютно необходимо. Если есть хоть один тег га, которые не имеют этого поля (и разделяет настройки куки с вашими теги, которые есть в области), код JavaScript и печенье будет держать на перезаписывая файл в файл cookie в HTTP-ответе.

    2. Добавить узнать полей и переменных на свою страницу показать тег (или любой другой тег срабатывает на каждую страницу), который обрабатывает логику.

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

    Ключ, чтобы перейти к «дополнительные настройки» -> поля для настройкии добавления нового поля с:

    Поле Имя: cookieUpdate
    Значение: ложная

    Create

    Если вы используете analytics.jsустановите поле на трекере такой:

    Джорджия('создать', 'на сайт ua-12345-1');
    Джорджия('множество', 'cookieUpdate', ложь);
    

    И если вы используете gtag.jsэто как это:

    gtag('конфиг', 'на сайт ua-12345-1', {
     cookie_update: ложные
    });
    

    Как только это будет сделано, следующий шаг заключается в создании узнать функцию. Я тебе покажу, как это делается в Диспетчере тегов Google, В но нечто подобное можно сделать и с analytics.js и gtag.js — это просто яваскрипт-код, в конце концов.

    В ГТМ, создать новый пользовательский код JavaScript переменной.

    Что? Почему бы не использовать пользовательские шаблоны? Ну, к сожалению, они не поддерживают создание пост-запросы еще. Можно перенастроить точки доступа для работы с Гет-запросы, но пост больше подходит для обработки структурированных данных.

    В пользовательской переменной в JavaScript, добавьте этот код:

    функция() {
     возврата функция() {
     // Измените эти
     ВАР конечной точки = 'https://tracker.gtmtools.com';
     ВАР домен = 'gtmtools.com';
    
     // Не трогай
     ВАР gaCookie = {{файлов _ga cookie-файл}};
     ВАР safariApiPoll = {{куки - _safari_api_poll}};
    
     // Работать только если га куки устанавливается, и если сафари не набрал за последние 6 дней
     если (!gaCookie || safariApiPoll) { 
     возврат; 
    }
    
     дисп данные = формат JSON-файле.в преобразовать строки([{
     название: '_ga', 
     значение: gaCookie,
     варианты: {
     путь: '/', 
     домен: домен, 
     maxAge: 1000 * 60 * 60 * 24 * 365 * 2
    }
    }]);
     ВАР используем XHR-запрос = новый запрос();
     то то XHR.открыть('пост', конечная точка, истина);
     то то XHR.добавляет('тип содержимого', 'приложение/JSON с');
     то то XHR.withCredentials = true;в в
    то то XHR.отправить(данные);
     документ.файл куки = '_safari_api_poll=истина; домен=' + домен + '; путь=/; Макс-возраст=' + 60*60*24*6;
    }
    }
    

    Помните, чтобы изменить конечную точку и домен , чтобы соответствовать конечной точки службы и корневой домен, соответственно.

    Дать имя переменной, такой как {{узнать — печенье переписать}}.

    В узнать о том, что функция делает две вещи.

    1. Если _ga cookie-файл был установлен, и если прошло более 6 дней, поскольку веб-служба последнего опроса, он обращается к веб-службе, чтобы записать новый файл с именем файла cookie _ga, используя значение фактического _ga куки-файлов, написанный компанией Google и аналитика.

    2. Он устанавливает новый файл куки с 6 дня истечения срока, чтобы избежать опроса веб-службы больше, чем необходимо.

    Причина у нас есть 6 дней-срок действия файла cookie-файлы, чтобы предотвратить АПИ от постоянно опрашивается по вашим тегам. Поскольку в API устанавливает файл cookie-файлов с двух-летнего срока, это нормально, чтобы только опросить его один раз каждые шесть дней.

    Здесь есть сложная логика, так, медведь со мной.

    Нет никакого способа, чтобы знать, с помощью яваскрипта, что истечение _ga куки-файл. Таким образом, нужно опрашивать API и каждый сейчас и потом, чтобы убедиться, что печенье остается пишется без короткого срока.

    Максимальная продолжительность времени мы можем сохранять информацию о том, когда АПИ был последний опрашиваемый 7 дней. Почему? Потому что эта информация хранится в файле cookie-файлы, написанные с помощью яваскрипт. 6 дней-это просто предосторожность — вы можете легко изменить Макс-возрастной параметр, чтобы сделать печенье длиться будет дольше.

    И если вы не возражаете по API-интерфейс постоянно опрашивается, не стесняйтесь, чтобы удалить эту проверку куки или сделать опрос на АРІ раз в день, например.

    В любом случае. Далее вам потребуется создать две основные куки переменных:

    Create

    Create

    Наконец, вам нужно найти вашу страницу показать тег (или как там тег пожары последовательно на каждой странице), и прокрутите вниз, чтобы его больше настройки -> поля установить (проверить “включить переопределение параметров в теге” первый). Новое поле Добавить:

    Поле Имя: узнать
    Значение: {{узнать - печенье переписать}}

    Create

    Теперь, когда все готово, пришло время проверить!

    Возьмите контейнер в режиме предварительного просмотра, и зайти на сайт с сафари. Вы должны увидеть запрос tracker.domain.com в Сети вкладку, и вы должны увидеть ваш _ga печенье с двух-годичного срока. Перезагрузить страницу и вы увидите больше никаких запросов к веб-службе, ни истечения _ga куки-файлов изменить.

    Create

    Устранение неполадок

    Я не вижу никаких tracker.mywebservice.com запросов

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

    Я вижу запрос на tracker.mywebservice.com но это не

    Проверьте консоль JavaScript-кода. Там должны быть сведения о том, почему не удалось выполнить запрос. Скорее всего, у вас неправильно настроена на allowedHosts массива в app.jsи таким образом, кросс-происхождения запросу не переживает.

    Убедитесь, что домен правильно — он должен быть в корневом домене вашего сайта и веб-сервиса.

    Убедитесь, что вы установить cookieUpdate поле для ложных на все ваши Джорджия теги.

    У меня проблемы с настройкой приложение Приложение двигателя или что-то еще

    Оставьте вопрос в комментариях и я постараюсь помочь вам.

    Заключительные мысли

    Я надеюсь, что вы найдете это полезно упражнение — это должно дать вам некоторое представление о том, что технические шаги для создания какой-то вид услуг печенье маршрутизации.

    Есть и другие способы справиться с этим, перечисленные в этой статье. Однако, красота-службы API-интерфейс, как это, что это, как масштабируемую как вам угодно (или как ваш бюджет позволяет).

    Используя приложение стандартным двигателем среде не слишком дорого. Например, скромное количество просмотров моего сайта создает для АПИ (около 7000 запросов в сутки) находится в пределах бесплатной квоты. Обвинения в приложение движок, основанный на экземпляр часов, и вы дали 28 экземпляре часа бесплатно в сутки. Я едва задев 25 с такой нагрузкой.

    Естественно, есть способы оптимизировать это еще дальше. Например, вы можете проверить, если пользователь браузера сафари и использовать только API, в то. Аналогичным образом, вы можете расширить АПИ для печенья опрос из шести дней дольше срока, установив, что куки с веб-службой. Хотя это может создать какую-то временную парадокс космический, я не знаю.

    Независимо от того, дайте мне знать в комментариях, что вы думаете об этом решении!

    Related posts

    Самодельный антисептик из того, что есть в аптеке. Делаем спирт из водки без самогонного аппарата дедовским способом

    admin

    15 мая RU-Center может добавить вам платную услугу без вашего участия

    admin

    Пользовательские шаблоны в GTM: разбираемся на примере

    admin

    Leave a Comment