🌐

Seleniumをヘッドフルブラウザで実行する

2024/02/28に公開

Docker

概要

本来Seleniumはヘッドレスモードによるコード上でのブラウザ操作を行います。
今回はあえてヘッドフルモードでブラウザの操作を行い、
ついでに操作状況を確認できる環境を構築しようと思います。

MAC M1/M2でDockerコンテナ上のChromeついて

現状arm64向けのGoogle Chromeが提供されていないため
そのままM1(M2) MACで動かそうとするとブラウザ起動の際にエラー落ちしてしまいます。
対応としてDocker Desktop設定でRosettaを利用するようにしておきましょう。

General > Use Rosetta for x86/amd64 emulation on Apple Silicon

Dockerファイル

FROM python:3.12 as base
WORKDIR /src

RUN apt-get update \
    && apt-get -y install locales wget unzip \
    libnss3 libasound2 libdbus-1-3 libatk-bridge2.0-0 libatk1.0-0 libcups2 libxcomposite1 libxdamage1 libgbm1 libxkbcommon-x11-0 \
    x11vnc xvfb fluxbox \
    && apt-get clean \
    && rm -rf /var/lib/apt/lists/*

ARG CHROME_DRIVER_VERSION
ENV CHROME_DRIVER_VERSION=122.0.6261.69
# GoogleChrome
RUN wget -q https://storage.googleapis.com/chrome-for-testing-public/${CHROME_DRIVER_VERSION}/linux64/chrome-linux64.zip \
    && unzip chrome-linux64.zip \
    && mkdir /opt/google \
    && mv chrome-linux64 /opt/google/chrome \
    && ln -s /opt/google/chrome/chrome /usr/local/bin/chrome \
    && rm chrome-linux64.zip

# ChromeDriver
RUN wget -q https://storage.googleapis.com/chrome-for-testing-public/${CHROME_DRIVER_VERSION}/linux64/chromedriver-linux64.zip \
    && unzip chromedriver-linux64.zip \
    && mv chromedriver-linux64/chromedriver /usr/local/bin/ \
    && chmod +x /usr/local/bin/chromedriver \
    && rm -rf chromedriver-linux64.zip chromedriver-linux64

# Python Packages
COPY src/requirements.txt ./requirements.txt
RUN pip install --upgrade pip
RUN pip install --upgrade setuptools
RUN pip install -r requirements.txt

解説

libnss3 libasound2 libdbus-1-3 libatk-bridge2.0-0 libatk1.0-0 libcups2 libxcomposite1 libxdamage1 libgbm1 libxkbcommon-x11-0

Chromeの起動に必要なLinuxパッケージです。
上記の環境に必要なもののみインストールしています。
必要なパッケージに関してはこちらを参考ください。

x11vnc xvfb fluxbox

xvfb：仮想ディスプレイで利用するパッケージ
x11vnc：リモートディスプレイで利用するパッケージ

ENV CHROME_DRIVER_VERSION=122.0.6261.69

Chromeのバージョン指定です。
v115からはchrome-for-testingからChromeとChromedriverを取得します。

v114以前は別々のインストールを行います。
ChromeとChromedriverとSeleniumのバージョンを合わせなくてはならないので注意してください。
参考：https://chromedriver.chromium.org/downloads/version-selection

RUN pip install -r requirements.txt

requirementsからはpythonのseleniumをインストールしています。

PythonでSelenium実行(割愛)

割愛します。
seleniumサイトを参考ください。

仮想ディスプレイとVNC起動

export DISPLAY=:1
Xvfb :1 -screen 0 1600x950x24 -ac & \
x11vnc -display :1 -rfbport 5901 -passwd PASSWORD -bg -forever

dockerコンテナに入り(exec)上記コマンドを実行します。
dockerのポート5901を割り当てておいてください。
またPID1対策に--initフラグをつけておきましょう。
細かいオプションの解説は省略しますが、Xvfbで仮想ディスプレイを構築し、
x11vncでリモートディスプレイの環境を構築することができました。

MACからリモートディスプレイを確認

前述で構築したVNCサーバーに接続します。
ファインダーを開きMACのメニューバーの「移動」から「サーバーへ接続」を選択します。
「サーバーアドレス」の箇所にvnc://localhost:5901と入力し、接続を実行します。

パスワード入力画面がでてきますので
x11vncの-passwdで指定しているPASSWORDを入力しましょう。
接続ができましたら真っ暗な画面が表示されると思います。

Seleniumの実行

ここまで準備ができましたらあとはselenium実行するのみです。
ディスプレイ番号を指定し、スクリプトを実行します。

DISPLAY=:1 python script.py

注意点としましてはヘッドレスでは動かさないため--headlessのオプションは使用しないでください。

うまくいくと前述の真っ暗な画面にブラウザが表示されます。
おめでとう🎉🎉

概要