Инструменты для интеграции

Помимо «голого» REST API, у OneCatalog есть готовые UI-инструменты, которые ускоряют интеграцию с вашим сайтом, CRM или 1С. Они доступны на отдельном поддомене tools.onecatalog.ru .

Авторизация. Все инструменты используют тот же ключ API, что и Wiki API. Получить ключ можно в личном кабинете → раздел «API-ключи».

OneCatalog Picker

Picker — встраиваемый виджет для выбора товара из каталога OneCatalog. Открывается во всплывающем окне, пользователь ищет/фильтрует плитку, и при подтверждении выбора отдаёт в ваш сайт идентификатор товара (public_id) и базовые данные — название, изображение, бренд.

Когда пригодится

  • Заполнение каталога интернет-магазина по «нашим» SKU без копирования вручную
  • Подбор материалов в калькуляторе ремонта / CRM-карточке клиента
  • Привязка позиций к заявкам у дилеров и B2B-партнёров
  • Выбор плитки для 3D-визуализатора или конфигуратора

Демо

Открытое демо доступно по ссылке: tools.onecatalog.ru/index.html . Откройте в новой вкладке, чтобы поиграться с поиском, фильтрами и выбором.

Встраивание

Раздел в работе. Финальный JS-снипплет (имя глобальной функции, параметры конструктора, имена событий) будет опубликован вместе с релизом Picker v1. Шаблоны ниже — это скелет, который мы заполним конкретными именами, как только публичный API будет зафиксирован.

Вариант 1. Открыть Picker в новой вкладке

Самый простой способ — без JS, как обычная ссылка с возвратом по postMessage или редиректом на ваш return_url:

<a
  href="https://tools.onecatalog.ru/index.html?api_key=YOUR_KEY&return_url=https://yoursite.ru/picked"
  target="_blank"
  rel="noopener"
>
  Выбрать товар из OneCatalog
</a>

Вариант 2. Встроить как iframe

<iframe
  src="https://tools.onecatalog.ru/index.html?api_key=YOUR_KEY&embed=1"
  width="100%"
  height="600"
  style="border:0; border-radius:12px;"
  loading="lazy"
></iframe>

<script>
// Picker сообщает о выборе через postMessage
window.addEventListener('message', (event) => {
  if (event.origin !== 'https://tools.onecatalog.ru') return
  if (event.data?.type === 'onecatalog:picked') {
    const product = event.data.product
    // product.public_id, product.menutitle, product.images_urls и т.д.
    console.log('Выбран товар:', product)
  }
})
</script>

Вариант 3. Подключить готовый JS-сниппет

<script src="https://tools.onecatalog.ru/picker.js" defer></script>

<button id="pick-btn">Выбрать товар</button>

<script>
document.getElementById('pick-btn').addEventListener('click', () => {
  // TODO: точное имя метода уточняется
  OneCatalog.Picker.open({
    apiKey: 'YOUR_KEY',
    onSelect: (product) => {
      console.log('Selected:', product.public_id, product.menutitle)
    },
    onClose:  () => { /* ... */ },
  })
})
</script>

Возвращаемые поля товара

Picker возвращает урезанный объект ApiProduct — те же поля, что и GET /products/{id}/:

{
  "public_id": "PRD-CRX-039",
  "menutitle": { "ru": "Cersanit Calacatta", "en": "Cersanit Calacatta" },
  "article":   "CC-300",
  "brand": { "id": 5, "menutitle": { "ru": "Cersanit" } },
  "images_urls": {
    "min":    "https://cdn.onecatalog.ru/.../min.jpg",
    "middle": "https://cdn.onecatalog.ru/.../middle.jpg",
    "max":    "https://cdn.onecatalog.ru/.../max.jpg"
  }
}

Полную карточку товара можно дозапросить уже через основной API по public_id.

Другие инструменты

Picker — первый, но не единственный инструмент на tools.onecatalog.ru. Туда же планируется добавить:

  • Генератор feed-файла (YML / CSV) под Яндекс.Маркет и Wildberries
  • Конвертер артикулов между производителями
  • Builder для embed-витрин на JS
  • Просмотр оригиналов изображений в максимальном разрешении

Если какой-то из этих инструментов вам нужен сейчас — напишите на hello@onecatalog.ru и мы подсветим приоритет в roadmap.