자세히보기

IT/Programming

[Node.js] Puppeteer 퍼피티어 라이브러리

COMDORI 2022. 12. 21. 13:00
728x90
반응형

Node.JS Puppeteer 퍼피티어 라이브러리 및 패키지란?

- Headless Browser(헤드레스 브라우저)를 이용한 웹 크롤링(Crawling) 및 웹 스크래핑(Scraping)
- puppetter 퍼피티어는 dev tools 프로토콜을 통해 크롬을 제어할 수 있는 하이레벨 API를 제공하는 라이브러리
- selenium(셀레니움)보다 더 상세한 조작 및 성능 측정 등이 가능
- 페이지 스크린샷 또는 PDF 생성 가능
- SPA(Single-Page Application)를 크롤링하여 미리 렌더링 된 콘텐츠(즉, "SSR"(Server-Side Rendering) 양식 제출, UI 테스트, 키보드 입력 등을 자동화
- 크롬 확장 플러그인 테스트

 

설치방법

터미널에서 아래의 명령어 입력

npm i puppeteer

 


코드 핵심

  • 첫번째 탭에서 모든 동작이 작동
  • 자동으로 버튼을 클릭
  • puppeteer 네이버 자동 로그인
  • 네이버 아이디와 네이버 비밀번호를 시간 차이를 두고 자동 입력
  • 퍼피티어 기본 제공 함수 테스트 

예시 코드

★ 소스를 복사하려면 소스코드 오른쪽 상단 "Copy"버튼을 클릭하세요  

 

const puppeteer = require('puppeteer');

(async () => {
    const browser = await puppeteer.launch({
        headless:false, // 브라우저 실행 여부
        executablePath: '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome' // macOS 크롬 브라우저 경로

    }); // puppeteer 시작
    // const pages = await browser.newPage() // 새로운 탭 생성
    // const pages = await browser.pages()
    const page = (await browser.pages())[0];// 첫 번째 탭
    try{
        await page.goto('https://naver.com'); // 해당 페이지로 이동
    }catch (e) {
        const errorMsg = '오류 발생! \n 홈 페이지에 연결할 수 없습니다. 다시 확인 해주세요.'
        throw Error('브라우저를 실행할 수 없습니다: ' + e);
        console.log(errorMsg, e);
    }

    await page.bringToFront(); // 탭 전환
    await page.setViewport({ // 화면 크기 설정
        width: 1280, height: 1024
    });
    //await page.waitForNavigation();
    try {
        await page.click("#account > a"); // 클릭 이벤트
    } catch (e) {
        let errorMsg = '오류 발생! \n 클릭할 수 없습니다.'
        console.log(errorMsg, e);
    }
    try {// 네이버 자동 로그인
        await page.waitForTimeout(1000); // 네이버 아이디 입력전 대기
        // await page.$x("/html/body/div[1]/div[2]/div/div[1]/form/ul/li/div/div[1]/div[1]/input"); // XPath
        await page.type("#id", "test");// 네이버 아이디
        await page.waitForTimeout(1000);// 네이버 비밀번호 입력전 대기
        // await page.$x("/html/body/div[1]/div[2]/div/div[1]/form/ul/li/div/div[1]/div[2]/input");
        await page.type("#pw", "tt");// 네이버 비밀번호
    } catch (e) {
        let errorMsg = '오류 발생! \n 입력불가!'
        console.log(errorMsg, e);
    }
    await page.goto("https://google.com"); // 페이지 이동
    await page.goBack(); // 이전 페이지 이동
    await page.reload(); // 새로고침
    await page.goForward(); // 다음 페이지 이동


    await page.screenshot({ // 스크린샷
        path: 'Screenshot/1.png', fullPage:false
    });
    await browser.close();  // 브라우저 종료
})();

 

실행결과

실행 결과

 

◈ 소스코드를 보시고 고칠 부분이나 더 좋은 로직이 있다면 댓글 부탁드립니다! 

 

node.js nodejs 자바스크립트 노드제이


봐주셔서 감사합니다.

본 게시글이 도움되셨으면 광고, 공감 ♡ 클릭 부탁드립니다! 
#컴돌이블로그 #컴돌이 #COMDORI

728x90
반응형