安装和配置 SPA 网站的计数器

计数器初始化

要在 SPA 网站上使用 Yandex Metrica 计数器,请按照以下步骤操作:

  1. 在您的网站上创建并安装计数器代码(如果尚未安装)。

  2. 初始化计数器时,将 defer 参数设置为 true。 这对于禁用有关浏览次数数据的自动发送是必要操作。 要统计页面展示次数,请使用 hit 函数,如第 3 点所述。
    初始化计数器的示例:

    ym(XXXXXX, 'init', {
        defer: true,
        clickmap:true,
        trackLinks:true,
        accurateTrackBounce:true
    })
    
  3. 为了让 Yandex Metrica 统计页面的重要更改,请分析网站的逻辑并在适当的位置插入 hit 函数,以便每次您认为页面发生更改时都会触发它。
    调用 hit 函数:

    ym(XXXXXX, 'hit', url[, options]);
    

    可以在 hit 函数中传递的参数:

    参数

    默认值

    类型

    描述

    url

    String

    视图所来自的页面的 URL。 如果未提供 URL,则将使用 window.location.href 的值。

    options

    对象

    options 对象的字段

    options.callback

    Function

    发送页面浏览数据后调用的回调函数

    options.ctx

    对象

    在回调函数中通过 this 关键词访问的上下文

    options.params

    对象

    会话参数

    options.referer

    String

    用户加载当前页面内容的 URL

    options.title

    document.title

    String

    当前页面的标题

    options.params 对象的字段:

    order_price

    Double

    Revenue by goal。 您可以用货币或常规单位设置成本。

    currency

    字符串

    如果您想以货币形式传递目标成本,请使用此字段。 Yandex Metrica 识别三个字母的 ISO 4217 货币代码

    如果传递不同的货币,则将发送空值,而不是货币和金额。

    调用 hit 函数的示例
    ym(XXXXXX, 'init', {});
    //...
    ym(XXXXXX, 'hit', '#contacts', {params:{
        title: 'Contact information',
        referer: 'http://example.com/#main'
    }});
    

发送转化数据

浏览所来自的页面的 URL 的事件,请使用 reachGoal 函数:

ym(XXXXXX, 'reachGoal', 'TARGET_NAME);

传输会话参数和用户参数

ym(XXXXXX, 'params', {param1: 'param_value1'})
ym(XXXXXX, 'userParams', {param1: 'param_value1'})

传输 E-commerce 数据

为传输数据,请在 Yandex Metrica 中启用 E-commerce。

为正确收集 e-commerce 数据,当用户进入新页面时,您需要插入一次 hit 函数。

发送 E-commerce 数据示例
dataLayer.push({
    "ecommerce": {
        "purchase": {
            "actionField": {
                "id" : "TRX987"
            },
            "products": [
                {
                    "id": "25341",
                    "name": "Men's Yandex hoodie",
                    "price": 1345.26,
                    "brand": "Yandex / Яndex",
                    "category": "Clothing/Men's clothing/Hoodies and sweatshirts",
                    "variant": "Orange"
                },
                {
                    "id": "25314",
                    "name": "Women's Yandex hoodie",
                    "price": 1543.62,
                    "brand": "Yandex / Яndex",
                    "category": "Clothing/Women's clothing/Hoodies and sweatshirts",
                    "variant": "White",
                    "quantity": 3
                }
            ]
        }
    }
});

启用 Session Replay、click map、link map 和 Form Analysis

您可以连接 Session Replay 2.0、click map 和 link map。 不支持 scroll map、form analysis和 Session Replay 1.0。

在 SPA 上禁用 Yandex Metrica

要禁用 Yandex Metrica,请在计数器实例上使用 .destruct() 方法。 此方法仅适用于新版本的 Yandex Metrica 计数器代码。

  • 对于通过 Ya.Metrika2 构造函数初始化的计数器:

    // Initialize the tag
    const counter = new Ya.Metrika2(counterId);
    
    // Deinitialize the tag
    counter.destruct()    
    
  • 如果初始化时使用了设置:

    // Initialize the tag
    const counter = new Ya.Metrika2({
      id: counterId,
      trackLinks: true
    });
    
    // Deinitialize the tag
    counter.destruct()    
    

请仅使用 destruct 方法来停止 Yandex Metrica。

联系我们


当用户导航到某个网站页面时加载该页面。 页面浏览还包括页面刷新、AJAX 站点更新以及使用 hit 方法 发送数据。