Backend&Devops/Node.js

[Node.js] Selenium 크롤링 사용

기은P 2022. 7. 12. 17:12
반응형

1. 개요

프로젝트를 진행하다보니 실제 프로젝트에 사용할 데이터가 필요할 때가 있는데,

이 데이터를 얻기 위해 자연스럽게 인터넷의 정보를 쉽게 얻어 올 수 있기 위해 크롤링을 사용해야 했습니다.

 

 

 

2. 패키지

먼저 폴더를 하나 생성하고

npm init -y

로 node.js 기반 패키지를 생성해줍니다.

 

사용할 라이브러리는 selenium으로

npm install selenium-webdriver

위의 패키지를 설치해줍니다.

 

 

 

selenium 크롤링을 사용하기 위해서는 브라우저의 드라이버를 사용해야 합니다.

http://chromedriver.storage.googleapis.com/index.html

저는 크롬 드라이버를 사용했기 때문에, 위의 링크에서 최신 크롬 드라이버를 받아주면 됩니다.

 

다운 받은 드라이버는 프로젝트 폴더에 넣어줍니다.

 

 

 

 

3. 코드

index.js

const {Builder, By, Key, until} = require('selenium-webdriver');
const chrome = require('selenium-webdriver/chrome');    

const run = async () => {
	// headless로 크롬 드라이버 실행
    let driver = await new Builder()
    .forBrowser('chrome')    
    .setChromeOptions(new chrome.Options().headless().addArguments("--disable-gpu", "window-size=1920x1080",
    "lang=ko_KR"))
    .build();

    try {
        // 특정 URL 생성
        await driver.get('https://map.kakao.com/');
        let userAgent = await driver.executeScript("return navigator.userAgent;")
        console.log('[UserAgent]', userAgent);

        // By.id로 #query Element를 얻어온다.
        let searchInput = await driver.findElement(By.id('search.keyword.query'));
        // keyword를 선택하고 검색 버튼 사용
        let keyword = "닭발";
        searchInput.sendKeys(keyword, Key.ENTER);

        // css selector로 가져온 element가 위치할때까지 최대 10초간 기다린다.
        await driver.wait(until.elementLocated(By.id('info.search.place.list')), 10000);
        let resultElements  = await driver.findElements(By.className("placetit"));

        // 검색한 elements 하위의 value를 출력함
        console.log('[resultElements.length]', resultElements.length)
        for (var i = 0; i < resultElements.length; i++) {
            console.log('- ' + await resultElements[i].getCssValue())
        }
    }
    catch(e){
        console.log(e);
    }
    finally {
        driver.quit();
    }
}
run();

headless, 크롬 창이 팝업되지 않은 백그라운드에서 크롤링이 되는 옵션을 사용했는데,

동작하는 과정을 확인하고 싶다면 .setChromeOptions(...)을 지우시면 됩니다.

 

 

 

node index.js

node index.js를 입력해 실행하면 elementes의 결과물이 출력됩니다.

 

자세한 문법은 아래 링크를 참고하시면 됩니다.

https://www.selenium.dev/selenium/docs/api/javascript/module/selenium-webdriver/

 

selenium-webdriver

 

www.selenium.dev

 

반응형