マイクロソフトのPlaywrightを使用したWebブラウザ自動化

Microsoft Playwright를 사용하여 웹 브라우저를 자동화하는 방법에 대한 안내입니다. Playwright 설치, 브라우저 열기, 네이버 뉴스 크롤링 등을 살펴봅니다.

4,656
マイクロソフトのPlaywrightを使用したWebブラウザ自動化

0. Playwrightとは?

Playwrightは、Microsoftが開発したオープンソースライブラリで、ウェブブラウザを自動化するためのものです。

元々ウェブスクレイピングを目的として設計されたものではありませんが、ブラウザと設定を適切に組み合わせることでこの領域で優れたパフォーマンスを発揮します。

Node.jsやPythonなどさまざまな言語で使用でき、現在はChrome、Firefox、WebKit(モバイルSafari)、Electronなどさまざまなブラウザをサポートしています。

この投稿ではPythonを使用します。


1. Playwrightのインストール

playwrightパッケージのインストール:

pip install playwright

必要なブラウザのインストール:

playwright install

2. ブラウザを開く

テストとして、Naverのホームページにアクセスしてみましょう。

# 패키지 import
import asyncio # 비동기 라이브러리
from playwright.async_api import Playwright, async_playwright

async def run(playwright: Playwright) -> None:
    # headless=False => 브라우저 GUI 모드로 실행
    browser = await playwright.chromium.launch(headless=False) # 크롬 사용
    context = await browser.new_context()  # 새 콘텍스트 생성
    page = await context.new_page()  # 새 페이지 열기
    await page.goto("<https://naver.com/>")  # 네이버 홈페이지로 이동

    await context.close() # 콘텍스트 종료
    await browser.close() # 브라우저 종료

async def main() -> None:
    async with async_playwright() as playwright:
        await run(playwright)

asyncio.run(main()) # 실행

notion image

上記のコードを実行すると、ブラウザが「シークレットモード」で起動し、Naverのホームページに正常にアクセスできたことが確認できます。


3. Naverニュースのクローリング

Naverニュースの検索結果リストをクローリングしてみましょう。

3.1. URLの取得

URLの規則を調べた結果、次のようになります:

f"<https://search.naver.com/search.naver?where=news&query=>{인코딩된 검색어}&sort={정렬 기준}&field=0&pd=3&start={시작 페이지}"
  • エンコードされた検索語: quote_plusメソッドを使用して検索語を挿入します。

  • ソートオプション: {"関連度順": 0, "最新順": 1, "古い順": 2}

  • 開始ページ: {1ページ: 1, 2ページ: 11}といった形で、ページごとに10ずつ増加します。

したがって、検索URLは次のようになります:

# 정렬 옵션("관련도순")과 시작 페이지("1")은 고정
search_url = f"<https://search.naver.com/search.naver?where=news&query={quote_plus(keyword)}&sort=0&field=0&pd=3&start=1>"

notion image

このURLにアクセスすると、入力したキーワードに関するNaverニュースの検索結果を表示できます。

3.2. 収集するデータ + xpath

  • 記事リスト: //*[@class='list_news']/li

  • 記事のURL: .//a[@class='news_tit']href属性

  • メディア: .//a[@class='info press']

  • 投稿日時: .//div[@class='info_group']/span[@class='info']

  • タイトル: .//a[@class='news_tit']title属性

  • 本文要約: .//div[@class='news_dsc']

3.3. クローリング方法

3.3.1. xpathで要素を選択する

Playwrightでは、次のようにxpathで要素を取得します:

title_element = await page.query_selector("xpath=//a[@class='news_tit']")

awaitでquery_selectorメソッドが完了するまでコードの実行を一時停止します。

引数にはxpathを入れ、"xpath="の後に記述します。

3.3.2. テキストの取得

HTML要素のテキストはinner_text()メソッドを使用して取得します。

ただし、Playwrightでは非同期でウェブ要素にアクセスするため、query_selector().inner_text()のように要素を選択しながらテキストを取得することはできません。

awaitを使用して前の作業が完了するまで待機します。

# HTML 요소 선택
title_element = await page.query_selector("xpath=//a[@class='news_tit']")
# 텍스트 가져오기
title_text = await title_element.inner_text()

