Puppeteer 使用 FileChooser 無法上傳檔案 | 開發經驗分享

最近工作上接到新的任務是利用 Puppeteer 來自動化操作網頁，之前雖然有用過 Python 搭配 Selenium 的經驗，但 Puppeteer 是要用 Node.js 寫，完全沒寫過 Node.js 啊！！

今天想跟大家分享開發中遇到的小問題，是關於模擬點擊上傳照片，因為操作的網頁並沒有提供 API，故只好做個機器人來替代人工操作。

簡單介紹一下流程 ：

第一步是點擊「 上傳照片 」

接著會跳出此視窗，要再點擊「 選擇檔案 」

最後就會跳出檔案選擇器來上傳檔案

遇到的問題

針對此需求，Puppeteer 可以透過使用 FileChooser、uploadFile 這兩個 API 解決，不過很神奇的是，當我實作時卻完全無法使用，會在使用 waitForFileChooser 時 timeout。

試了很多方法，後來還去查了是不是可以用拖拉檔案 ( drag and drop )、或是跳出檔案選擇器時，模擬鍵盤點選 "\"，會彈出 「 前往資料夾 」，再想辦法輸入檔案路徑，雖然沒有成功就是了。

如何解決

後來找到這個 issue，五天前有人猜想是不是 Chromium 版本是 80 + 時，waitForFileChooser 會失效。

我查了一下我的 Puppeteer 版本是 2.0.0，當使用 npm install 後會自動下載 Chromium，目前版本確實是 80，我嘗試將版本改為 1.9.0，重新執行後發現可以使用了。看其來確實是在新版時 waitForFileChooser 會失效。

---

如果喜歡我的文章，想隨時收到最新行銷、技術分享，歡迎按 fb 粉專讚
  或加入 LINE 官方帳號，接收最新文章通知