Выбор формата сниппета

Выбор формата сниппета

JavaScript для RUM — независимо от того, внедрен ли он автоматически или вставлен вручную в ваше веб-приложение — состоит из двух ключевых компонентов:

• Код мониторинга: JavaScript-код, обеспечивающий возможности RUM, такие как сбор действий пользователя.
• Конфигурация: Конфигурация приложения, которая первоначально используется кодом мониторинга. Позже она обновляется через ответ beacon-сигнала RUM при изменении конфигурации.

RUM от Ключ-АСТРОМ предоставляет несколько форматов сниппетов, которые интегрируют эти компоненты в ваши страницы различными способами, каждый из которых предназначен для удовлетворения конкретных требований. Эта страница содержит рекомендации, которые помогут вам выбрать формат сниппета, наилучшим образом отвечающий вашим требованиям, а также подробное описание каждого формата.

Рекомендации по выбору формата сниппета

Для большинства случаев использования мы рекомендуем следующее:

• Используйте JavaScript Tag для ручной вставки.
• Используйте JavaScript Tag ЕдиногоАгента для автоматического внедрения.

Если вы хотите использовать функцию браузера Subresource Integrity (SRI), чтобы убедиться, что код мониторинга не был изменен, используйте JavaScript tag ЕдиногоАгента с SRI для ручной вставки и автоматического внедрения.

Чтобы избежать блокирующего парсинг выполнения кода мониторинга, настройте опцию выполнения скрипта выбранного формата сниппета на async или defer. Инструкции по настройке этой опции приведены в документации для каждого отдельного формата сниппета ниже. Имейте в виду, что пока код мониторинга еще не полностью загружен и инициализирован, определенные временные метки и действия пользователя будут потеряны.

Доступные форматы сниппетов

JavaScript tag

JavaScript tag содержит ссылку на внешний файл, который включает в себя как код мониторинга, так и конфигурацию. JavaScript tag доступен только для ручной вставки.

Обновления

Короткая длительность кэширования, используемая для внешнего файла, обеспечивает регулярные автоматические обновления, что делает JavaScript tag идеальным выбором, если вы не хотите заботиться об обновлении вставленного сниппета после изменений конфигурации.

Источник кода мониторинга

Внешний файл загружается с вашего CDN.

Длительность кэширования

Внешний файл, содержащий код мониторинга и конфигурацию, обновляется в соответствии с его длительностью кэширования, которая по умолчанию составляет один час и может быть настроена. Доступные значения невелики — несколько часов или дней — чтобы обеспечить регулярное обновление конфигурации. Длительность кэширования определяет, как долго браузеры могут кэшировать файл. Если ваш CDN настроен, как описано в разделе «Подготовка кластера к промышленной эксплуатации», он кэширует файл в течение одного часа.

Чтобы настроить длительность кэширования:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Ручная вставка.
5. В разделе JavaScript tag используйте раскрывающийся список Кэшировать код мониторинга и конфигурацию в течение, чтобы выбрать необходимую длительность кэширования.

Выполнение скрипта

По умолчанию код мониторинга загружается и выполняется браузером синхронно. Чтобы избежать блокировки парсинга, вы можете настроить добавление атрибутов async или defer.

• С атрибутом async код мониторинга загружается параллельно с парсингом страницы и выполняется сразу, как только становится доступным.
• С атрибутом defer код мониторинга также загружается параллельно, но выполнение откладывается до завершения парсинга страницы.

При использовании обоих атрибутов определенные временные метки и действия пользователя будут потеряны, пока код мониторинга еще не полностью загружен и инициализирован.

Чтобы настроить выполнение скрипта:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Ручная вставка.
5. В разделе JavaScript tag установите параметр Атрибут выполнения скрипта в значение async, defer или Без атрибута.
6. Скопируйте сниппет и вставьте его на свою страницу.

При получении JavaScript tag через API вы можете управлять выполнением скрипта, передав параметр. Подробнее см. в разделе «GET JavaScript tag».

Добавление атрибута crossorigin="anonymous"