3.3.3. 属性の取得

notion image

このようなHTML要素から属性を取得するには、get_attribute()関数を使用します。

同様にawaitを使用します。

# HTML 요소 선택
title_element = await page.query_selector("xpath=//a[@class='news_tit']")
# href 속성 가져오기
news_link = await title_element.get_attribute("href")
# title 속성 가져오기
title = await title_element.get_attribute("title")

3.4. クローリングコード

3.4.1. パッケージのImport

import re
import asyncio
from pprint import pprint
from datetime import datetime, timedelta
from urllib.parse import quote_plus
from playwright.async_api import Playwright, async_playwright

3.4.2. 投稿日時変換関数

一般的なケース:

notion image

問題のケース:

notion image

投稿日時のxpathを.//div[@class='info_group']/span[@class='info']に設定した場合、上記の画像の「16면 TOP」と「4時間前」のclassが 'info' と同じであるため、「16面 TOP」が取得されてエラーが発生するケースがありました。

そのため、「面」が含まれる場合はエラーメッセージを返し、それ以外の場合は日付形式を %Y-%m-%d に変換する関数を追加しました。

async def convert_write_date(raw_date):
    now = datetime.now()

    if "면" in raw_date:
        return f"[error] raw_date is not datetime form: {raw_date}"

    if "분 전" in raw_date:
        minutes = re.findall('\d+', raw_date)[0]
        article_date = now - timedelta(minutes=float(minutes))
    elif "시간 전" in raw_date:
        hours = re.findall('\d+', raw_date)[0]
        article_date = now - timedelta(hours=float(hours))
    elif "일 전" in raw_date:
        days = re.findall('\d+', raw_date)[0]
        article_date = now - timedelta(days=float(days))
    else:
        article_date = datetime.strptime(raw_date, "%Y-%m-%d")

    article_date = datetime.strftime(article_date, "%Y-%m-%d")

    return article_date

3.4.3. run関数

async def run(playwright: Playwright) -> None:
    # 파라미터 설정
    keyword = input("Keyword: ")

    # 컨텍스트 및 브라우저 설정
    browser = await playwright.chromium.launch(headless=False)
    context = await browser.new_context()
    page = await context.new_page()

    # 브라우저 이동
    search_url = f"<https://search.naver.com/search.naver?where=news&query={quote_plus(keyword)}&sort=0&field=0&pd=3&start=1>"
    await page.goto(search_url)

    # 검색 결과 리스트
    articles = await page.query_selector_all("xpath=//*[@class='list_news']/li")

    # 각 리스트에 대해 반복
    for article in articles:
        article_info = {}

        # 기사 URL, 제목
        title_element = await article.query_selector("xpath=.//a[@class='news_tit']")
        article_info["URL"] = await title_element.get_attribute("href")
        article_info["제목"] = await title_element.get_attribute("title")

        # 언론사
        press_element = await article.query_selector("xpath=.//a[@class='info press']")
        raw_press = await press_element.inner_text()
        article_info["언론사"] = raw_press.replace("언론사 선정", "")

        # 작성일자
        date_element = await article.query_selector("xpath=.//div[@class='info_group']/span[@class='info']")
        raw_date = await date_element.inner_text()
        # raw_date에 에러 메시지가 있을 경우 HTML 재선택
        if "[error]" in await convert_write_date(raw_date):
            date_element_list = await article.query_selector_all("xpath=.//div[@class='info_group']/span[@class='info']")
            date_element = date_element_list[-1] # 마지막 요소
            raw_date = await date_element.inner_text()
            if "[error]" in await convert_write_date(raw_date):
                raise # 작성일자 찾지 못해 에러 발생
            article_info["작성일자"] = await convert_write_date(raw_date)
        else:
            article_info["작성일자"] = await convert_write_date(raw_date)

        # 본문 요약
        summary_element = await article.query_selector("xpath=.//div[@class='news_dsc']")
        summary = await summary_element.inner_text()
        article_info["본문 요약"] = summary

        print("=" * 70)
        pprint(article_info)

    # 컨텍스트 및 브라우저 종료
    await context.close()
    await browser.close()

