กลับไปบล็อก

Headless Browser คืออะไร? วิธีรันงานอัตโนมัติด้วยโหมด headless

Headless Browser คือเบราว์เซอร์ที่ไม่มีส่วนติดต่อแบบกราฟิกและสามารถรันงานเว็บเบื้องหลังบนเซิร์ฟเวอร์ได้ บทความนี้อธิบายหลักการทำงาน การใช้ headless กับ Puppeteer, Playwright และ Selenium รวมถึงปัญหาที่พบบ่อยและแนวทางรับมือ

เมื่อเขียนสคริปต์เพื่อเก็บข้อมูลจำนวนมาก ทำการทดสอบแบบ end-to-end หรือให้เซิร์ฟเวอร์รันงานเว็บตามเวลา คุณมักจะได้ยินคำว่า “headless browser” แม้จะฟังดูเป็นเรื่องเฉพาะทาง แต่แนวคิดไม่ซับซ้อน: headless browser คือเบราว์เซอร์ที่ไม่มีส่วนติดต่อแบบกราฟิก ควบคุมด้วยโค้ด และทำงานบนเว็บอยู่เบื้องหลัง บทความนี้จะอธิบายว่ามันคืออะไร แตกต่างจากเบราว์เซอร์ทั่วไปอย่างไร มีเครื่องมือใดให้ใช้ และปัญหาที่พบบ่อยพร้อมแนวทางรับมือ

Headless Browser คืออะไรกันแน่?

Headless Browser ทำงานแทบเหมือน Chrome หรือ Edge ที่ใช้ทุกวัน สามารถโหลดหน้าเว็บ รัน JavaScript บันทึก Cookies อ่าน LocalStorage และรองรับความสามารถสมัยใหม่อย่าง Canvas และ WebGL ได้ตามปกติ ความแตกต่างหลักคือ ไม่เปิดหน้าต่างให้มองเห็น ทุกอย่างทำงานอยู่เบื้องหลัง และคุณควบคุมรวมถึงตรวจผลลัพธ์ผ่านโค้ดหรือ command line

อธิบายง่าย ๆ คือ เบราว์เซอร์ทั่วไปมี “สมอง” ที่ทำหน้าที่ render, execute และ interaction และมี “ใบหน้า” คือหน้าต่างที่มองเห็นได้ ส่วน headless browser ยังคงความสามารถของสมองทั้งหมด แต่ตัดหน้าต่างแสดงผลออก จึงเหมาะกับงานแบบไม่ต้องมีคนเฝ้า งานจำนวนมาก และการรันบนเซิร์ฟเวอร์

มีวิธีใช้งานแบบใดบ้างที่พบบ่อย?

ความสามารถแบบ headless มักมาจากตัวเบราว์เซอร์เองหรือไลบรารีของบุคคลที่สาม ตัวเลือกที่ใช้บ่อย ได้แก่:

  • พารามิเตอร์ในตัวของ Chrome/Chromium: ส่งพารามิเตอร์ --headless ตอนเริ่ม Chrome เพื่อให้ทำงานโดยไม่มี UI เหมาะกับ scraping แบบง่ายผ่าน command line และการจับภาพหน้าจอ
  • Puppeteer: ไลบรารียอดนิยมในระบบนิเวศ Node.js โดยปกติใช้ควบคุม Chromium และสามารถทำ clicks, typing, scrolling, screenshots และ export PDF แบบอัตโนมัติได้ มักใช้กับ frontend automation และการเก็บข้อมูล
  • Playwright: รองรับ Chromium, Firefox และ WebKit มีความสอดคล้องข้ามเบราว์เซอร์ดี และเป็นตัวเลือกที่ใช้กันมากสำหรับการทดสอบและ automation ของเว็บแอปสมัยใหม่
  • Selenium: framework สำหรับ automation ที่มีมายาวนาน ขับเบราว์เซอร์จริงผ่านโปรโตคอล WebDriver มี ecosystem ที่มีความสมบูรณ์และมี bindings สำหรับหลายภาษา เช่น Python, Java และ JS จึงใช้กันมากในทีมทดสอบ

การเลือกขึ้นอยู่กับ technology stack ที่คุ้นเคยและว่าต้องรองรับหลายเบราว์เซอร์หรือไม่ โครงการ Node มักเลือก Puppeteer หรือ Playwright งานทดสอบและโครงการหลายภาษามักเลือก Selenium ส่วน scraping แบบเบาอาจใช้พารามิเตอร์ Chrome โดยตรงก็เพียงพอ

เลือกเครื่องมือ headless browser ตามประเภทงานและเชื่อมงานที่ต้องล็อกอินเข้ากับ environment ที่เสถียร

