【その１】Python で headless-chrome でのスクレイピング（Docker Hub / Google CONTAINER REGISTER 登録編）

# はじめに
- headless-chrome を GoogleCloudPlatform (GoogleAppEngine) 上で稼働し、Python で WEB スクレイピングをした結果を CloudSQL と CloudStorage に登録することをゴールとします。

- はじめる前に、以下が必要となります
 - github アカウント
 - dockerhub のアカウント
 - docker のインストール

# Docker イメージ作成
## docker ダウンロード
https://docs.docker.com/engine/installation/


## Dockerfile の作成
- github に docker-python3-chrome-gcp リポジトリを作成
<img width="1032" alt="スクリーンショット 2017-11-21 13.53.24.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/5034c872-cbfa-6140-af72-cdc249d01d15.png">


- Dockerfile の内容

```file:Dockerfile
FROM python:3

MAINTAINER kojipon <kojipon@gmail.com>

# Install libraries.
RUN apt-get update -qqy \
    && apt-get -qqy install unzip curl wget xvfb xz-utils zlib1g-dev libssl-dev mysql-client

# Install Google Chrome.
RUN wget -q -O /tmp/google-chrome-stable_current_amd64.deb https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb \
    && dpkg -i /tmp/google-chrome-stable_current_amd64.deb \
    ; apt-get -qqyf install

# Install chromedriver.
RUN wget -q -O /tmp/chromedriver.zip http://chromedriver.storage.googleapis.com/`curl -sS chromedriver.storage.googleapis.com/LATEST_RELEASE`/chromedriver_linux64.zip \
    && unzip /tmp/chromedriver.zip chromedriver -d /usr/local/bin/

# Install GCP tools.
RUN wget -q -O /tmp/cloud_sql_proxy https://dl.google.com/cloudsql/cloud_sql_proxy.linux.amd64 \
    && mv /tmp/cloud_sql_proxy /usr/local/bin/cloud_sql_proxy \
    && chmod +x /usr/local/bin/cloud_sql_proxy

# Install Japanese font.
RUN wget -q --content-disposition -O /tmp/IPAfont00303.zip http://ipafont.ipa.go.jp/old/ipafont/IPAfont00303.php \
    && unzip /tmp/IPAfont00303.zip -d /usr/share/fonts/ \
    && fc-cache -fv

# Install python libraries
RUN pip install selenium pytz google-cloud-bigquery mysql-connector-python-rf
```

- Dockerfile 作成

```
$ git clone git@github.com:<your-account>/docker-python3-chrome-gcp.git

$ cd docker-python3-chrome-gcp

$ vi Dockerfile
<Dockerfile の内容を記載>

$ git add-commit -m "Added Dockerfile."
<備考: add-commit = !git add -A && git commit>

$ git push -u origin master

```

- Dockerfile からイメージ＋コンテナ作成

```
$ docker build --no-cache -t python3-chrome-gcp .

※ キャッシュが古くて更新させれていないパッケージがある場合は --no-cache で回避

$ docker run -it --name dev1 python3-chrome-gcp bash

$ echo " ¥
from selenium import webdriver
from selenium.webdriver.chrome.options import Options

options = Options()
options.add_argument('--headless')
driver = webdriver.Chrome(chrome_options=options)

driver.get('https://www.google.co.jp/')
print(driver.title)

driver.quit()
" >> sample.py

$ python sample.py
```

# Docker 登録

## Docker Hub と Github 連携

- ログイン後、右上メニューの「Create」の「Create Automated Build」を押下

<img width="897" alt="スクリーンショット 2017-11-21 13.17.35.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/f9001672-9d54-2758-d86c-deeb26fe2f76.png">

- 「Link Accounts」ボタンを押下し「Link Github」ボタンを押下。その後「Public and Private (Recommended)」の項目の「Select」ボタンを押下。

<img width="1147" alt="スクリーンショット 2017-11-21 13.22.44.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/7458e441-ef5a-d21a-aa9e-82bc755547af.png">

- リンクできたら、もう一度、右上メニューの「Create」の「Create Automated Build」を押下。その後、左上「Github」リンクを押下。

<img width="1145" alt="スクリーンショット 2017-11-21 14.00.50.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/aa3cdbf4-8636-b71a-e318-99c4177abeb6.png">

- 該当のリポジトリを選択し、「Create」ボタンを押下。Github のリポジトリ名に docker などとつけていても、Docker Hub 上での公開名は別途変更できます。

<img width="1141" alt="スクリーンショット 2017-11-21 14.02.24.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/e2a5b2da-f498-f447-941b-c0511de8f16c.png">

- リポジトリの「Settings」タブの「Trigger」ボタンを押下することでイメージを作成することができます。

<img width="1145" alt="スクリーンショット 2017-11-21 14.05.22.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/a08d2012-9e9d-538d-2ce4-6ae05e92c1c8.png">

## Google CONTAINER REGISTRY と Github 連携

- Container Registry にアクセスし、「トリガーを作成」を押下。

<img width="854" alt="スクリーンショット 2017-11-21 14.16.32.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/612cd0f9-288f-4f4c-9223-fca3dd674c7c.png">

- ソースの選択でラジオボックスに「GitHub」を選択しし「続行」ボタンを押下。

<img width="857" alt="スクリーンショット 2017-11-21 14.16.41.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/40cd369a-4fc0-3df0-b03a-aa55f80c30c8.png">

- [ダッシュボード](https://console.cloud.google.com/apis/dashboard)より　Google Container Registry API を有効にします



- 必要項目を入力し、下部の「トリガーを作成」ボタンを押下し、ビルドするタグを選択してください

```
イメージ名の gcr.io/$PROJECT_ID / $REPO_NAME:$COMMIT_SHA  の gcr.io/$PROJECT_ID まではそのままでなければイメージを PUSH できません
```
   
<img width="435" alt="スクリーンショット 2017-11-21 20.49.30.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/2a10e16b-b0ce-b02b-d7bd-cc843851997b.png">

- 「トリガー作成」ボタンのあと「ビルドするタグを選択」の押し忘れにご注意ください

<img width="621" alt="スクリーンショット 2017-11-21 20.57.17.png" src="https://qiita-image-store.s3.amazonaws.com/0/44348/08c38a51-c39f-154b-107a-00fc4d6682ea.png">


---


[【その２】Python で headless-chrome でのスクレイピング（Google Cloud SQL / Google Storage 構築編）](https://qiita.com/kojipon/items/ffed2aa3f99788644fb7) へ続く