Включено по умолчанию. Внешний скрипт, на который ссылается JavaScript tag, загружается с вашего CDN, что приводит к кросс-доменному запросу. Чтобы включить сбор подробных сообщений об ошибках JavaScript и временных меток ресурсов W3C, необходимо включить атрибут crossorigin="anonymous" в тег script.

Чтобы включить добавление атрибута crossorigin="anonymous":

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Ручная вставка.
5. В разделе JavaScript tag включите Добавить атрибут crossorigin=anonymous.
6. Скопируйте сниппет и вставьте его на свою страницу.

При получении JavaScript tag через API вы можете управлять добавлением атрибута crossorigin="anonymous", передав параметр. Подробнее см. в разделе «GET JavaScript tag».

JavaScript tag ЕдиногоАгента

JavaScript tag ЕдиногоАгента включает конфигурацию и ссылается на внешний файл, содержащий код мониторинга. Он доступен как для ручной вставки, так и для автоматического внедрения.

Обновления

При ручной вставке JavaScript tag ЕдиногоАгента его необходимо также вручную обновлять при каждом изменении конфигурации. Чтобы обеспечить его актуальность, мы рекомендуем использовать его вместе с полностью автоматическими обновлениями через API. Использование JavaScript tag ЕдиногоАгента из веб-интерфейса не рекомендуется, если своевременные обновления конфигурации не критичны. В случае автоматического внедрения ЕдиныйАгент всегда внедряет JavaScript tag ЕдиногоАгента, используя текущую конфигурацию. Однако обратите внимание, что политика кэширования вашего приложения может влиять на то, как часто ЕдиныйАгент получает возможность внедрения. Для получения дополнительной информации см. «Оптимизация заголовков управления кэшем».

Источник кода мониторинга

В случае безагентного мониторинга код мониторинга доставляется вашим CDN. В случае автоматического внедрения или ручной вставки для страниц приложения с автоматическим внедрением файл по умолчанию доставляется ЕдинымАгентом, который инструментирует ваше приложение. Альтернативно, его также можно загружать с вашего CDN, см. «Запрос кода мониторинга с вашего CDN».

Длительность кэширования

Как браузеры, так и ваш CDN могут кэшировать код мониторинга до одного года. Такая увеличенная длительность кэширования становится возможной благодаря встраиванию в URL-адрес файла как версии RUM JavaScript, так и хэша активных модулей.

Выполнение скрипта

По умолчанию код мониторинга загружается и выполняется браузером синхронно. Чтобы избежать блокировки парсинга, вы можете настроить добавление атрибутов async или defer.

• С атрибутом async код мониторинга загружается параллельно с парсингом страницы и выполняется сразу, как только становится доступным.
• С атрибутом defer код мониторинга также загружается параллельно, но выполнение откладывается до завершения парсинга страницы.

При использовании обоих атрибутов определенные временные метки и действия пользователя будут потеряны, пока код мониторинга еще не полностью загружен и инициализирован.

Чтобы настроить выполнение скрипта для автоматического внедрения:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Автоматическое внедрение.
5. Если параметр Формат сниппета установлен на JavaScript tag ЕдиногоАгента, становится доступна опция Атрибут выполнения скрипта. Выберите async, defer или Без атрибута из раскрывающегося списка.
6. Выберите Сохранить изменения.

Чтобы настроить выполнение скрипта для ручной вставки:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Ручная вставка.
5. В разделе JavaScript tag ЕдиногоАгента установите параметр Атрибут выполнения скрипта в значение async, defer или Без атрибута.
6. Скопируйте сниппет и вставьте его на свою страницу.

При получении JavaScript tag ЕдиногоАгента через API вы можете управлять выполнением скрипта, передав параметр. Подробнее см. в разделе «GET JavaScript tag ЕдиногоАгента».

JavaScript tag ЕдиногоАгента с SRI

JavaScript tag ЕдиногоАгента с SRI позволяет использовать функцию браузера Subresource Integrity (SRI), чтобы убедиться, что код мониторинга не был изменен, см. «Использование Subresource Integrity (SRI) для кода Real User Monitoring». Он включает конфигурацию, ссылку на внешний файл, содержащий код мониторинга, и хэш целостности для этого кода мониторинга. Он поддерживается как для автоматического внедрения, так и для ручной вставки.