ทำไมคนจึงใช้โหมด headless รันงาน?

ข้อดีที่เห็นได้ชัดที่สุดของโหมด headless คือ เหมาะกับการรันบนเซิร์ฟเวอร์และแบบ batch:

  • เซิร์ฟเวอร์หนึ่งเครื่องสามารถรันหลาย instances พร้อมกันได้โดยไม่ใช้ทรัพยากรของ desktop;
  • processes เบากว่าและโดยทั่วไปใช้ทรัพยากรน้อยกว่าเบราว์เซอร์ที่มีหน้าต่างแสดงผล;
  • มักใช้บนเซิร์ฟเวอร์ Linux หรือ Docker containers ที่ไม่มี desktop environment;
  • เมื่อใช้ร่วมกับ scheduled tasks สามารถทำ scraping, screenshots, regression tests และงานลักษณะเดียวกันโดยไม่ต้องมีคนเฝ้า

คุณสมบัติเหล่านี้ทำให้ headless browsers เป็น infrastructure ที่พบได้ทั่วไปในงานพัฒนา automation, workflow สำหรับ scraping และวิศวกรรมการทดสอบ

ปัญหาที่พบบ่อยที่สุดของ headless: มีลักษณะชัดเจนและอาจถูกจำกัดได้ง่าย

แม้ headless จะช่วยประหยัดทรัพยากร แต่ก็มีลักษณะบางอย่างที่อาจถูกตรวจพบได้ง่ายขึ้น ระบบ anti-bot และ risk-control จำนวนมากจะประเมินว่าการเข้าถึงดูน่าสงสัยหรือไม่ และ headless browser แบบล้วน ๆ อาจทิ้งร่องรอยในจุดต่อไปนี้:

  • ความแตกต่างของ rendering: ผลลัพธ์ Canvas หรือ WebGL ใน headless environment อาจต่างจากเบราว์เซอร์ทั่วไป;
  • ร่องรอยของโปรโตคอล: เส้นทาง debugging protocol บางแบบที่ automation ใช้อาจถูกตรวจพบ;
  • ข้อมูลไม่สอดคล้องกัน: User-Agent, รายการฟอนต์, Permissions API, hardware concurrency และสัญญาณอื่นอาจไม่ตรงกับ environment ของเบราว์เซอร์ทั่วไป;
  • ขาดกระบวนการใช้งานที่เป็นธรรมชาติ: สคริปต์อาจเปลี่ยนหน้าโดยตรงและคลิกเป็นจังหวะแบบเครื่องจักร ซึ่งต่างจากรูปแบบ interaction ของผู้ใช้จริง

สำหรับงานที่ต้องใช้ session เสถียรและรักษาสถานะการล็อกอิน การใช้ environment แบบ headless ล้วน ๆ อาจทำให้ล็อกอินยากหรือถูกขอ verification เพิ่มเติมบ่อยครั้ง นี่คือจุดที่ต้องชั่งน้ำหนักระหว่างการประหยัดทรัพยากรของ headless กับความสอดคล้องของ environment ที่ใกล้เคียงการใช้เบราว์เซอร์ปกติ

หากต้องการให้รันได้เสถียร ให้เริ่มจาก environment

หากสคริปต์ต้องจัดการเว็บไซต์ที่ต้องล็อกอินและต้องการ session ที่เสถียร การมุ่งแค่ “headless และประหยัดทรัพยากร” มักไม่พอ ควรให้สคริปต์รันใน browser environment ที่มีพารามิเตอร์สอดคล้องและ session เสถียร ด้วย วิธีที่ใช้กันทั่วไป ได้แก่:

  • สร้าง browser environment แยกสำหรับแต่ละงาน และตั้งค่า operating system, User-Agent, Cookie, ความละเอียด และพารามิเตอร์อื่นให้แต่ละรอบใช้ชุดค่าที่สอดคล้องกัน;
  • รักษา network egress ให้คงที่ เพื่อไม่ให้สคริปต์เดิมเปลี่ยนจุดออกบ่อยและกระตุ้น risk controls;
  • สำหรับงานที่ต้องรักษาสถานะล็อกอิน ให้ reuse Cookies และ local data ที่บันทึกไว้ เพื่อลดการล็อกอินซ้ำ;
  • รักษาจังหวะ interaction ของสคริปต์ให้สมเหตุสมผล และทำตามลำดับการใช้งานที่เป็นธรรมชาติแทนการกระโดดระหว่าง action แบบเครื่องจักร

เมื่อเตรียมส่วนเหล่านี้แล้ว สคริปต์ Puppeteer, Playwright หรือ Selenium สามารถเชื่อมต่อ environment เหล่านี้ผ่าน interface ได้ ทำให้ยังคงประสิทธิภาพของ headless พร้อมได้ session ที่เสถียรและใกล้เคียงเบราว์เซอร์ทั่วไปมากขึ้น สำหรับทีมที่ต้องการทั้ง background batch execution และ environment ที่นำกลับมาใช้ซ้ำได้ นี่เป็นกรณีใช้งานของ PurpleMark Local API: สามารถดูแล environment เหล่านี้จากศูนย์กลางใน PurpleMark workspace แล้วให้ automation scripts เริ่ม environment ตาม identifier ผ่าน Local API โดยแยก “environment configuration” ออกจาก “script execution” และเก็บพารามิเตอร์ของทั้ง script กับ environment ไว้ใน workspace เพื่อ reuse และทำงานร่วมกันในทีม

หมายเหตุ: ใช้ automation สำหรับการเก็บข้อมูลที่เป็นไปตามกฎ การทดสอบ และการดำเนินงานของธุรกิจตนเอง ปฏิบัติตาม terms of service และ robots rules ของเว็บไซต์เป้าหมาย และอย่าใช้เครื่องมือเพื่อหลบเลี่ยงการตรวจสอบความปลอดภัยของแพลตฟอร์มหรือสร้างบัญชีปลอมจำนวนมาก

โหมด headless เหมาะกับใคร?

Headless Browser ไม่ใช่คำตอบสำหรับทุกงาน การเลือกใช้ขึ้นอยู่กับลักษณะของงาน:

  • สคริปต์ web automation / scheduled tasks: เหมาะมากกับการเก็บข้อมูลสาธารณะจำนวนมากและติดตามการเปลี่ยนแปลงของหน้าเว็บตามเวลา;
  • End-to-end testing: วิศวกร frontend สามารถรัน regression tests ใน CI และตรวจสอบฟังก์ชันได้รวดเร็วในโหมด headless;
  • งานล็อกอินที่ต้องการ session เสถียร: การพึ่ง environment แบบ headless ล้วน ๆ อาจไม่เสถียร ควรรวม headless execution เข้ากับ browser environment ที่เสถียรแทนที่จะพึ่ง headless อย่างเดียว

หากเพียงเปิดดูหน้าเว็บด้วยตนเองเป็นครั้งคราว เบราว์เซอร์ทั่วไปจะง่ายกว่า Headless mode จะมีประโยชน์ชัดเจนเมื่อเว็บทาสก์ต้องรันระยะยาว เป็นจำนวนมาก หรือบนเซิร์ฟเวอร์

คำถามที่พบบ่อย

Headless Browser ต่างจากเบราว์เซอร์ทั่วไปหรือไม่? ความสามารถหลักด้าน rendering และ script execution เหมือนกัน ความต่างหลักคือไม่มีหน้าต่างให้เห็นและต้องควบคุมด้วยโค้ด ด้วยเหตุนี้ลักษณะของ automation จึงอาจชัดขึ้น และบางเว็บไซต์สามารถระบุการเข้าถึงที่ไม่ใช่มนุษย์ได้

จำเป็นต้องใช้ headless หรือไม่? ไม่จำเป็น หากแค่เปิดดูด้วยตนเองครั้งเดียว เบราว์เซอร์ทั่วไปก็เพียงพอ Headless mode มีข้อดีชัดเจนเมื่อจำเป็นต้องรันเว็บทาสก์จำนวนมาก แบบไม่ต้องมีคนเฝ้า หรือบนเซิร์ฟเวอร์

ถ้าสคริปต์ headless ล็อกอินยากควรทำอย่างไร? ตรวจสอบก่อนว่าปัญหาเกิดจาก behavior ของสคริปต์หรือ environment หาก environment ดู “เป็นเครื่องจักร” มากเกินไปหรือพารามิเตอร์ไม่สอดคล้อง ให้เชื่อมสคริปต์กับ browser environment ที่มีพารามิเตอร์สม่ำเสมอและ network egress เสถียร พร้อม reuse sessions และ Cookies ที่บันทึกไว้อย่างเหมาะสม

ควรเลือก Puppeteer หรือ Playwright? ทั้งสองเครื่องมือพัฒนาเต็มที่และใช้งานอย่างแพร่หลาย Puppeteer เน้น Chromium และเริ่มใช้งานง่าย ส่วน Playwright รองรับหลายเบราว์เซอร์และมีความสอดคล้องข้ามเบราว์เซอร์ดีกว่า เลือกตาม stack ของโครงการและความต้องการรองรับ browser engines หลายแบบ