3.4.4. run関数の実行

async def main() -> None:
    async with async_playwright() as playwright:
        await run(playwright)


asyncio.run(main())

3.5. 収集結果

次は、「AI」で検索したNaverニュースの検索結果です:

Keyword: AI
======================================================================
{'URL': '<http://www.newsis.com/view/?id=NISX20230908_0002443154&cID=10406&pID=13100>',
 '본문 요약': '정부가 군 장병과 대학생 등을 대상으로 국방 인공지능(AI) 기술 활용 대회를 진행한다. 청년들의 AI 기술 활용 능력을 '
          "통해 국방 분야 난제 해결에 나선다는 목표다. 과학기술정보통신부와 국방부는 '2023 제2회 국방...",
 '언론사': '뉴시스',
 '작성일자': '2023-09-08',
 '제목': "과기정통부, 국방부와 '국방 AI' 경진대회 개최…총 상금 8200만원"}
======================================================================
{'URL': '<https://www.mk.co.kr/article/10825161>',
 '본문 요약': '마이크로소프트가 인공지능(AI) 기술을 이용해 암 식별 프로그램을 개발한다. MS는 7일(현지시각) 디지털 병리학 '
          '제공업체인 페이지(Paige)와 협력해 세계 최대의 이미지 기반 AI 모델을 구축하고 있다고 밝혔다. 이 AI...',
 '언론사': '매일경제',
 '작성일자': '2023-09-08',
 '제목': '“희소암까지 싹 잡아낸다”…MS, AI 기반 암 식별 프로그램 개발'}
======================================================================
{'URL': '<https://zdnet.co.kr/view/?no=20230907220708>',
 '본문 요약': '초거대 인공지능(AI)을 전산업으로 확산하기 위한 산‧학‧연 전문가 협의체가 만들어졌다. 과기정통부는 이런 목적을 가진 '
          "'AI 데이터 융합 네트워크' 발족식을 8일 서울 롯데백화점 인근 이비스 앰배서더 명동 호텔 19층...",
 '언론사': '지디넷코리아',
 '작성일자': '2023-09-08',
 '제목': '"초거대AI 전산업 확산"···AI데이터 융합 네트워크 발족'}
======================================================================
{'URL': '<https://www.news1.kr/articles/5164994>',
 '본문 요약': '박정환 문화전문기자 = 인공지능(Ai)이 국내 거주 중인 외국인과 다문화 가정 자녀들의 한국어 실력을... 열리는 '
          "'제1회 AI 한국어 말하기 대회'에서다. 제1회 AI 한국어 말하기 대회는 한글과컴퓨터는 자회사...",
 '언론사': '뉴스1',
 '작성일자': '2023-09-08',
 '제목': '예선 심사위원은 AI…외국인·다문화가정 자녀의 한국어 실력 경연대회'}
======================================================================
{'URL': '<https://www.yna.co.kr/view/AKR20230908046351017?input=1195m>',
 '본문 요약': 'AI) 기술로 진화한 플랫폼을 만들겠다는 비전을 제시했다. 카카오모빌은 8일 서울 강남구 그랜드인터컨티넨탈 '
          "서울파르나스에서 올해로 2회째를 맞는 '넥스트 모빌리티'(NEMO) 행사를 열어 '우리의 세상을 이해하는 AI...",
 '언론사': '연합뉴스',
 '작성일자': '2023-09-08',
 '제목': '카카오모빌 "내년 상반기까지 모빌리티 특화 생성AI 엔진 구축"(종합)'}
======================================================================
{'URL': '<https://www.munhwa.com/news/view.html?no=2023090801071607275001>',
 '본문 요약': '■ 카카오모빌리티‘네모2023’ 내년 상반기 생성AI 엔진 구축 이동·물류·배송분야 적용 계획 모임장소 제안서 '
          '택시호출까지 맞춤여행경로 생성서비스 제시 ‘AI랩’서 자율주행로봇 등 전시 카카오모빌리티가 내년...',
 '언론사': '문화일보',
 '작성일자': '2023-09-08',
 '제목': '“모빌리티에 특화된 생성형 AI엔진 구축”'}
