web-dev-qa-db-ja.com

どのWebブラウザーでPuppeteerコードを実行するのですか？

PuppeteerでWebスクレイピングを実行しようとしていますが、構築しているWebサイトに値を取得する必要があります。

PuppeteerファイルをJavaScriptファイルのようにhtmlファイルにロードしようとしましたが、エラーが発生し続けます。ただし、コマンドウィンドウで実行すると、問題なく動作します。

Scraper.js：

getPrice();
function getPrice() {
    const puppeteer = require('puppeteer');
    void (async () => {
        try {
            const browser = await puppeteer.launch()
            const page = await browser.newPage()              
            await page.goto('http://example.com') 
            await page.setViewport({ width: 1920, height: 938 })        
            await page.waitForSelector('.m-hotel-info > .l-container > .l-header-section > .l-m-col-2 > .m-button')
            await page.click('.m-hotel-info > .l-container > .l-header-section > .l-m-col-2 > .m-button')
            await page.waitForSelector('.modal-content')
            await page.click('.tile-hsearch-hws > .m-search-tabs > #edit-search-panel > .l-em-reset > .m-field-wrap > .l-xs-col-4 > .analytics-click')
            await page.waitForNavigation();
            await page.waitForSelector('.tile-search-filter > .l-display-none')
            const innerText = await page.evaluate(() => document.querySelector('.tile-search-filter > .l-display-none').innerText);
            console.log(innerText)
        } catch (error) {
            console.log(error)
        }

    })()
}

index.html：

<html>
  <head></head>
  <body>
    <script src="../js/scraper.js" type="text/javascript"></script>
  </body>
</html>

予想される結果は、Chromeのコンソールで次のようになります。

しかし、代わりにこのエラーが発生します。

何か案は？

前もって感謝します！

javascriptnode.jsweb-scrapingpuppeteer
3
Adrian2895

ブラウザで動作します。パッケージはpuppeteer-webと呼ばれ、そのような場合のために特別に作成されています。

ただし、重要な点は、chromeのインスタンスがいくつかのサーバーで実行されている必要があります。そうしないと接続できません。

Browserifyを使用してPuppeteerをバンドルするには：

Puppeteerリポジトリのクローン：

git clone https://github.com/GoogleChrome/puppeteer && cd puppeteer
npm install
npm run bundle

これにより、Puppeteerバンドルを含む./utils/browser/puppeteer-web.jsファイルが作成されます。

後でWebページで使用して、そのWSエンドポイントを介して別のブラウザーインスタンスを駆動できます。

<script src='./puppeteer-web.js'></script>
<script>
  const puppeteer = require('puppeteer');
  const browser = await puppeteer.connect({
    browserWSEndpoint: '<another-browser-ws-endpont>'
  });
  // ... drive automation ...
</script>

人形遣いとウェブパックを楽しんだ

サーバーの作成などの詳細については、これらの回答を参照してください。

6
Md. Abu Taher