本文要解决的是如何用 Puppeteer 处理下载文件，无论是点击链接产生的文件下载，或者是点击按钮触发的文件下载。以及如何对文件进行后续处理。

使 Chromium 自动下载文件，将会碰到下面几个问题：

• 指定文件下载路径
• 下载结束的事件
• 检查下载文件是否存在

下面逐一解释。

指定路径

Chrome 有自动下载的目录，一般在设置页面里有选项，在下载开始时刻弹出文件选择框，让用户选择下载路径。

在自动化运行时，显然不能在运行中等待用户输入地址，所以需要提前指定下载路径，具体写法是：

await page._client.send('Page.setDownloadBehavior', {
    behavior: 'allow', 
    downloadPath: 'path/to/download'
})

将这条语句放置在下载活动之前，就能指定自动下载路径。截止目前，这是 Puppeteer 的一项试验功能，并没有正式推出。

开始下载文件

触发下载文件，根据具体的应用决定，可能是：

• 点击一个链接
• 点击一个按钮
• 页面自动下载

并没有什么本质区别

下载结束的事件

截止目前，Puppeteer并没有提供下载结束的事件。根据具体的情形，可以等待某个响应的结束(似乎并不很有用)：

await page.waitForResponse(res => {
  return res.request().url().includes('some/api') &&
  res.ok()
})

或者在等待一定时间后，直接检查文件系统里是否存在目标文件。

检查下载的文件

虽然没有下载结束的事件，有一个退而求其次的方法，就是等待一段时间后，去检查下载的文件是否存在于指定路径中。但是这种方法必须首先知道下载的文件名称。

function waitForFile(fileName){
  return new Promise(function(resolve, reject){
    let timeout = 10000
    let timer = setTimeout(function() {
      fs.access(fileName, fs.constants.R_OK, (err)=>{
        if(!err){
          resolve(`文件 ${fileName} 已出现.`)
        }else{
          reject(new Error(`文件 ${fileName} 未找到.`))
        }
      })                
    }, timeout)

    fs.access(fileName, fs.constants.R_OK, (err)=>{
      if(!err){
        clearTimeout(timer)
        resolve(`文件 ${fileName} 已存在.`)
      }
    })
  })
}

上面这段代码首先设置了10秒最大等待时间，即在第10秒钟时，尝试访问指定文件，如果存在，则 resolve 一条成功的消息。然后立即尝试访问文件，如果文件已经存在，就直接 resolve，而没有必要傻等。

完整的代码

将上述的几条代码片段结合起来，大概是这样的：

//设置下载路径
await page._client.send('Page.setDownloadBehavior', {
    behavior: 'allow', 
    downloadPath: 'path/to/download'
})

// 点击按钮触发下载
await (await page.waitForSelector('#someButton')).click();

// 等待文件出现
await waitForFile('path/to/download/filename');

更新

上节：检查下载的文件 等待文件出现还有另外一种实现方法：使用 fs.watch(filename, listener) ，自带的 监测文件变动的函数.

这个函数返回一个 watcher 对象，我们可以在监测到文件出现（发生"rename"事件）后，就将 watcher 关闭，避免无休止的等待：

function waitForFile(path){
    return new Promise(function(resolve, reject){
        const watcher = fs.watch(path, function(event, fileName){
            if(event === "rename") {
                watcher.close();
                resolve(`文件 ${fileName} 已出现.`);
            }
        });
    })
}

(完)

各位读后有什么想法，请在下方留言吧！如果对本文有疑问或者寻求合作，欢迎 联系邮箱 。邮箱已到剪贴板

精彩评论