Перейти к содержимому

Интеграция JavaScript SDK (Client)

JS SDK обеспечивает максимальную производительность без зависимостей. Наша платформа решает задачи управления файлами cookie и позволяет легко получать юридически обязывающие согласия.

Быстрый Старт

Начните с одного тега скрипта. Дизайн баннера, категории cookie, тексты и региональное соответствие (GDPR, CCPA…) — всё управляется из панели HashEntry:

<head>
  <script
    src="https://tool.hashentry.com/cmp.js"
    data-site="ВАШ_API_КЛЮЧ_САЙТА"
    async
  ></script>
</head>

Это всё. SDK загружает конфигурацию, привязанную к вашему API-ключу, с сервера; дизайн баннера, цвета, язык, категории и настройки поведения управляются из панели.

Блокировка Сторонних Скриптов

Пометьте скрипты, которые не должны запускаться до согласия, атрибутом type="text/plain":

<script type="text/plain" data-cookie-category="analytics">
  // Google Analytics — не запускается до одобрения "analytics"
</script>

<script type="text/plain" data-cookie-category="marketing"
        data-src="https://connect.facebook.net/en_US/fbevents.js">
</script>

Повторное Открытие Настроек

Иконка по умолчанию: Постоянная иконка «Настройки cookie» отображается на экране.
Свой элемент: Скройте иконку и вызовите CMP.show() из своей ссылки в подвале.

Поддерживаемые Атрибуты `data-*`

Атрибут	Обязательный	По умолчанию	Описание
`data-site`	✅	—	API-ключ сайта
`data-mode`	❌	`local-fallback`	Режим: `remote`, `local`, `local-fallback`
`data-language`	❌	`auto`	Язык баннера (`auto` = определение браузера)
`data-region`	❌	`auto`	Переопределение региона
`data-config`	❌	—	Встроенная JSON-конфигурация (local-режим)
`data-debug`	❌	`false`	Режим разработчика
`data-headless`	❌	`false`	UI-less режим

JavaScript API (`window.CMP`)

CMP.ready(() => { console.log('HashEntry CMP загружен.'); });

CMP.show();
CMP.hide();
CMP.accept();
CMP.reject();

const consent = CMP.getConsent();
CMP.hasConsent('analytics');

CMP.setMetadata({ order_id: 'ORD-54321' });

CMP.showDocumentApproval('polzovatelskoe-soglashenie', { transaction_id: 'TRX-101' })
  .then(result => { if (result.approved) console.log("Одобрено!", result.proof_hash); });

CMP.on('consent:given', (data) => { console.log("Согласие:", data.categories); });

Очередь Pre-init

<script>
window.__CMP_QUEUE = window.__CMP_QUEUE || [];
window.__CMP_QUEUE.push(['setMetadata', { order_id: 'ORD-12345' }]);
window.__CMP_QUEUE.push(['setRegion', 'RU']);
</script>

Продвинутый: Режимы Работы

Режим	Поведение	`data-site`	Сервер
`remote`	Конфигурация загружается с сервера	Обязательно	Требуется
`local`	Вся конфигурация предоставляется на странице	Опционально	Нет
`local-fallback` (по умолчанию)	Пытается загрузить с сервера, при ошибке использует local	Опционально	Предпочтительно

Локальный Режим

Работа полностью без сервера. Идеально для тестовых сред и офлайн-сценариев.

<head>
  <script type="application/json" id="cmp-config">
  {
    "banner_config": {
      "layout": "bottom_bar",
      "region_detection": "timezone",
      "theme": {
        "primary_color": "#2563EB",
        "font_family": "system",
        "theme_mode": "auto",
        "widget_icon": "cookie",
        "widget_position": "bottom_left"
      },
      "content": {
        "title": "Настройки Cookie",
        "description": "Этот сайт использует файлы cookie для улучшения вашего опыта.",
        "accept_button_text": "Принять Все",
        "reject_button_text": "Отклонить Все",
        "settings_button_text": "Управление",
        "save_selected_text": "Принять Выбранные",
        "close_text": "Закрыть",
        "widget_label": "Настройки Cookie"
      },
      "categories": [
        {
          "key": "necessary",
          "label": "Необходимые",
          "description": "Требуются для базовой работы сайта.",
          "required": true
        },
        {
          "key": "analytics",
          "label": "Аналитика",
          "description": "Статистика посетителей.",
          "required": false
        },
        {
          "key": "marketing",
          "label": "Маркетинг",
          "description": "Персонализированная реклама.",
          "required": false
        }
      ],
      "mobile_layout": "bottom_bar",
      "behavior": {
        "show_reject_button": true,
        "show_settings_button": true,
        "show_widget": true,
        "show_powered_by": true,
        "block_page_scroll": false,
        "modal_layout": "sidebar_right",
        "cookie_display_mode": "vendor",
        "banner_animation": "slide_fade",
        "modal_tabs": true,
        "record_informational_consent": false
      }
    }
  }
  </script>
  <script src="https://tool.hashentry.com/cmp.js" data-mode="local" data-language="ru" async></script>
</head>

Продвинутый: Определение Региона (`region_detection`)

Метод	Принцип работы	Сетевой запрос
`timezone`	Определение страны по часовому поясу браузера (120+ соответствий)	Нет
`freegeoip`	Бесплатный сервис IP→страна (таймаут 3с, откат на timezone)	Да

Playground