Отслеживаем события по URL

Дано: у вас многостраничный сайт. На разных страницах одна и та же цель.

Задача: отслеживать на каких страницах была достигнута цель.

Настройка отслеживания

Я.Метрика предлагает на всех страницах установить код:

ym (XXXXXX, 'reachGoal', 'TARGET', {URL: document.location.href})

XXXXXX - ID счетчика метрики

TARGET - Идентификатор цели

URL: document.location.href - передаваемая информация в формате ключ: значение. Подробнее:

• URL - Ключ (В отчете «Параметр 1»). Т.к. мы передаем значение URL, то так и назовем.

• document.location.href - динамическое значение (В отчете «Параметр 2»).
  Возвращает весь URL, где достигнута цель. Подробнее:

- document: объект, представляющий текущую страницу.

- location: свойство объекта document.Предоставляет информацию о текущем URL.

- href: Подсвойство объекта location.Содержит полный URL-адрес.

Если в URL присутствуют хэши #

Используя стандартную инструкцию от Я.Метрики вы получите такой результат:

С разбивкой по URL мы получаем в сумме 18 посетителей. На самом деле их 13. Так бывает, если один пользователь выполнил цель несколько раз:

• Без хэша
• С хэшем
• С разными хэшами

Решение

Получать не весь URL, а его конкретную часть (путь).

Какие еще подсвойства объекта location мы можем передавать, разберем на примере URL: https://www.site.com/public/?filter=all#1

В формате подсвойство → значение:

window.location.origin → 'https://www.site.com'

.protocol → 'https:' (Протокол)

.host → 'www.site.com' (Хост. Если в строке был указан порт, то он так же передастся) *

.hostname → 'www.site.com' (Имя хоста) *

.port → '' (порт. В примере его не было)

.pathname → '/public/' (путь - то, что нам нужно!)

.search → '?filter=all' (Значение после знака ?)

.hash → '#1' (хэш, который нам мешал)

.href → 'https://www.site.com/public/?filter=all#1' (весь URL)

Итог

Я хочу передавать путь:

ym (XXXXXX, 'reachGoal', 'TARGET', {path: document.location.pathname })

Я хочу передавать еще и заголовок, поэтому добавлю Title: document.title:

ym (XXXXXX, 'reachGoal', 'TARGET', {path: document.location.pathname, Title: document.title})

Хочу видеть путь реферера (страница, с которой пользователь попал на целевую страницу). Добавлю Referer:document.referrer:

ym (XXXXXX, 'reachGoal', 'TARGET', {path: document.location.pathname, Title: document.title, Referer:document.referrer})

* P.S. Разница между "host" и "hostname". Если в строке присутствует порт (https://www.samanthaming.com:8080), то вернутся следующие значения:

window.location.host; // 'www.site.com:8080'
window.location.hostname; // 'www.site.com'
window.location.port; // '8080'