Обновления

При ручной вставке JavaScript tag ЕдиногоАгента с SRI его необходимо также вручную обновлять при каждом изменении конфигурации. Чтобы обеспечить его актуальность, мы рекомендуем использовать его вместе с полностью автоматическими обновлениями через API. Использование JavaScript tag ЕдиногоАгента с SRI из веб-интерфейса не рекомендуется, если своевременные обновления конфигурации не критичны. В случае автоматического внедрения ЕдиныйАгент всегда внедряет JavaScript tag ЕдиногоАгента с SRI, используя текущую конфигурацию. Однако обратите внимание, что политика кэширования вашего приложения может влиять на то, как часто ЕдиныйАгент получает возможность внедрения. Для получения дополнительной информации см. «Оптимизация заголовков управления кэшем».

Источник кода мониторинга

Код мониторинга всегда доставляется вашим CDN.

Длительность кэширования

Как браузеры, так и ваш CDN могут кэшировать код мониторинга до одного года. Такая увеличенная длительность кэширования становится возможной благодаря встраиванию в URL-адрес файла как версии RUM JavaScript, так и хэша активных модулей.

Выполнение скрипта

По умолчанию код мониторинга загружается и выполняется браузером синхронно. Чтобы избежать блокировки парсинга, вы можете настроить добавление атрибутов async или defer.

• С атрибутом async код мониторинга загружается параллельно с парсингом страницы и выполняется сразу, как только становится доступным.
• С атрибутом defer код мониторинга также загружается параллельно, но выполнение откладывается до завершения парсинга страницы.

При использовании обоих атрибутов определенные временные метки и действия пользователя будут потеряны, пока код мониторинга еще не полностью загружен и инициализирован.

Чтобы настроить выполнение скрипта для автоматического внедрения:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Автоматическое внедрение.
5. Если параметр Формат сниппета установлен на JavaScript tag ЕдиногоАгента с SRI, становится доступна опция Атрибут выполнения скрипта. Выберите async, defer или Без атрибута из раскрывающегося списка.
6. Выберите Сохранить изменения.

Чтобы настроить выполнение скрипта для ручной вставки:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Ручная вставка.
5. В разделе JavaScript tag ЕдиногоАгента с SRI установите параметр Атрибут выполнения скрипта в значение async, defer или Без атрибута.
6. Скопируйте сниппет и вставьте его на свою страницу.

При получении JavaScript tag ЕдиногоАгента с SRI через API вы можете управлять выполнением скрипта, передав параметр. Подробнее см. в разделе «GET JavaScript tag ЕдиногоАгента с SRI».

Inline code

Inline code содержит как конфигурацию, так и код мониторинга RUM, сводя к минимуму количество веб-запросов. Обратите внимание, что код мониторинга Воспроизведения сессий не встраивается, поэтому при использовании Воспроизведения сессий все равно будет дополнительный запрос. Если ваш веб-сайт состоит из множества отдельных страниц, использование inline code может быть невыгодным, так как это увеличивает размер каждого документа. Однако это может быть подходящим выбором для одностраничных приложений (SPA).

Обновления

При ручной вставке inline code его необходимо также вручную обновлять при каждом изменении конфигурации. Чтобы обеспечить его актуальность, мы рекомендуем использовать его вместе с полностью автоматическими обновлениями через API. Использование inline code из веб-интерфейса не рекомендуется, если своевременные обновления конфигурации не критичны. В случае автоматического внедрения ЕдиныйАгент всегда внедряет inline code, используя текущую конфигурацию. Однако обратите внимание, что политика кэширования вашего приложения может влиять на то, как часто ЕдиныйАгент получает возможность внедрения. Для получения дополнительной информации см. «Оптимизация заголовков управления кэшем».

Источник кода мониторинга

