如何在Electron窗口中使用Puppeteer抓取网页并避免单独启动浏览器？

方案1：直接基于Electron原生API实现抓取（无需依赖Puppeteer） #

利用Electron内置的BrowserWindow创建隐藏窗口，结合webContents和session API完成页面操作与Excel下载，完全避免额外浏览器进程。

实现步骤 #

• 配置下载行为：提前设置默认会话的下载路径，禁用下载弹窗
• 创建隐藏抓取窗口：设置show: false避免窗口显示
• 页面操控与数据抓取：通过executeJavaScript执行页面脚本获取数据，触发下载操作

const { BrowserWindow, session } = require('electron');
const path = require('path');

// 配置全局下载路径与行为
session.defaultSession.setDownloadPath(path.join(__dirname, '../downloads'));
session.defaultSession.on('will-download', (event, item) => {
  // 取消系统默认下载弹窗
  event.preventDefault();
  // 指定保存路径（可自定义）
  item.setSavePath(path.join(__dirname, '../downloads', item.getFilename()));
  // 监听下载完成事件，后续可处理Excel文件
  item.on('done', (_, state) => {
    if (state === 'completed') {
      console.log('Excel下载完成:', item.getFilename());
      // 此处可添加Excel解析、数据整合逻辑
    }
  });
});

// 创建隐藏的抓取窗口（生产环境建议关闭nodeIntegration，使用preload脚本通信）
const scrapeWindow = new BrowserWindow({
  show: false,
  skipTaskbar: true,
  webPreferences: {
    nodeIntegration: false,
    contextIsolation: true,
    preload: path.join(__dirname, 'preload.js')
  }
});

// 加载目标页面并执行抓取
scrapeWindow.loadURL('https://your-target-site.com');
scrapeWindow.webContents.on('did-finish-load', async () => {
  // 执行页面脚本抓取数据
  const pageData = await scrapeWindow.webContents.executeJavaScript(`
    // 替换为你的实际DOM抓取逻辑
    Array.from(document.querySelectorAll('.data-item')).map(item => item.textContent);
  `);

  // 触发Excel下载（模拟点击下载按钮）
  await scrapeWindow.webContents.executeJavaScript(`
    document.querySelector('#excel-download-btn').click();
  `);

  // 抓取完成后可关闭窗口（按需操作）
  // scrapeWindow.close();
});

方案2：用Puppeteer-Core连接Electron内置Chromium #

若习惯使用Puppeteer API，可通过调试端口将Puppeteer-Core连接到Electron的Chromium实例，复用内置浏览器进程。

实现步骤 #

• 安装依赖：确保Puppeteer-Core版本与Electron内置Chromium版本兼容
• 开启调试端口：启动Electron时添加--remote-debugging-port参数
• 连接实例并操作：用Puppeteer-Core连接到调试端口，执行抓取与下载

# 安装依赖（注意匹配版本，可通过electron-chromium-version查询对应Chromium版本）
npm install puppeteer-core electron

const { app, BrowserWindow } = require('electron');
const puppeteer = require('puppeteer-core');
const path = require('path');

app.whenReady().then(async () => {
  // 开启远程调试端口
  const debugPort = 9222;
  app.commandLine.appendSwitch('--remote-debugging-port', debugPort);

  // 创建隐藏窗口
  const mainWindow = new BrowserWindow({ show: false });

  // 连接到Electron的Chromium实例
  const browser = await puppeteer.connect({
    browserURL: `http://localhost:${debugPort}`,
    defaultViewport: null
  });

  // 获取或新建页面
  const pages = await browser.pages();
  const page = pages[0] || await browser.newPage();

  // 配置下载行为
  await page.setDownloadBehavior({
    behavior: 'allow',
    downloadPath: path.join(__dirname, '../downloads')
  });

  // 页面抓取逻辑
  await page.goto('https://your-target-site.com');
  const scrapedData = await page.evaluate(() => {
    // 替换为你的抓取逻辑
    return document.querySelector('.content').innerText;
  });

  // 触发下载
  await page.click('#download-excel');

  // 操作完成后断开连接
  await browser.disconnect();
});

常见问题排查 #

• 版本兼容问题：Puppeteer-Core版本必须与Electron内置Chromium版本匹配，否则连接失败
• 窗口显示问题：确保show: false与skipTaskbar: true同时设置，避免窗口意外弹出
• 下载弹窗未禁用：需在窗口创建前配置session的下载行为，否则系统默认弹窗无法取消
• 跨域限制：开发环境可临时设置webSecurity: false，生产环境建议通过preload脚本规避

内容的提问来源于stack exchange，提问作者Josh