Saltar al contenido principal
Esta guía explica cómo recuperar recomendaciones de productos usando la Product Recommendation API sin incrustar el elemento HTML de Kameleoon. Consulte la guía de integración visual para el método visual. Utilice el siguiente endpoint:

​
¿Por qué usar la API?

Use la API para aplicaciones móviles.
Según sus necesidades, este enfoque ofrece múltiples ventajas:
  • Control total: Personalice la visualización de la variación para que coincida con sus estándares de diseño y UX.
  • Mejor rendimiento: Utilice llamadas a la API optimizadas para reducir los retrasos de carga de la página en comparación con las soluciones basadas en script.
  • Depuración más sencilla: Registre, supervise y depure las integraciones dentro de su base de código del cliente utilizando herramientas estándar.
  • Sin dependencia de scripts de terceros: Utilice llamadas directas para evitar scripts externos, reducir conflictos potenciales y alinearse con las políticas de seguridad.
  • Compatible con SPAs: Integre directamente en aplicaciones de una sola página para evitar problemas de tiempo y encajar con el enrutamiento del lado del cliente.
  • Resistencia frente a bloqueadores de anuncios: Entregue los experimentos de forma consistente sin scripts de terceros ni marcadores HTML específicos. Para más detalles sobre cómo afectan los bloqueadores de anuncios a Kameleoon, consulte las FAQ.

​
Objetivo

Recuperar recomendaciones del catálogo de productos usando la Product Recommendation API. La siguiente imagen muestra una sección de recomendaciones añadida a una página de producto:
Product Page without Recommendations

​
Requisitos

  • Una cuenta de Kameleoon válida con un Store ID (shop_id).
    • Obtenga su shop_id en Recommendations > Settings > Store settings en la aplicación Kameleoon. Contacte con su Customer Success Manager para obtener la clave si es necesario.
Store Key
  • Un Device ID (did) y un Session ID (sid). (Obligatorios solo cuando se utilicen filtros o algoritmos que dependan de datos históricos de dispositivo/usuario).
    • Para Kameleoon Web Experimentation, obténgalos de las siguientes cookies:
      • KameleoonProducts_device_id → Device ID (did)
      • KameleoonProducts_session_code → Session ID (sid)
    • En caso contrario, genere estos valores manualmente.

​
Pasos

​
1. Recuperar las cookies (solo Kameleoon Web Experimentation)

Genere estos valores manualmente para implementaciones de backend o entornos sin Kameleoon Web Experimentation. Consulte el endpoint Init para más detalles.
function getCookie(name) {
  const match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
  if (match) return match[2];
}
const did = getCookie('KameleoonProducts_device_id');
const sid = getCookie('KameleoonProducts_session_code');

​
2. Configurar las recomendaciones de productos

Navegue a Recommendations > Product Recommendations > Recommendation Blocks en la aplicación Kameleoon. Para bloques no configurados, siga esta guía. Identifique el recommender_code.
Recommender Code
La API no devuelve los estilos CSS configurados en la aplicación Kameleoon.

​
3. Solicitud de consulta

Endpoint: 
GET https://api.products.kameleoon.com/recommend/{%recommender_code%}
Sustituya {recommender_code} por el valor obtenido en el Paso 2.
ParámetroTipoObligatorioDescripción
didStringTrueDevice ID
shop_idStringTrueStore Key
sidStringTrueID de sesión temporal del usuario
resize_imageIntegerFalseTamaño de imagen (px) para el redimensionado. Valores admitidos: 120, 140, 160, 180, 200, 220.
extendedInteger/EmptyOpcionalAñade información extendida para los productos recomendados. Si es 1, la API devuelve toda la información de los productos. Si está vacío, la API devuelve solo los IDs de los productos.
with_locationsBooleanFalseSi es true y extended también es true, la respuesta incluye location_ids para la disponibilidad del producto. Si extended falta o es false, la API ignora with_locations y lo establece por defecto en false.
Ejemplo: 
curl -X GET -L 'https://api.products.kameleoon.com/recommend/trending_products_01' \
             -H 'Content-Type: application/json' \
             -d '{
  "did": "abc123-kam-device-id",
  "shop_id": "shop_4567_example",
  "sid": "session_7890_example",
}'

​
4. Respuesta

NombreTipoDescripción
htmlstringCódigo HTML para el bloque de productos. Personalice la plantilla en la cuenta personal de Kameleoon.
titlestringTítulo del bloque. Coincide con el valor del elemento “Action” en las reglas del bloque.
recommendsarrayLista de productos.
idnumberIdentificador único del bloque. Coincide con el ID del bloque en la cuenta personal de Kameleoon.
Si extended = 1, los productos contienen todos los detalles del producto. En caso contrario, la API devuelve solo los IDs de los productos como cadenas.
La aplicación móvil puede ignorar html.
La API no devuelve CSS; debe aplicar estilos al resultado manualmente.
La siguiente imagen muestra la página del producto con la respuesta HTML integrada:
Product Page with Recommendations

​
a. Con extended = 0

{
    "id": 2476,
    "recommends": [
        "AsTi-01-black-4",
        "C-02-black-7",
        "C-01-white-8",
        "VN-09-beige-4",
        "DM-03-red-6",
        "DM-02-black-5"
    ],
    "title": "Popular products",
    "link": "",
    "html": "<div class=\"kn-reco-block_2476\"> ... <\/div>"
}

​
b. Con extended = 1

{
    "id": 870,
    "recommends": [
        {
            "name": "CONVERSE | TODDLER CHUCK TAYLOR ALL STAR AXEL MID",
            "url": "https://kameleoon-store.myshopify.com/products/converse-toddler-chuck-taylor-all-star-axel-mid?variant=40023417028772&recommended_by=dynamic&recommended_code=bdf46866294e4b8733eb2c2084423967",
            "category_ids": [
                "1",
                "295508017316"
            ],
            "barcode": "C-03-black-5",
            "vendor_code": "CO",
            "brand": "Converse",
            "leftovers": "few",
            "rating": 5,
            "picture": "https://images.products.kameleoon.com/resize-images/180/9fa630bf863db7a87fc6d5fd2a188f/3919221.jpg",
            "price_formatted": "$ 70",
            "price": 70,
            "currency": "$",
            "id": "C-03-black-5"
        }
    ],
    "title": "Popular Products",
    "link": "",
    "html": "<section class=\"KameleoonProducts-recommend\"> ... <\/section>"
}
}