Preview:
app.post("/upload", upload.single("image"), async (req, res) => {
  try {
    if (!req.file) {
      res.status(400).json({ success: false, error: "No file uploaded" });
      return;
    }
    const imageBuffer = req.file.buffer;
    const itemsArray = [];

    const fileName = `public/${Date.now()}.png`;
    const imageUrl = await uploadToSupabase(imageBuffer, fileName);
    console.log("Uploaded image:", imageUrl);

    const objects = await getObjectDetection(imageBuffer);

    const productTitle = await getProductTitle(imageBuffer);
    console.log("Product title:", productTitle);

    const matchedCategory = await compareTitleToJSON(productTitle);
    console.log("Matched Category:", matchedCategory);

    let croppedImageUrl;
    let categoryExistsInObjects = false;
    if (matchedCategory) {
      for (const object of objects) {
        if (object.name.toLowerCase() === matchedCategory.toLowerCase()) {
          categoryExistsInObjects = true;
          break;
        }
      }
    }

    console.log(
      "Category Exists in Detected Objects:",
      categoryExistsInObjects
    );

    let secondaryMatchedCategory;
    if (!categoryExistsInObjects) {
      // Use OCR title as a backup
      secondaryMatchedCategory = await compareTitleToAllItems(productTitle);
      console.log(
        "Backup Matched Category from OCR title:",
        secondaryMatchedCategory
      );
    }

    if (matchedCategory && categoryExistsInObjects) {
      const object = objects.find(
        (obj) => obj.name.toLowerCase() === matchedCategory.toLowerCase()
      );

      croppedImageUrl = await cropImageForCategory(
        imageBuffer,
        objects,
        matchedCategory
      );

      if (object) {
        const vertices = object.boundingPoly.normalizedVertices;
        const x1 = vertices[0].x;
        const y1 = vertices[0].y;
        const x2 = vertices[2].x;
        const y2 = vertices[2].y;

        const croppedBuffer = await cropImage(imageBuffer, x1, y1, x2, y2);

        // Upload the cropped image to Supabase
        const croppedFileName = `public/${Date.now()}.png`;
        croppedImageUrl = await uploadToSupabase(
          croppedBuffer,
          croppedFileName
        );
        console.log("Cropped image URL:", croppedImageUrl);
      }
    } else if (secondaryMatchedCategory) {
      // Add this condition
      const croppedFileName = `public/${Date.now()}.png`;
      croppedImageUrl = await cropImageForCategory(
        imageBuffer,
        objects,
        secondaryMatchedCategory
      );
      console.log("Secondary cropped image URL:", croppedImageUrl);
    } else {
      croppedImageUrl = null; // Assign null when neither condition is met
    }

    const question = "Is this a shopping webpage where I can buy clothing?";
    const answer = await askQuestionAboutImage(imageUrl, question);
    const isShoppingWebpage = answer.includes("yes");
    console.log("This is a shopping page?:", isShoppingWebpage);

    if (croppedImageUrl) {
      const croppedItemsArray = await getItems(croppedImageUrl);
      itemsArray.push(...croppedItemsArray); // Combine the results
    }

    console.log(
      "Category Exists in Detected Objects (before response):",
      categoryExistsInObjects
    );

    res.json({
      success: true,
      imageUrl:
        categoryExistsInObjects && croppedImageUrl ? croppedImageUrl : imageUrl,
      objects,
      productTitle,
      itemsArray: itemsArray,
      isShoppingWebpage,
      matchedCategory,
      categoryExistsInObjects,
      croppedImageUrl,
    });

    console.log("Items Array sent in response:", itemsArray);
  } catch (error) {
    console.error("Error uploading image to Supabase:", error);
    res.status(500).json({ success: false, error: "Image upload failed" });
  }
});
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter