Puppeteer โดยไม่ต้องมี Desktop UI

น้อง Manatsawin Hanmongkolchai มาบอกว่าที่ใช้อยู่เหมือนลง Dependency ให้ครบก็ใช้งานได้เหมือนกันตามนี้ https://github.com/GoogleChrome/puppeteer/blob/master/docs/troubleshooting.md นั้น อันนี้ถือว่าเป็นอีกวิธีนึงแล้วกันครับ

จาก Blog เก่า เรื่อง Pupeteer ปัญหาหลักๆเลยที่เราจะต้องเจอคือ Pupeteer ต้องไปรัน Chrome จริงๆ ซึ่งปัญหาที่ตามามาคือ Chrome ต้องใช้ OS ที่มี UI ถึงจะรันได้ อาจจะเป็น Window หรือ Ubuntu ที่มี Desktop ซึ่งในเคสของผม ใช้ Window อยู่ คราวนี้ Google Cloud compute engine ที่เป็น window อยู่ มีราคาแพง ซึ่งถ้าเรารัน Pupeteer บนเครื่อง ที่เป็น centos หรือ linux ที่ไม่มี UI ก็จะขึ้น Error แบบนี้

ครั้นจะเปิดเครื่องใหม่เป็น Ubuntu เครื่องเก่าที่มีอยู่ก็น่าจะพอและไม่อยากเปลืองกว่าเดิม ก็เลยต้องหาทาง ลด cost ลง ผมก็เลยนั่งคิดว่า Docker จะช่วยได้มั้ย เพราะว่าเราน่าจะ สั่งลง UI ของ linux ใน Docker ได้เหมือนกัน

ก็เลยลองไปไล่หาดูว่า Puppeteer สามารถใช้ chrome ผ่าน WS ได้มั้ย ซึ่งคำตอบคือ “ได้” เพียงแค่เปลี่ยนคำสั่ง launch() เป็น connect เท่านั้นเอง หลังจากนั้นก็ทำ Chrome headless ให้เป็น Docker ซึ่งโชคดีมากๆเพราะว่า มีหลายคนทำไว้แล้ว อย่างเช่นคนนี้

https://github.com/yukinying/chrome-headless-browser-docker

พอเรา start docker ด้วยคำสั่ง นี้ เราก็จะได้ WS ของ Chrome ที่รันอยู่ใน docker มา

docker run -d — name chrome — shm-size=1024m -p=127.0.0.1:9222:9222 — cap-add=SYS_ADMIN -d yukinying/chrome-headless-browser

จาก Dockerfile เค้าจะเลือกใช้ Chrome Stable ตลอดเวลา ถ้าใครอยากได้ Dev หรือ Beta verstion ก็ลองไป Fork Repo เค้ามาแก้ได้ครับ ตัว Dockerfile อยู่ที่ https://github.com/yukinying/chrome-headless-browser-docker/blob/master/chrome/Dockerfile

คราวนี้เราเราก็มาแก้ code ของเราจาก

puppeteer.launch() 

เป็น

puppeteer.connect({browserWSEndpoint:'ws://0.0.0.0:9222/devtools/browser/xxxxx–xxxx-xxxxx-xxxx-xxxxx'})

แค่นี้ก็ใช้งานได้เลยไม่ต้องแก้อะไรเพิ่ม

จากที่ผมได้ลองเทสบน CentOS 7 ให้ลอง Capture หน้าเว็บ CanIuse มา ก็ได้ผลลัพธ์แบบนี้ซึ่งดูปกติมากๆ อาจจะดูแปลกๆหน่อยที่ font แต่อันนี้ก็อยู่ที่ OS ว่าใช้ font อะไร