В случае безагентного мониторинга код мониторинга Воспроизведения сессий доставляется вашим CDN. В случае автоматического внедрения или ручной вставки для страниц приложения с автоматическим внедрением код мониторинга Воспроизведения сессий по умолчанию доставляется ЕдинымАгентом, который инструментирует ваше приложение. Альтернативно, его также можно загружать с вашего CDN, см. «Запрос кода мониторинга с вашего CDN».

Длительность кэширования

Поскольку код мониторинга RUM встроен, его длительность кэширования соответствует длительности кэширования вашей страницы, которая определяется настройками кэширования на вашем веб-сервере. Код мониторинга Воспроизведения сессий может кэшироваться до одного года как браузерами, так и вашим CDN. Эта увеличенная длительность кэширования становится возможной благодаря встраиванию версии RUM JavaScript в URL-адрес файла.

Выполнение скрипта

Код мониторинга загружается и выполняется браузером синхронно.

Code snippet

Code snippet содержит конфигурацию и базовую функциональность кода мониторинга. Он доступен как для ручной вставки, так и для автоматического внедрения.

• В случае ручной вставки он вставляет на страницу еще один элемент script, который ссылается на внешний файл, содержащий полную функциональность кода мониторинга.
• В случае автоматического внедрения этот второй элемент script вставляется ЕдинымАгентом, когда он внедряет code snippet.

Внешний файл, содержащий полную функциональность кода мониторинга, может быть настроен на загрузку либо синхронно, либо асинхронно с использованием атрибута defer.

Обновления

В случае ручной вставки обновления кода мониторинга и конфигурации доступны после первой перезагрузки страницы. Чтобы текущая конфигурация была доступна с самого начала, code snippet необходимо регулярно обновлять. Это также необходимо для гарантии совместимости между code snippet и внешним файлом, которую мы тестируем в течение одного года. В случае автоматического внедрения ЕдиныйАгент всегда внедряет code snippet, используя текущую конфигурацию. Однако обратите внимание, что политика кэширования вашего приложения может влиять на то, как часто ЕдиныйАгент получает возможность внедрения. Для получения дополнительной информации см. «Оптимизация заголовков управления кэшем».

Источник кода мониторинга

В случае безагентного мониторинга внешний файл, содержащий полную функциональность кода мониторинга, доставляется вашим CDN. В случае автоматического внедрения или ручной вставки для страниц приложения с автоматическим внедрением он по умолчанию доставляется ЕдинымАгентом, который инструментирует ваше приложение. Альтернативно, его также можно загружать с вашего CDN, см. «Запрос кода мониторинга с вашего CDN».

Длительность кэширования

Кэширование code snippet соответствует кэшированию страницы, которое определяется конфигурацией вашего веб-сервера. Внешний файл может кэшироваться до одного года как браузерами, так и вашим CDN. Эта увеличенная длительность кэширования становится возможной благодаря встраиванию в URL-адрес файла как версии RUM JavaScript, так и хэша активных модулей.

Выполнение скрипта

Внешний файл, предоставляющий полную функциональность кода мониторинга, может быть настроен на загрузку либо синхронно, либо асинхронно с использованием атрибута defer. При асинхронной загрузке скрипт загружается параллельно с парсингом HTML и выполняется только после того, как весь документ будет полностью проанализирован. Пока код мониторинга еще не полностью загружен, определенные временные метки и действия пользователя будут потеряны.

Чтобы настроить выполнение скрипта для ручной вставки:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Ручная вставка.
5. В разделе Code snippet используйте раскрывающийся список Загружать код мониторинга, чтобы выбрать синхронно или отложенно.
6. Скопируйте сниппет и вставьте его на свою страницу.

Чтобы настроить выполнение скрипта для автоматического внедрения:

1. Перейдите в раздел Веб.
2. Выберите приложение, которое хотите настроить.
3. В правом верхнем углу страницы обзора приложения выберите Дополнительно (…) > Редактировать.
4. В настройках приложения выберите Внедрение > Автоматическое внедрение.
5. В разделе Формат сниппета выберите Code snippet.
6. В разделе Загружать код мониторинга выберите опцию синхронно или отложенно.
7. Выберите Сохранить изменения.