DEV Community

artydev
artydev

Posted on

Scrapping Prices from Amazon with Napkin.io for free...

First of all, what is Napkin ?

Image description

Here is the function I created in Napkin in order to query Amazon. With that in place we can avoid the majorities of CORS problems.

Notice that, in the following script, the requests can only be originated from "flems.io".

/**
* @param {NapkinRequest} req
* @param {NapkinResponse} res
*/

const Origin = 'https://r.flems.io'

const axios = require("axios")

async function fetchData(url) {
  const resp = await axios.get(url)
  const data = await resp.data
  return data;
}

export default async (req, res) => {
  if (req.headers.Origin != Origin) {
    res.json({
      "error": req.headers.Origin != Origin && "NOT ALLOWED"
    })
  }

  else {
    var info = await fetchData(req.query.url)
    res.json({
      "message": info,
    })
  }
}
Enter fullscreen mode Exit fullscreen mode

So we will need to enter the ASIN of the product :

Image description

Here is the code I use, you will have to adapt it for your needs.
It's just a proof of concept.

const url = (ref) =>
  `https://salve-didio.npkn.net/cross/?url=https://www.amazon.com.be/dp/${ref}`

const parser = new DOMParser()

const rgpd = "#sp-cc";
const bybox = "#buybox";
const whole_price = ".a-price-whole";
const price_fraction = ".a-price-fraction";
const price_symbol = ".a-price-symbol";
const product_title = "#productTitle";
const btn_display_page = document.getElementById("display_page")
const loader = document.getElementById("loader");

function fetch_data(ref) {
  fetch(url(ref))
    .then(response => response.json())
    .then(m => show_data(m.message))
}

// if any
function hide_rgpd(doc) {
  const _rgpd = doc.querySelector(rgpd)
  _rgpd.style.display = "none"
}

function get_price(doc) {
  const bb = doc.querySelector(bybox);
  const price = bb.querySelector(whole_price)
  const price_frac = bb.querySelector(price_fraction)
  const price_symb = bb.querySelector(price_symbol);
  const title = doc.querySelector(product_title)
  const price_text = `
    <h2>${title.innerText}</h2>
    <span class="pricetext">price : ${price.innerText}${price_frac.innerText}${price_symb.innerText}</span>`
  result.innerHTML = price_text
}

function show_page(doc) {
  target.style.display = "block"
  target.srcdoc = doc.innerHTML
}

function show_data(page) {
  const _doc = parser.parseFromString(page, 'text/html')
  const doc = _doc.documentElement
  hide_rgpd(doc)
  get_price(doc)
  btn_display_page.style.display = "block"
  loader.style.display = "none";
  btn_display_page.onclick = () => show_page(doc)
}


function init_page() {
  display_page.style.display = "none"
  target.style.display = "none";
  result.innerText = "";
  loader.style.display = "block";
}

function fetch_price() {
  init_page();
  fetch_data(dp.value || "B08GYSTR27")
}
Enter fullscreen mode Exit fullscreen mode

You can play with it here DEMO

Top comments (0)