Выбор формата фрагмента

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

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

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

На этой странице представлены рекомендации по выбору формата фрагмента текста, наиболее соответствующего вашим требованиям, а также подробное описание каждого формата.

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

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

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

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

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

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

JavaScript

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

GET тег JavaScript через API

Обновления

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

Мониторинг исходного кода

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

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

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

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

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

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

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

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

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

Для настройки выполнения скрипта

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

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

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

🟢 Включено по умолчанию

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

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

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

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

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

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

GET JavaScript ЕдиныйАгент tag

Обновления

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

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

Мониторинг исходного кода

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

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

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

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

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

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

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

Для настройки выполнения скрипта для автоматического внедрения

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

Настройка выполнения скрипта для ручной вставки

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

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

JavaScript ЕдиногоАгента с поддержкой SRI

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

Обновления

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

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

Мониторинг исходного кода

Код мониторинга всегда доставляется через вашу CDN-сеть.

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

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

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

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

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

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

Для настройки выполнения скрипта для автоматического внедрения

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

Настройка выполнения скрипта для ручной вставки

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

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

Встроенный код

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

Обновления

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

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

Мониторинг исходного кода

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

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

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

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

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

Фрагмент кода

Приведённый фрагмент кода содержит конфигурацию и основные функции кода мониторинга. Он доступен как для ручного, так и для автоматического внедрения.

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

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

Обновления

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

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

Мониторинг исходного кода

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

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

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

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

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

Настройка выполнения скрипта для ручной вставки

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

Для настройки выполнения скрипта для автоматической инъекции

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