This content got low rating by people.
1. puppeteer 란 ?
인형(puppet)을 부리는[조종하는] 사람 입니다. 인형술사라 할 수 있겠죠. 실제로는 chrome 을 통해 다양한 작업을 할 수 있도록 도와주는데 해당 기능은 아래와 같습니다.
- 페이지의 스크린 샷 / PDF를 생성
- SPA (Single-Page Application)를 크롤링
- 렌더링 된 컨텐츠 (예 : "SSR"(Server-Side Rendering))를 처리 할 수 있음.
- UI 테스트, 키보드 입력 등을 자동화
- 최신 자동 테스트 환경을 구축
2. 시작하기
2.1. 설치 - 브라우져 포함
- 최초 설치 시 chromium 또한 다운로드 하기 땜시 ( 약 200~300MB ) 시간이 좀 걸리긴 함.
- nodejs 버전은 10.12 이상 설치되어 있어야 됨. ( 최신버전 v14.3.0 )
- nvm 을 통해 nodejs 설치하여 버전 관리하는 것을 추천
npm i puppeteer
2.2. 설치 - 브라우져 제외
크로미엄(크롬) 브라우저를 설치 하지 않습니다. 설정을 통해 기존에 설치된 다른 브라우저를 사용할 수 있습니다. (귀차니즘이 있으니 PASS) 2.1. 방식으로 우선 설치 -_-/
npm i puppeteer-core
# or "yarn add puppeteer-core"
3. 예제
아래 코드를 실행하면 브라우저를 띄운후 ( headless 라 화면 상에는 보여지지 않음 ) example.com 페이지로 이동 후 스샷을 찍고 브라우져를 종료 합니다. 결과물로는 example.png 파일을 만들고여. 약 7초만에 모든 작업이 이뤄지는데 정말 간편하고 좋습니다 !
const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto('https://example.com');
await page.screenshot({path: 'example.png'});
await browser.close();
})();
맺음말
위에서 소개한 기능 이외에도 활용하기에 따라 정말 무궁무진한 작업을 자동화 할 수 있습니다. 스샷도 찍고 PDF도 만들고 정보를 Crawling(크롤링) 해서 다양한 정보를 수집후 재조합하여 파일로 저장할 수도 있습니다. 기존에 셀레니움 / 뷰티풀 스프 같은걸 통해서 작업 하기도 했는데 써보니 퍼피터가 더 좋아 보이기도 하네요 :)
나중에 주식정보 및 공시 정보 / 관련기사 같은걸 캡춰 및 크롤링하고 조회 할 수 있는 페이지를 만들어도 좋을거 같다 생각하네요 ㅎㅎ