======================================================================
{'URL': '<http://www.edaily.co.kr/news/newspath.asp?newsid=01420246635737824>',
 '본문 요약': '프라이빗 뱅커(PB) 1000여 명이 2차전지 다음으로 인공지능(AI)·반도체 테마 상장지수펀드(ETF)를... '
          '‘인공지능(AI)&반도체’가 335명(32%)의 선택을 받아 1위를 했다고 7일 밝혔다. 이어 249명(23%)이 '
          '△‘2차전지&전기차’...',
 '언론사': '이데일리',
 '작성일자': '2023-09-07',
 '제목': '"2차전지 다음은 AI·반도체"…PB 1000명이 주목한 이유'}
======================================================================
{'URL': '<https://www.etoday.co.kr/news/view/2282422>',
 '본문 요약': '인공지능(AI)보이스봇이 안정적으로 정착되면서, 상담사가 보다 섬세한 고객 케어에 집중할 수 있었던 결과라고 설명했다. '
          'KT는 2017년부터 준비를 시작해, 2021년 4월, 365일 24시간 상담이 가능한 AI 보이스봇 ‘지니’...',
 '언론사': '이투데이',
 '작성일자': '2023-09-08',
 '제목': 'KT, 10년 연속 우수 콜센터…AI가 응대하고 사람이 집중케어'}
======================================================================
{'URL': '<http://news.mt.co.kr/mtview.php?no=2023090810400076118>',
 '본문 요약': '월간큐브/나무는 고객의 월별 투자활동을 시각화해 보여주고 해당 월의 시황을 반영한 인공지능(AI) 음악과 함께 제공하는 '
          '서비스다. 투자자들의 즐거운 순간을 포착해 투자에 대한 긍정적인 경험을 강화하기 위해...',
 '언론사': '머니투데이',
 '작성일자': '2023-09-08',
 '제목': '내 투자가 AI 음악으로…NH투자증권, 월간큐브·월간나무 출시'}
======================================================================
{'URL': '<https://www.hankyung.com/article/202309083127i>',
 '본문 요약': '중국에서 인공지능(AI) 백가쟁명(百家爭鳴) 시대가 열렸다. 기존 중국 정보기술(IT) 업계 강호인 바이두... 다만 '
          "공산당의 사상 검열로 인해 중국산 AI가 글로벌 경쟁에서 뒤처질 경우 '그들만의 리그'가 될 수 있다는...",
 '언론사': '한국경제',
 '작성일자': '2023-09-08',
 '제목': '중국 \'AI 백가쟁명\' 시대 열렸다…"100개 넘는 모델이 전쟁"'}

4. 結論

実際、Playwrightはウェブクローリングのためではなく、ウェブテストおよび自動化のためのフレームワークです。

ただし、Playwrightはウェブクローリングでも非常に強力なツールです。

本文では触れられていませんが、さまざまで便利な機能を備えています。

Chromium、Firefox、WebKitなどさまざまなブラウザをサポートし、ブラウザやエンジンに制限されないウェブクローリングを可能にし、特にモダンなウェブサイトに対して高い互換性を持っています。

また、不要な画像やスタイルシートの読み込みをスキップすることで、クローリングのパフォーマンスを向上させることもできます。

私たちはウェブクローリングを行う際にほとんどbs4またはseleniumを使用することになります。これらはすでに優れたライブラリですが、Playwrightも使用して上記のような利点を感じてみるとさらに良いでしょう。

この記事も一緒に読んでみてください:

データ収集、今度は自動化しましょう

コーディングなしで5分で開始・5,000以上のウェブサイトをクロールした経験

無料で始める →

1 Comment

Add Comment

Your email won't be published and will only be used for reply notifications.

Cabinet IQ 8305 State Hwy 71 #110, Austin, TX 78735, United States 254-275-5536 Bookmarks Guest 06 Jun 23:16

Cabinet IQ 8305 Ѕtate Hwy 71 #110, Austin, TX 78735, United Ꮪtates 254-275-5536 Bookmarks

続きを読む

Get notified of new posts

We'll email you when 해시스크래퍼 기술 블로그 publishes new content.

Your email will only be used for new post notifications.