Справочник API

Полный справочник по API Try-on

Справочник API

window.fitting('init', options)

Инициализирует виджет. Вызывается один раз, до всех остальных методов.

Параметр	Тип	Обязателен	Описание
`apiKey`	`string`	Да	Ваш API-ключ виджета

window.fitting('init', {
  apiKey: 'pk_live_xxx',
});

window.fitting('create', options)

Запускает виртуальную примерку.

Параметр	Тип	Обязателен	Описание
`targetElementId`	`string`	Да	ID контейнера, в котором отображается виджет
`tryonItems`	`TryonItem[]`	Да	Массив товаров, доступных для примерки
`displayMode`	`'inline' \| 'modal'`	Нет	Режим отображения виджета
`model`	`'balanced' \| 'quality' \| 'performance'`	Нет	Режим отрисовки (по умолчанию: `'balanced'`)
`config`	`StyleType`	Нет	Настройки внешнего вида виджета подробнее в стилизации
`callbackData`	`Any`	Нет	Пользовательские данные, которые будут отправлены на ваш сервер (Webhook) при успешном завершении генерации. URL для отправки вебхука настраивается в панели управления (админке).
`onSuccess`	`function`	Нет	Колбек, вызывается после успешной генерации
`onClose`	`function`	Нет	Колбек, вызывается после закрытия виджета

TryonItem

Поле	Тип	Описание
`productName`	`string`	Отображаемое название товара
`url`	`string`	Полный URL изображения товара

Стилизации

Настроить внешний вид виджета можно в панели управления: API Keys → Ваш ключ → Стилизовать.

Также оформление можно переопределить программно на этапе инициализации, передав объект config в метод window.fitting('create', ...). Параметры, переданные в config, имеют более высокий приоритет и перезаписывают настройки из панели управления:

Параметр	Тип	Обязателен	Описание
`title_color`	`string`	"#404040"	Цвет основных заголовков
`description_color`	`string`	"#9ca3af"	Цвет вспомогательного текста и описаний
`background_color`	`string`	"#ffffff"	Цвет фона модального окна или контейнера виджета
`loader`	`string`	".../loader.json"	Прямая ссылка на JSON-анимацию Lottie для экрана ожидания генерации
`primary_btn_bg_color`	`string`	"#111827"	Цвет фона основной кнопки действия (Primary button)
`primary_btn_text_color`	`string`	"#ffffff"	Цвет текста внутри основной кнопки
`secondary_btn_bg_color`	`string`	"#f5f5f5"	Цвет фона второстепенной кнопки (Secondary button)
`secondary_btn_text_color`	`string`	"#262626"	Цвет текста внутри второстепенной кнопки
`close_cross_color`	`string`	"#404040"	Цвет иконки крестика (кнопки закрытия)
`show_logo`	`string`	true	Отображение логотипа сервиса в интерфейсе виджета
`show_back_btn_post_gen`	`string`	true	Отображение кнопки «Назад» на экране с результатом генерации

window.fitting('create', {
  targetElementId: 'widget-container',
  model: 'balanced',
  tryonItems: [
    {
      productName: 'Джинсовая куртка',
      url: 'https://example.com/jacket.png',
    },
  ],
});