Как добавить очищенные данные с Puppetteer в HTML - PullRequest
0 голосов
/ 08 января 2019

ADVISORY: я впервые пробую свои силы в этом.

Я создал html-страницу, которая отображает время шины. Чтобы узнать время в автобусе, мне пришлось почесать местный автобусный сайт с кукольником. Я правильно трачу время на следующую шину, но не могу добавить его на свою HTML-страницу.

Я попытался добавить теги сценария с помощью src, указывающего на мой файл js. Я попытался добавить их в заголовок, в div, который должен отображать время и прямо перед закрывающим тегом body, но я не смог отобразить время. Я попытался добавить js из тега сценария в html, но это не сработало.

//Here's code for scraping in busTimeScraper.js :
  let scrape = async() => {
  const browser = await puppeteer.launch({
    headless: true
  });
  const page = await browser.newPage();
  await page.goto('bustimes.com');    //Dummy website for this eg
  await page.setViewport({width: 1500, height: 1500})
  await page.waitFor(5000);

  const result = await page.evaluate(() => {
     let time = document.querySelector('#RouteTimetable').innerText;
     return {
        time
     }
 });

 browser.close();
 return result;

 };

 scrape().then((value) => {
    var timing = value.time;
    document.querySelector('#Time').innerText=timing;
 });

//The html is :
 <div id="Time">
  <!--<script type="text/javascript" src="busTimeScraper.js">
          </script>-->
 </div>

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

1 Ответ

0 голосов
/ 12 января 2019

Вы просто не можете добавить свой JS на стороне сервера в html на стороне клиента, используя тег script, и ожидать, что он будет работать, независимо от того, где вы добавляете (в голове, внутри элемента или перед закрытием тела);

Самым простым решением было бы предоставить результат (временную переменную) VIA NodeJsAPI и использовать API VIA вашего JS на стороне клиента, чтобы получить значение и выполнить все остальное на стороне клиента.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...