Passer au contenu principal
Après avoir organisé une enchère de listing, vous voudrez souvent combiner les gagnants avec les résultats organiques. Par exemple, supposons que vous construisez une section de catégorie d’une boutique en ligne qui affichera également un certain nombre de produits sponsorisés. Vous aurez besoin d’un moyen d‘“injecter” vos gagnants d’enchères dans les résultats de catégorie réguliers. Cette page montre les étapes impliquées dans la construction d’une telle section de catégorie, mais des considérations similaires s’appliquent à d’autres pages ou widgets.

​
Scénario

La section de catégorie doit prendre en charge la pagination et afficher 3 produits par page. Si possible, le premier produit de chaque page sera un produit sponsorisé. Les produits de cette page de catégorie ont la structure suivante : 
{
  "id": "sku-367",
  "categoryId": "Shoes",
  "name": "Running shoes",
  "image": "photo_123.jpg",
  "description": "Beautiful and fast running shoes",
  "resolvedBidId": null
}
Le resolvedBidId est null lorsque le produit n’est pas promu et contient un ID de chaîne lorsqu’il l’est. Notre objectif est d’avoir le pseudo-code en place pour un point de terminaison qui pourrait créer des listes de tels produits.

​
1. Interroger vos résultats organiques

La première étape sera d’interroger vos résultats organiques. Les produits qui devraient être affichés pour une page et une catégorie spécifiques. Le code pour le faire pourrait ressembler à ceci : 
const pageSize = 3;
let products = queryProductsInCategory(pageSize, cursor, categoryId);

console.log(products);
Disons que nous devions exécuter ce code pour la première page de la catégorie Shoes, et qu’il y a 3 produits ou plus disponibles dans cette catégorie. Ce code produirait alors quelque chose de similaire à ceci : 
[
  {
    "id": "sku-367",
    "categoryId": "Shoes",
    "name": "Running shoes",
    "image": "photo_123.jpg",
    "description": "Beautiful and fast running shoes"
  },
  {
    "id": "sku-897",
    "categoryId": "Shoes",
    "name": "Slippers",
    "image": "slippers.jpg",
    "description": "A pair of comfortable slippers"
  },
  {
    "id": "sku-343",
    "categoryId": "Shoes",
    "name": "Dress shoes",
    "image": "dress_shoe_original.jpg",
    "description": "Elegant dress shoes for formal events"
  }
]
Notez que ces produits n’ont pas encore le champ resolvedBidId, ajoutons-le. 
const pageSize = 3;
let products = queryProductsInCategory(pageSize, cursor, categoryId);
products.forEach((prod) => {
  prod.resolvedBidId = null;
});
Maintenant, nous devons considérer ce qui se passe s’il n’y a pas de résultats organiques pour cette page et cette catégorie. Nous voulons probablement renvoyer une erreur 404 et ne pas organiser d’enchères. Cela nous donne le code suivant : 
const pageSize = 3;
let products = queryProductsInCategory(pageSize, cursor, categoryId);
if (products.length === 0) {
  throw new NotFoundError("no products found");
}

products.forEach((prod) => {
  prod.resolvedBidId = null;
});
Avec cette gestion des erreurs en place, nous sommes prêts à organiser une enchère.

​
2. Organisation d’une enchère

Dans notre scénario, nous voulons organiser une enchère pour un seul emplacement : 
// skip earlier code...

const slots = 1;
const winners = runAuctionForCategory(slots, categoryId);

console.log(winners);
Vous ne savez pas comment organiser une enchère pour une catégorie ? Consultez ces exemples.
S’il y a des gagnants, la sortie du code ci-dessus ressemblerait à quelque chose comme ceci : 
[
  {
    "rank": 1,
    "type": "product",
    "id": "sku-444",
    "resolvedBidId": "WyJiX01mazE1IiwiMTJhNTU4MjgtOGVhZC00Mjk5LTgzMjctY2ViYjAwMmEwZmE4IiwibGlzdGluZ3MiLCJkZWZhdWx0IiwiIl0="
  }
]
Si vous regardez les gagnants, vous verrez qu’ils ne contiennent pas de données de produit, juste un tas d’ID. Nous devrons interroger les données de produit pour ces gagnants. De plus, il est possible qu’il n’y ait pas de gagnants. Il se peut simplement qu’il n’y ait pas de campagnes actives appropriées pour cette enchère, mais il existe de nombreuses autres raisons potentielles. Quoi qu’il en soit, nous devons tenir compte de ce cas et nous renverrons simplement les résultats organiques disponibles dans products. 
// skip earlier code...

const slots = 1;
const winners = runAuctionForCategory(slots, categoryId);
if (winners.length === 0) {
  return products;
}

​
3. Interroger les données de produit pour les gagnants

Maintenant, lorsqu’il y a des gagnants. Nous devons interroger les données de produit pour eux. 
// skip earlier code...

const ids = winners.map((x) => x.id);
const promoProducts = queryProductsByIds(ids);

console.log(promoProducts);
En suivant nos exemples précédents, cela pourrait enregistrer quelque chose comme : 
[
  {
    "id": "sku-444",
    "categoryId": "Shoes",
    "name": "Wooden clogs",
    "image": "clogs.jpg",
    "description": "Original wooden clogs."
  }
]
Encore une fois, nous devons ajouter le resolvedBidId pour compléter ces données. Mais, cette fois, nous ne devrions pas le définir sur null, car nous traitons maintenant des produits promus. Si nous supposons que queryProductsByIds renverra des produits dans le même ordre que les ids fournis, nous pouvons ajouter les ID d’enchères comme suit : 
// skip earlier code...

const ids = winners.map((x) => x.id);
const promoProducts = queryProductsByIds(ids);
promoProducts.forEach((prod, i) => {
  prod.resolvedBidId = winners[i].resolvedBidId;
});
Pourquoi cet ID d’enchère est-il nécessaire ? L’ID d’enchère est essentiel pour permettre à Topsort d’attribuer des événements aux enchères et aux campagnes.
Il ne reste plus qu’à fusionner nos produits promus avec les résultats organiques.

​
4. Fusion

Nous voulons afficher les produits promus au début de la liste. Pour y parvenir, nous devrons ajouter les promoProducts au début des products. Cependant, cela peut alors faire que products ait plus d’éléments que notre taille de page prévue de 3. Nous devons donc le découper pour rester dans cette taille de page. 
// skip earlier code...

products.unshift(...promoProducts);
return products.slice(0, pageSize);
Maintenant, notre code renvoie un maximum de 3 produits, dont le premier produit peut être un produit sponsorisé.

​
Code complet

// query for organic products.
const pageSize = 3;
let products = queryProductsInCategory(pageSize, cursor, categoryId);
if (products.length === 0) {
  throw new NotFoundError("no products found");
}

products.forEach((prod) => {
  prod.resolvedBidId = null;
});

// run an auction.
const slots = 1;
const winners = runAuctionForCategory(slots, categoryId);
if (winners.length === 0) {
  return products;
}

// query product data for winners.
const ids = winners.map((x) => x.id);
const promoProducts = queryProductsByIds(ids);
promoProducts.forEach((prod, i) => {
  prod.resolvedBidId = winners[i].resolvedBidId;
});

// merge results.
products.unshift(...promoProducts);
return products.slice(0, pageSize);