извлечение данных из в puppeteer

#javascript #html #css #puppeteer

Вопрос:

Я хочу получить внутренний текст из тега HTML ul с помощью puppeteer. Это то, что я использовал для создания массива внутреннего текста, но получил ошибку.

   const li =  document.querySelector('#year-list-container > div > div.js-profile-timeline-year-list.color-bg-primary.js-sticky > ul').getElementsByTagName('li')
  array = []
  for (let i = 0; i <= li.length - 1; i  ) {
    array.push(li[i]);
  }
 

ошибка заключается в следующем

 (Use `node --trace-warnings ...` to show where the warning was created)
(node:15860) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). To terminate the node process on unhandled promise rejection, use the CLI flag `--unhandled-rejections=strict` (see https://nodejs.org/api/cli.html#cli_unhandled_rejections_mode). (rejection id: 1)
(node:15860) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the 
Node.js process with a non-zero exit code.
 

полный код, я ввел импортированного кукольника, так что это не ошибка

   const browser = await puppeteer.launch();
  const page = await browser.newPage();
  giturl  = ('https://github.com/siddhart1o1');
    await page.goto(giturl , {waitUntil: 'networkidle2'})

    let data =  await page.evaluate(()=>{
        let stars  = document.querySelector('#js-pjax-container > div.container-xl.px-3.px-md-4.px-lg-5 > div > div.flex-shrink-0.col-12.col-md-3.mb-4.mb-md-0 > div > div.js-profile-editable-replace > div.d-flex.flex-column > div.js-profile-editable-area.d-flex.flex-column.d-md-block > div.flex-order-1.flex-md-order-none.mt-2.mt-md-0 > div > a:nth-child(3) > span').innerText
        let followers = document.querySelector('#js-pjax-container > div.container-xl.px-3.px-md-4.px-lg-5 > div > div.flex-shrink-0.col-12.col-md-3.mb-4.mb-md-0 > div > div.js-profile-editable-replace > div.d-flex.flex-column > div.js-profile-editable-area.d-flex.flex-column.d-md-block > div.flex-order-1.flex-md-order-none.mt-2.mt-md-0 > div > a:nth-child(1) > span').innerText
        let following = document.querySelector('#js-pjax-container > div.container-xl.px-3.px-md-4.px-lg-5 > div > div.flex-shrink-0.col-12.col-md-3.mb-4.mb-md-0 > div > div.js-profile-editable-replace > div.d-flex.flex-column > div.js-profile-editable-area.d-flex.flex-column.d-md-block > div.flex-order-1.flex-md-order-none.mt-2.mt-md-0 > div > a:nth-child(2) > span').innerText
        let repos = document.querySelector('#js-pjax-container > div.container-xl.px-3.px-md-4.px-lg-5 > div > div.flex-shrink-0.col-12.col-md-9.mb-4.mb-md-0 > div.UnderlineNav.user-profile-nav.d-block.d-md-none.position-sticky.top-0.pl-3.ml-n3.mr-n3.pr-3.color-bg-primary > nav > a:nth-child(2) > span').innerText
        //this code is giving error
        let li = document.querySelector('div.js-profile-timeline-year-list.color-bg-primary.js-sticky > ul').getElementsByTagName('li')
        array = []
        for (let i = 0; i <= li.length - 1; i  ) {
          array.push(li[i]);
        }

        return{
            stars,
            followers,
            followinf,
            repos,
            array
        }


    })

    console.log(data)
  await browser.close();
})();

 

Комментарии:

1. Пожалуйста, добавьте больше кода. Используете ли вы этот фрагмент в основном Node.js контекст или в контексте браузера внутри страницы.оценить()?

2. Это i <= li.length совсем не похоже на правду

3. @всеможебуты да, это работает в браузере, но не работает на странице.оцените()

4. @AlonEitan что в этом плохого ?

5. Массивы начинаются с 0 , что <= означает, что вы пытаетесь получить доступ к неопределенному смещению. Это должно быть <

Ответ №1:

  1. У вас здесь опечатка:
         return{
            stars,
            followers,
            followinf, // Should be following 
            repos,
            array
        }
 
  1. К сожалению, page.evaluate() может передавать только сериализуемые значения (примерно те значения, которые может обрабатывать JSON). Поскольку getElementsByTagName() возвращает коллекцию элементов DOM, которые не являются сериализуемыми (они содержат методы и циклические ссылки), каждый элемент в коллекции заменяется пустым объектом. Вам нужно вернуть либо сериализуемое значение (например, массив текстов или href атрибутов), либо использовать что-то вроде page.$$(selector) and ElementHandle API. Так что попробуйте это:
   for (let i = 0; i <= li.length - 1; i  ) {
    array.push(li[i].innerText);
  }