Поиск по фото

Покупатель фотографирует вещь или загружает скриншот — SearchBooster находит визуально похожие товары в вашем каталоге. Работает на векторах картинок, которые строятся из <picture> фида при индексации.

Попробуйте

Демо-каталог состоит из пород собак — загрузите фото собаки и посмотрите, какие породы найдутся:

📷Загрузите фото собакиперетащите файл, вставьте из буфера (⌘V) или сфотографируйте с телефона

Запрос

Тот же метод /search, но POST и картинка в поле image:

curl -X POST 'https://api.searchbooster.net/api/{uuid}/search?limit=24' \
  -H 'Content-Type: text/plain;charset=UTF-8' \
  --data-raw '{"image":"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQ..."}'

Поле	Описание
image	Картинка в формате data URI: data:image/jpeg;base64,… или data:image/png;base64,….
limit, skip, params, regionId, categoryId	Работают как в обычном поиске — можно искать по фото внутри категории или с фильтрами.

В ответе — обычный ответ /search, а meta.searchType равен ["image"].

Почему text/plain

Тело — это JSON, но с заголовком Content-Type: text/plain браузер не делает предварительный CORS-запрос (OPTIONS), и поиск отвечает быстрее. С сервера можно отправлять и application/json.

Подготовка картинки

• Уменьшайте до 512 px по большей стороне и сжимайте в JPEG (качество 0.8–0.85). Модели больше не нужно, а запрос становится в 10–20 раз меньше.
• Обрезайте до объекта, если пользователь выделил область.
• Поддерживаются JPEG и PNG. WebP и HEIC сначала конвертируйте в JPEG — на canvas это делается автоматически.

async function imageToDataUrl(file, max = 512) {
  const bmp = await createImageBitmap(file);
  const k = Math.min(1, max / Math.max(bmp.width, bmp.height));
  const canvas = document.createElement('canvas');
  canvas.width = Math.round(bmp.width * k);
  canvas.height = Math.round(bmp.height * k);
  canvas.getContext('2d').drawImage(bmp, 0, 0, canvas.width, canvas.height);
  return canvas.toDataURL('image/jpeg', 0.85);
}

const res = await fetch(`https://api.searchbooster.net/api/${UUID}/search?limit=24`, {
  method: 'POST',
  headers: { 'Content-Type': 'text/plain;charset=UTF-8' },
  body: JSON.stringify({ image: await imageToDataUrl(fileInput.files[0]) }),
});

В мобильном приложении

// iOS: UIImage → JPEG → base64
let resized = image.resized(maxSide: 512)
let b64 = resized.jpegData(compressionQuality: 0.85)!.base64EncodedString()
let body = try JSONSerialization.data(withJSONObject: ["image": "data:image/jpeg;base64,\(b64)"])

// Android: Bitmap → JPEG → base64
val out = ByteArrayOutputStream()
Bitmap.createScaledBitmap(bitmap, w, h, true).compress(Bitmap.CompressFormat.JPEG, 85, out)
val body = JSONObject().put("image", "data:image/jpeg;base64," + Base64.encodeToString(out.toByteArray(), Base64.NO_WRAP))

Требования

• Поиск по фото включается для проекта в личном кабинете или поддержкой; после включения строятся векторы картинок каталога.
• У товаров должны быть доступные для скачивания <picture>. Для векторов используется первая картинка товара.
• Ответ обычно приходит за 0.3–1.5 с: большая часть — построение вектора вашей картинки.

Похожие по фото товары для карточки товара (без загрузки картинки) — в разделе Похожие по фото.