Help us understand the problem. What is going on with this article?

Docker上でSeleniumとHeadless ChromeとPython3を動かす

More than 1 year has passed since last update.

Docker上でSeleniumとHeadless ChromeとPython3を動かす

by sikkim
1 / 24

自己紹介1

  • 高橋 太郎
  • インターマン株式会社
  • 社内エンジニア(FileMaker、インフラ周り、その他いろいろ)
  • いま一番興味のある技術:Google Colaboratory

趣味でこんなもの作ってます。

500円で作る自転車用防犯カメラ
防犯カメラ.png
防犯カメラ2.png


お品書き

  • MacでSeleniumを動かそう
  • DockerでSeleniumを動かそう
  • デモ
  • 解説

MacでSeleniumを動かそう

  • ある日、こんな依頼がありました
  • 「ブラウザで毎日やっている作業があるんだけど自動化出来ない?」
  • 「多分出来ますよ(SeleniumとPythonでやってみよう)」

MacでSeleniumを動かすのは結構簡単

$ brew install chromedriver
$ pip3 install selenium

前提としてHomebrewとPython3がインストール済みであること


動いたのでレビューしてもらおう

  • 同僚の開発マシンはWindows 7
  • レビューのためにWindows用の手順書をつくるのはめんどくさい
  • そうだ、まるごとDockerで動かせないかな?

Dockerのメリット

  • WindowsでもMacでもLinuxでも同じ環境を用意することができ、同じように動作することが期待できる
    • 冪等性(厳密にはDockerは冪等ではないらしいが)
  • 既存の開発環境を汚さない
    • いらなくなったらコンテナごと削除

DockerでSeleniumを動かそう


動かすのはとても簡単

$ git clone https://github.com/sikkimtemi/selenium
$ cd selenium
$ docker-compose up -d

前提としてGitとDockerがインストール済みであること
実際にやってみましょう


デモ


上手く行かなかったときの保険

設定ファイルのダウンロード
スクリーンショット 2018-02-08 15.06.02.png
docker-compose up -d
スクリーンショット 2018-02-08 15.09.54.png
サンプルコードを実行(Googleにアクセスしてスクリーンショットを撮る)
スクリーンショット 2018-02-08 15.13.12.png
取得したスクリーンショット
スクリーンショット 2018-02-08 15.13.20.png
VNCでデバッグ(デフォルトパスワードは「secret」)
スクリーンショット 2018-02-08 15.16.41.png
VNCでデバッグしながらサンプルコードを実行
スクリーンショット 2018-02-08 15.18.25.png
コンテナ終了
スクリーンショット 2018-02-08 15.35.06.png


解説


docker-compose.yml

selenium-hub:
  image: selenium/hub
  container_name: 'selenium-hub'
  ports:
    - 4444:4444

Seleniumサーバー用の設定
docker-seleniumの公式イメージ
https://github.com/SeleniumHQ/docker-selenium
4444番ポートでSelenium Serverが起ち上がる


docker-compose.yml

chrome:
  image: selenium/node-chrome-debug
  container_name: 'chrome'
  links:
    - selenium-hub:hub
  ports:
    - 5900:5900
  volumes:
    - /dev/shm:/dev/shm

Headless Chrome用の設定
同じくdocker-seleniumの公式イメージ
5900番ポートでデバッグ用のVNCサーバーが起ち上がる


docker-compose.yml

python:
  build: './python-selenium'
  container_name: 'python'
  links:
    - selenium-hub:hub
  command: 'tail -f /dev/null'
  working_dir: '/root/script/'
  volumes:
    - ./script/:/root/script/
  environment:
    - 'TZ=Asia/Tokyo'

Pytnon3用の設定
後述のDockerfile(./python-selenium/Dockerfile)を使用
ホスト側の./script/にファイルを置くと、Dockerコンテナ内の/root/script/に格納される


python-selenium/Dockerfile

FROM python:3

# vimとseleniumをインストール
RUN set -x && \
  apt-get update && \
  apt-get install -y vim && \
  pip install selenium

Pythonの公式イメージにvimseleniumを追加


サンプルコード1

sample.py
#!/usr/local/bin/python3
from selenium import webdriver
#from selenium.common.exceptions import NoSuchElementException
from selenium.webdriver.common.desired_capabilities import DesiredCapabilities
from time import sleep
import datetime

#browser = webdriver.Firefox()
#browser = webdriver.Chrome()

# HEADLESSブラウザに接続
browser = webdriver.Remote(
    command_executor='http://selenium-hub:4444/wd/hub',
    desired_capabilities=DesiredCapabilities.CHROME)

# スクリーンショットのファイル名用に日付を取得
dt = datetime.datetime.today()
dtstr = dt.strftime("%Y%m%d%H%M%S")

# Googleにアクセス
browser.get('https://www.google.co.jp/')

sleep(1)

# スクリーンショット
browser.save_screenshot('images/' + dtstr + '.png')

# 終了
browser.close()
browser.quit()

起動と終了

起動

$ docker-compose up -d

終了

$ docker-compose down

サンプルコードの実行

$ docker exec -it python ./sample.py

フルパスで実行する場合

$ docker exec -it python /root/script/sample.py

コンテナの中に入ってサンプルコードを実行する場合

$ docker exec -it python bash
root@9e243c8ce23d:~/script# ls
images  sample.py
root@9e243c8ce23d:~/script# pwd
/root/script
root@9e243c8ce23d:~/script# ./sample.py
root@9e243c8ce23d:~/script# exit
exit
$ 

VNCでデバッグ

  • Macの場合はvnc://localhostにアクセス
  • Windowsの場合は[DockerのIPアドレス]にVNCクライアントでアクセス スクリーンショット 2018-02-08 15.18.25.png

最後に

  • これがベストプラクティスかどうかは自信ありません
  • でもDockerさえあればどこでも動かせるのは快適

  1. これは「かごもく #5 Selenium でテスト」の発表資料です。(https://kagoben.connpass.com/event/77535/

sikkim
サーバーサイドエンジニア。情報処理安全確保支援士(登録番号:020092)。PythonやNode.js、FileMaker、Nuxt.jsで開発することが多いです。
https://github.com/sikkimtemi
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした