安装和配置 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": "Yandex hoodie (men)",
                    "price": 1345.26,
                    "brand": "Yandex",
                    "category": "Clothes/Men's clothes/Hoodies and sweatshirts",
                    "variant": "Orange"
                },
                {
                    "id": "25314",
                    "name": "Yandex hoodie (women)", 
                   "price": 1543.62,
                    "brand": "Yandex",
                    "category": "Clothes/Women's clothes/Hoodies and sweatshirts",
                    "variant": "White",
                    "quantity": 3
                }
            ]
        }
   }
});

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

您可以将 用户行为回放、点击热图 和 链接热图 连接到 SPA 网站。 不支持 scroll map、form analysis和 Session Replay 1.0。

在 SPA 上禁用 Yandex Metrica

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

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

    //正在初始化计数器
    const counter = new Ya.Metrika2(counterId);
    
    //正在去初始化计数器
    counter.destruct()    
    
  • 如果初始化时使用了设置:

    //正在初始化计数器
    const counter = new Ya.Metrika2({
      id: counterId,
      trackLinks: true
    });
    
    //正在去初始化计数器
    counter.destruct()    
    

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

与我们聊天

发送电子邮件

如果您无法独立检查计数器,请遵循以下建议。

发生这种情况的原因可能如下:

  • 计数器安装不正确。 例如 CMS 修改了计数器代码。 重新安装计数器或联系您的 CMS 的支持服务。
  • 损坏的脚本导致 Yandex Metrica 计数器无法在网站上运行。 您可以在浏览器控制台中检查这一点。
这些建议没有帮助

这意味着信息正在传输到 Yandex Metrica。 但是,由于以下任一原因,数据可能不会显示在报表中:

  • 数据被发送到具有不同编号的计数器。
  • 计数器设置中的 Filters 选项卡指定了过于严格的筛选条件。 删除不需要的筛选条件。
  • 计数器设置中的 Filters 选项卡已启用 Don't count my sessions 筛选条件。 这意味着计数器不会统计您自己的会话。 尝试使用您的浏览器在“隐身”模式下访问该网站。
这些建议没有帮助

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