---
metadata:
- name: generator
content: Diplodoc Platform v5.52.0
alternate:
- https://yandex.com/support/metrica/en/code/counter-spa-setup.md
- https://yandex.com/support/metrica/es/code/counter-spa-setup.md
- https://yandex.com/support/metrica/pt/code/counter-spa-setup.md
- https://yandex.com/support/metrica/ru/code/counter-spa-setup.md
- https://yandex.com/support/metrica/tr/code/counter-spa-setup.md
- https://yandex.com/support/metrica/zh/code/counter-spa-setup.md
- href: ru/code/counter-spa-setup.md
type: text/markdown
title: Markdown version
- href: ../llms.txt
type: text/markdown
title: llms.txt
title: Установка и настройка счетчика для SPA-сайтов
description: Как установить и настроить счетчик для SPA-сайтов.
---
> **Documentation Index:** Fetch the complete configuration index at https://yandex.com/support/metrica/ru/llms.txt
# Установка и настройка счетчика для SPA-сайтов
## Инициализация счетчика {#section_r5y_2rf_qfb}
Чтобы использовать счетчик метрики на SPA-сайтах, выполните следующие действия:
1. [Создайте и установите код счетчика](https://yandex.com/support/metrica/ru/quick-start.md) на сайт, если он еще не установлен.
1. При инициализации счетчика для параметра `defer` укажите значение `true`. Это нужно, чтобы отключить автоматическую отправку данных о [просмотрах](*просмотрах). Чтобы фиксировать показы страниц, используйте функцию `hit` при необходимости, как описано в п. 3.
Пример инициализации счетчика:
```
ym(XXXXXXXX, 'init', {
defer: true,
clickmap:true,
trackLinks:true,
accurateTrackBounce:true
})
```
1. Чтобы важные изменения страницы фиксировались Яндекс Метрикой, проанализируйте логику работы сайта и вставьте функцию [hit](https://yandex.com/support/metrica/ru/objects/hit.md) в нужные места кода так, чтобы она вызывалась каждый раз, когда вы считаете, что страница изменилась.
Вызов функции `hit`:
```
ym(XXXXXXXX, 'hit', url[, options]);
```
Параметры, которые можно передать функции `hit`:
#|
||
**Параметр**
|
**Значение по умолчанию**
|
**Тип**
|
**Описание**
||
||
`url`
|
—
|
String
|
URL страницы, с которой совершен просмотр. Если URL не передан, будет использовано значение из [`window.location.href`](https://yandex.com/support/metrica/ru/data/visit-params-example.md#goal)
||
||
`options`
|
—
|
Object
|
—
||
||
Поля объекта `options`
|
>
|
>
|
>
||
||
`options.callback`
|
—
|
Function
|
Callback-функция, вызываемая после отправки данных о просмотре
||
||
`options.ctx`
|
—
|
Object
|
Контекст, доступный в callback-функции по ключевому слову `this`
||
||
`options.params`
|
—
|
Object
|
Параметры визита
||
||
`options.referer`
|
—
|
String
|
URL с которого посетитель загрузил содержимое текущей страницы
||
||
`options.title`
|
`document.title`
|
String
|
Заголовок текущей страницы
||
||
Поля объекта `options.params`:
|
>
|
>
|
>
||
||
`order_price`
|
—
|
Double
|
[Доход по цели](https://yandex.com/support/metrica/ru/objects/hit.md#price). Вы можете указать цену как в валюте, так и в условных единицах
||
||
`currency`
|
—
|
String
|
Используйте это поле, если хотите передать цену цели в валюте. Метрика распознает трехбуквенный [код валюты по ISO 4217](https://www.six-group.com/en/products-services/financial-information/data-standards.html#scrollTo=currency-codes).
Если передается другая валюта, будут отправлены нулевые значения вместо валюты и суммы
||
|#
{% cut "Пример вызова функции `hit`" %}
```javascript
ym(XXXXXXXX, 'init', {});
//...
ym(XXXXXXXX, 'hit', '#contacts', {params:{
title: 'Контактная информация',
referer: 'http://example.com/#main'
}});
```
{% endcut %}
## Отправка достижения цели {#section_bpg_5dk_yfb}
Для отслеживания событий на сайте, при которых URL страницы не меняется, используйте функцию `reachGoal`:
```
ym(XXXXXXXX, 'reachGoal', 'TARGET_NAME);
```
[Примеры установки цели в коде](https://yandex.com/support/metrica/ru/objects/reachgoal.md#reach_goal_examples).
## Передача параметров визитов и посетителей {#section_ypx_lsf_qfb}
{% list tabs %}
- Параметры визитов
```
ym(XXXXXXXX, 'params', {param1: 'param_value1'})
```
- Параметры посетителей
```
ym(XXXXXXXX, 'userParams', {param1: 'param_value1'})
```
{% endlist %}
## Передача данных Ecommerce {#section_nsk_vtf_qfb}
Для передачи данных [подключите электронную коммерцию](https://yandex.com/support/metrica/ru/ecommerce/about.md) в Метрике.
Для корректного сбора данных электронной коммерции нужно вставить один раз функцию `hit` при переходе на новую страницу.
{% cut "Пример отправки электронной коммерции" %}
```
dataLayer.push({
"ecommerce": {
"purchase": {
"actionField": {
"id": "TRX987"
},
"products": [
{
"id": "25341",
"name": "Толстовка Яндекс мужская",
"price": 1345.26,
"brand": "Яндекс / Яndex",
"category": "Одежда/Мужская одежда/Толстовки и свитшоты",
"variant": "Оранжевый цвет"
},
{
"id": "25314",
"name": "Толстовка Яндекс женская",
"price": 1543.62,
"brand": "Яндекс / Яndex",
"category": "Одежда/Женская одежда/Толстовки и свитшоты",
"variant": "Белый цвет",
"quantity": 3
}
]
}
}
});
```
{% endcut %}
## Подключение Вебвизора, карт кликов и ссылок, аналитики форм {#section_bg3_xtf_qfb}
К SPA-сайту можно [подключить Вебвизор](https://yandex.com/support/metrica/ru/webvisor/info.md), [карту кликов](https://yandex.com/support/metrica/ru/behavior/click-map.md) и [карту ссылок](https://yandex.com/support/metrica/ru/behavior/link-map.md). Карта скроллинга, аналитика форм и Вебвизор 1.0 не поддерживаются.
## Выключение Метрики на SPA {#destruct}
Чтобы отключить Метрику, используйте метод `.destruct()` на экземпляре счетчика. Этот способ работает только на [новой версии](https://yandex.com/support/metrica/ru/general/tag-info.md) кода счетчика Метрики.
- Для счетчиков, инициализированных через конструктор `Ya.Metrika2`:
```
// Инициализируем счетчик
const counter = new Ya.Metrika2(counterId);
// Деинициализируем счетчик
counter.destruct()
```
- Если инициализация происходит с настройками:
```
// Инициализируем счетчик
const counter = new Ya.Metrika2({
id: counterId,
trackLinks: true
});
// Деинициализируем счетчик
counter.destruct()
```
- Для счетчиков, которые инициализированы через метод `ym`:
```
// Инициализируем счетчик
ym(XXXXXX, 'init', {});
// Деинициализируем счетчик
ym(XXXXXX, 'destruct')
```
Используйте метод `destruct` только для остановки Метрики.
[Написать в чат](https://yandex.com/chat/#/user/036e6a02-3620-9cdc-4c5e-a34667a7379e?utm_source=spravka){.button}
- - -
#|
||
Полезные ссылки
- [Демосчетчик](https://metrica.yandex.com/r/dashboard?)
- [Добавить счетчик](https://metrica.yandex.com/add/)
- [Бесплатная настройка счетчика](https://yandex.com/promo/freeservice/metrica?utm_source=help_metrica_en&utm_medium=cpc&utm_campaign=1)
- [API Яндекс Метрики](https://tech.yandex.com/metrika/)
- [Предложить идею](https://yandex.com/support/metrica/troubleshooting/idea.html)
- [Обсудить в Telegram](https://t.me/yandexmetrika)
|
Онлайн-обучение
- [Получить сертификат по Яндекс Метрике](https://yandex.ru/adv/expert/exam/metrika/?utm_source=metrika_help&utm_medium=web&utm_campaign=static&utm_content=useful_links)
- [Пройти обучающий курс](https://yandex.com/adv/edu/online/metrika?utm_source=metrika_help&utm_medium=web&utm_campaign=static&utm_content=useful_links)
||
|#
[*просмотрах]: Загрузка страницы сайта при переходе посетителя на нее. К просмотрам также относятся перезагрузка страницы, обновление AJAX-сайтов, отправка данных с помощью [метода hit](https://yandex.com/support/metrica/ru/objects/hit.md).
{% included (../_includes/popup/id-qanda/check2-2.md) %}
Возможные причины:
- Счетчик установлен неправильно. Например, CMS внесла изменения в код счетчика. Следует переустановить счетчик или обратиться в службу поддержки вашей CMS.
- Работу счетчика Яндекс Метрики на сайте блокируют неработающие скрипты. Проверить это можно в консоли браузера.
{% endincluded %}