如何使用Playwright实现浏览器多文件下载？

根据你的需求，以下两种常见场景的实现方式供你参考：

场景1：多个独立下载按钮，逐个下载 #

如果页面上存在多个带data-action='Master File'的下载按钮，需要逐个点击下载文件，可以通过遍历所有元素并依次处理下载事件：

// 获取所有下载按钮元素
const downloadButtons = page.locator("td[data-action='Master File']");
const buttonCount = await downloadButtons.count();

// 遍历每个按钮，逐个触发下载并保存
for (let i = 0; i < buttonCount; i++) {
  // 等待下载事件 + 点击当前按钮
  const [download] = await Promise.all([
    page.waitForEvent("download"),
    downloadButtons.nth(i).click({ force: true })
  ]);
  
  // 获取建议文件名并保存
  const fileName = download.suggestedFilename();
  await download.saveAs(fileName);
}

场景2：单次操作触发多文件下载 #

如果是点击某个元素后浏览器自动开始下载多个文件，需要批量等待所有下载事件完成：

// 预先指定要等待的下载数量，或者根据实际情况调整
const expectedDownloads = 3; // 替换为实际要下载的文件数量
const downloadPromises = [];

// 监听download事件，收集所有下载实例
page.on("download", (download) => {
  downloadPromises.push(download);
});

// 触发批量下载操作（替换为你的批量触发元素选择器）
await page.locator("td[data-action='Batch Download']").click({ force: true });

// 等待所有下载事件完成
await Promise.all(downloadPromises.map(d => d.finished()));

// 逐个保存下载的文件
for (const download of downloadPromises) {
  const fileName = download.suggestedFilename();
  await download.saveAs(fileName);
}

注意事项 #

• 确保浏览器下载路径权限正确，Playwright默认使用临时目录，saveAs方法可指定自定义存储路径。
• 如果存在文件名重复的情况，建议添加自定义后缀（比如循环索引）避免文件被覆盖。
• 部分网站会限制下载频率，必要时可在循环中添加page.waitForTimeout(1000)这类延迟操作。

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