javascript 如何在任何网页浏览器中运行Puppeteer代码？

4ioopgfo 于 2023-01-04 发布在 Java

关注(0)|答案(3)|浏览(309)

我正试图做一些网页抓取与傀儡，我需要检索到一个网站的价值，我的建设。
我试着把 puppet 师文件当作JavaScript文件加载到html文件中，但是我一直收到错误。但是，如果我在cmd窗口中运行它，它会工作得很好。
百度搜索：

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)
        }

    })()
}

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

预期的结果应该是在Chrome的控制台中：

但我得到这个错误：

我哪里做错了？

JavaScript

来源：https://stackoverflow.com/questions/54647694/how-to-run-puppeteer-code-in-any-web-browser

3条答案

按热度按时间

eagi6jfj1#

编辑：自从puppeteer删除了对puppeteer-web的支持，我将其移出了回购协议，并尝试对其进行一些修补。

它确实可以与浏览器一起工作。这个软件包名为puppeteer-web，专门为这种情况而制作。
但最重要的是，必须有chrome的示例在某个服务器上运行，只有这样你才能连接到它。
您可以稍后在网页中使用它来通过其WS终结点驱动另一个浏览器示例：

<script src="https://unpkg.com/puppeteer-web">
</script>

<script>
  const browser = await puppeteer.connect({
    browserWSEndpoint: `ws://0.0.0.0:8080`, // <-- connect to a server running somewhere
    ignoreHTTPSErrors: true
  });

  const pagesCount = (await browser.pages()).length;
  const browserWSEndpoint = await browser.wsEndpoint();
  console.log({ browserWSEndpoint, pagesCount });
</script>

我和 puppet 师还有网络背包玩得很开心，

请参阅这些答案以全面了解创建服务器等内容，

赞(0）回复(0）举报 2023-01-04

8tntrjer2#

相反，如果您的主要目标是在前端进行Web抓取并获取数据，则可以在后端使用Puppeteer，并创建一个API来连接前端。

赞(0）回复(0）举报 2023-01-04

fhity93d3#

Puppeteer在服务器上的Node.js中运行。对于常见情况，与其使用puppeteer-web来允许客户端编写Puppeteer代码来控制浏览器，不如创建一个HTTP或WebSocket API，让客户端间接触发Puppeteer代码。
选择REST API而不是puppeteer-connect的原因：

更好地支持任意客户机代码基--不是用JS编写的客户机（例如桌面、命令行和移动的应用程序）可以像浏览器一样轻松地使用API
不依赖于傀儡连接
较低的客户端复杂性;对于许多用例来说，如果HTML表单就足够了，那么根本就不需要JS
更好地控制客户端行为--在服务器上运行浏览器是一个沉重的负担，并且具有易于利用的强大功能
更易于与其他后端代码和资源（如文件系统）集成
提供与现有API的无缝集成，就像另一组路由一样
将Puppeteer隐藏为实现细节可以让您在将来切换到Playwright，而不会影响客户端代码。

类似地，我们不是公开一个mock fs对象来读写服务器上的文件，而是公开REST API端点来完成这些任务，这是一个有用的抽象层。
由于Puppeteer在API（通常是Express）环境中有许多用例，因此很难提供一个通用示例，但您可以使用以下几个案例研究作为起点：

傀儡无法在Heroku上运行
Puppeteer不关闭浏览器
Puppeteer与Express Router NodeJS 的并行性。如何在保持并发的同时在路由之间传递页面

赞(0）回复(0）举报 2023-01-04

我来回答

javascript 如何在任何网页浏览器中运行Puppeteer代码？

3条答案

相关问题

热门标签

最新问答