Слом амазонки с кукловодом

Question

В настоящее время я работаю над некоторыми личными проектами, и мне просто пришла в голову идея сделать слом амазонки, чтобы я мог получить информацию о продуктах, такую ​​как название и цена.

Я обнаружил, что наиболее последовательным представлением, в котором использовались одинаковые идентификаторы для названия продукта и цены, было мобильное представление, поэтому я его и использую.

Проблема в том, что я не могуполучить цену.

Я сделал точно такой же селектор запросов для имени (который работает) в цене, но безуспешно.

const puppeteer = require('puppeteer');

const url = 'https://www.amazon.com/dp/B01MUAGZ49';

(async () => {
  const browser = await puppeteer.launch({ headless: true });
  const page = await browser.newPage();
  await page.setViewport({ width: 360, height: 640 });
  await page.goto(url);

  let producData = await page.evaluate(() => {
    let productDetails = [];

    let elements = document.querySelectorAll('#a-page');

    elements.forEach(element => {
      let detailsJson = {};

      try {
        detailsJson.name = element.querySelector('h1#title').innerText;
        detailsJson.price = element.querySelector('#newBuyBoxPrice').innerText;
      } catch (exception) {}

      productDetails.push(detailsJson);
    });

    return productDetails;
  });

  console.dir(producData);
})();

Я должен получить имя ицена в console.dir но сейчас я получаю только

[ { name: 'Nintendo Switch – Neon Red and Neon Blue Joy-Con ' } ]

Answer 1

Просто установить высоту и вес области просмотра недостаточно для полной имитации мобильного браузера.Прямо сейчас на странице предполагается, что у вас просто очень маленькое окно браузера.

Самый простой способ симуляции мобильного устройства - использовать функцию page.emulate и значение по умолчанию DeviceDesriptors , которые содержат информацию о большом количестве мобильных устройств.

Цитата из документации для page.emulate:

Эмулирует данные метрики устройстваи пользовательский агент.Этот метод является ярлыком для вызова двух методов:

• page.setUserAgent (userAgent)
• page.setViewport (viewport)

Чтобы помочь эмуляции, кукловод предоставляет список дескрипторов устройства, которые можно получить с помощью команды require('puppeteer/DeviceDescriptors').[...]

---

Пример

Вот пример того, как имитировать iPhone при посещении страницы.

const puppeteer = require('puppeteer');
const devices = require('puppeteer/DeviceDescriptors');
const iPhone = devices['iPhone 6'];

const url = '...';

(async () => {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.emulate(iPhone);
  await page.goto(url);

  // Simlified page.evaluate
  let producData = await page.evaluate(() => ({
    name: document.querySelector('#a-page h1#title').innerText,
    price: document.querySelector('#a-page #newBuyBoxPrice').innerText
  }));

  console.dir(producData);
})();

Я также немного упростил ваш page.evaluate, но вы, конечно, можете также использовать свой оригинальный код после page.goto.Это вернуло мне название и цену продукта.