YandexMetricaTracker

YandexMetricaTracker adds the Yandex Metrica counter to a page. Use it when you measure a Blazor site with Yandex Metrica. It renders a script, not visible markup, and a live demo would load Yandex's script on this page, so this page has no demo and shows the markup it renders instead.

Package Osirion.Blazor.Analytics, namespace Osirion.Blazor.Analytics.Components. Source on GitHub.

Usage

Register the service once, then place the tracker in the <head> of App.razor, after <HeadOutlet />. It renders on the server, so it works under Static SSR with no interactive render mode.

using Osirion.Blazor.Analytics.Extensions;

builder.Services.AddOsirionAnalytics(analytics => analytics
    .AddYandexMetrica(options => options.CounterId = "12345678"));

@using Osirion.Blazor.Analytics.Components

<head>
    <meta charset="utf-8" />
    <base href="/" />
    <HeadOutlet />
    <YandexMetricaTracker />
</head>

The same options can come from configuration. AddOsirionAnalytics(builder.Configuration) registers the service when the Osirion:Analytics:YandexMetrica section exists:

{
  "Osirion": {
    "Analytics": {
      "YandexMetrica": { "CounterId": "12345678" }
    }
  }
}

The key YandexMetrica at the top level of the configuration, used before the Osirion:Analytics prefix existed, is still read when the new section is absent.

A tracker whose service is not registered, or whose required value is missing or invalid, renders nothing.

Parameters

A parameter you leave unset keeps the configured value.

CounterId, WebVisor, ClickMap, TrackLinks and AccurateTrackBounce replace the configured values for this render. Enabled set to false turns the tracker off for this render. SiteId is inherited but ignored: this tracker takes CounterId instead.

The last three rows, Theme, Class and Style, come from the component base class and have no effect: the tracker renders no wrapper element.

Rendered markup

With the defaults and these placeholder values (not real ones), the tracker writes:

12345678 is a placeholder counter ID.

<script type="text/javascript">
    (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
    m[i].l=1*new Date();
    for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
    k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
    (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");

    ym(12345678, "init", {"clickmap":true,"trackLinks":true,"accurateTrackBounce":true});
</script>
<script src="/_content/Osirion.Blazor.Analytics/js/osirion-analytics.js" defer data-osirion-analytics="yandex" data-counter="12345678"></script>

The init options list only what is on: the defaults give clickmap, trackLinks and accurateTrackBounce. The counter ID is written as a bare number, which is why it must be digits only. The last script is the page view module (see Behavior); its address is relative, so the document needs a <base href="/" />.

Configuration

The keys live under Osirion:Analytics:YandexMetrica. Every service also has Enabled (default true) and AutoTrackPageViews (default true).

CounterId and AlternativeCdn are checked at startup when the service is enabled: a non-blank CounterId that is not numeric, or an AlternativeCdn that is not an absolute http(s) address, stops the app with a message that names the key.

Consent

The consent gate of the package is off by default. Turn it on with RequireConsent() (or Osirion:Analytics:Consent:RequireConsent) and this tracker renders nothing until the visitor accepted the analytics category in OsirionCookieConsent; see the package page for the setup. The check reads the consent cookie on the server and fails closed: with the gate on and no HttpContext, for example inside a component that already runs interactively, the tracker renders nothing. That is why trackers belong in App.razor.

Yandex Metrica has no consent API in this tracker: the gate only decides whether the script is written. The noscript pixel from the Yandex snippet is not written: it is valid only in the body, and the tracker belongs in the head, so visitors without JavaScript are not counted.

Content Security Policy

The tracker writes an inline script and adds no nonce, so script-src must allow inline scripts, or allow this script by its hash. Allow https://mc.yandex.ru for script-src (or the host of AlternativeCdn), and for img-src because of the noscript pixel. The counter then sends to Yandex addresses on its own; this code does not show them, so take them from Yandex's documentation.

Behavior

• Rendering. The markup is written only when Enabled is on, CounterId is numeric and, with the consent gate on, the visitor consented.
• Page views after enhanced navigation. Blazor enhanced navigation patches the page without a full load, so the counter would not see the new page. The page view module (/_content/Osirion.Blazor.Analytics/js/osirion-analytics.js) listens for Blazor's enhancedload event and calls ym(counter, 'hit', url, ...) with the new URL, title and referrer. Navigation inside a router that already runs interactively does not raise enhancedload and is not reported.
• Events. The tracker offers no custom event API; call ym from your own script.

Related

• Analytics components: the six trackers and how they share setup
• Osirion.Blazor.Analytics: install, registration and the consent gate
• Cookie consent: the banner that records the visitor's choice