【スクレイピング】Seleniumのインストール&ブラウザ操作自動化

# はじめに

- **Seleniumとは**
  - Webブラウザの操作を自動化するためのフレームワーク

# 0. 前提
- Pythonをインストールしていること

https://qiita.com/rexid/items/8b2f0dd4f7ca03c13a7a


# 1. ファイルを準備

- Selenium用のディレクトリ及びファイルを作成（なんでも良いです）
    - VSCodeなどのエディタで開いておく

```terminal:例
(base) sample@SampleMBP ~ % cd Desktop
(base) sample@SampleMBP Desktop % mkdir Selenium
(base) sample@SampleMBP Desktop % cd Selenium
(base) sample@SampleMBP Selenium % touch sample.py
(base) sample@SampleMBP Selenium % pwd
/Users/username/Desktop/Selenium
(base) sample@SampleMBP Selenium % ls -l
total 0
-rw-r--r--  1 username  staff  0 10  2 20:58 sample.py
(base) sample@SampleMBP Selenium % code .
```

# 2. Pip3のパッケージversionを確認

```terminal
$ pip3 -V
```

```terminal:実行結果例
pip 22.2.2 from /Users/username/.pyenv/versions/3.10.6/lib/python3.10/site-packages/pip (python 3.10)
```

# 3. Python3のversionを確認

```terminal
$ python3 -V
```

```terminal:実行結果例
Python 3.10.6
```

# 4. ChromeDriverのインストール

## ①ブラウザ上でChromeのバージョンを確認

ツールバーから「GoogleChromeについて」をクリック
![スクリーンショット 2022-10-02 19.15.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2689074/c53257eb-dbb6-fc1a-a838-f85546daa4c4.png)


![スクリーンショット 2022-10-02 19.22.07.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2689074/3c6f422d-4d76-27c8-a493-483854786a37.png)

:::note
このバージョンを基に以降の作業を行う
:::



## ②chromedriver-binaryをダウンロード

https://chromedriver.chromium.org/downloads

![スクリーンショット 2022-10-02 19.58.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2689074/09866f59-8a2a-7616-353d-a825df5b6b13.png)

:::note
ブラウザで確認したバージョンに一番近いバージョンを選択する。
今回の場合だと`ChromeDriver 106.0.5249.61`となる。
:::

- 下記画面に遷移するので、自身のPCに合わせてダウンロードするchromedriverのzipファイルを選択。
    - 私の場合はM1Macなので`chromedriver_mac_arm64.zip`を選択。

![スクリーンショット 2022-10-02 20.00.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2689074/eb5f7efb-e71f-4c8f-a647-00343e1cab85.png)


- zipファイルを解凍したら、実行したいファイルが格納されているディレクトリ直下に移動させる

**例**
![スクリーンショット 2022-10-02 21.13.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2689074/30ab617b-cf81-1494-fda4-1b3729c68f2f.png)



## ③chromedriver-binaryをインストール

- [こちら](https://pypi.org/project/chromedriver-binary/#history)から、ダウンロードしたchromedriver-binaryと同じバージョンを選択
    - 今回は**106.0.5249.61.0**


![スクリーンショット 2022-10-02 20.11.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2689074/1e54dc43-d7b6-f232-d9f2-d2784f2540b6.png)

- 選択先の画面でコマンドをコピーし実行


```terminal
$ pip install chromedriver-binary==106.0.5249.61.0
```

```terminal:例
(base) sample@SampleMBP Selenium % pip install chromedriver-binary==106.0.5249.61.0
Collecting chromedriver-binary==106.0.5249.61.0
  Using cached chromedriver-binary-106.0.5249.61.0.tar.gz (5.0 kB)
  Preparing metadata (setup.py) ... done
Using legacy 'setup.py install' for chromedriver-binary, since package 'wheel' is not installed.
Installing collected packages: chromedriver-binary
  Running setup.py install for chromedriver-binary ... done
```

:::note
インストール成功
:::

:::note warn
"chromedriver"は、開発元を検証できないため開けません。と出てくる場合は[こちら](https://qiita.com/rexid/items/8849e967c676a542d6c0)
:::

# 5. Seleniumのインストール

```terminal
$ pip3 install selenium --user
```

:::note warn
この時、`アップグレード出来るよー。要検討してねー。`と警告が出るようならアップグレードする
```terminal
$ pip install --upgrade pip
```
:::

# 6. 実行用ファイルを記述

```py:Selenium/sample.py
import chromedriver_binary
from selenium import webdriver
from selenium.webdriver.common.by import By

# 1. Qiitaの @rexid のプロフィールページにアクセス
driver = webdriver.Chrome()
driver.get('https://qiita.com/rexid')
print(driver.current_url)
# > https://qiita.com/rexid

# 2. 一番最初に表示されている記事のタイトルのURLを取得
article_links = driver.find_elements(By.XPATH, '//div[@class="css-1ebnygn"]/article/a')
print(article_links[0].get_attribute('href'))
# > https://qiita.com/rexid/items/一番最初に表示されている記事のURL

# 3. ブラウザを終了する
driver.quit()
```

:::note
デベロッパーツールを用いて書いていく
:::



# 7. 実行

```terminal
$ python3 ファイル名
```

```terminal:例
(base) sample@SampleMBP Selenium % python3 sample.py
https://qiita.com/rexid
https://qiita.com/rexid/items/0c19ef88faeccc1c53ff
(base) sample@SampleMBP Selenium %
```

:::note
完了
:::


関連
---

- [【スクレイピング】データ抽出→CSVファイル作成（全自動化）](https://qiita.com/rexid/items/72b13b14a217d7cb1511)
- [【スクレイピング】Webサイト上の画像取得&保存（全自動化）](https://qiita.com/rexid/items/b055b0a393eec63c3b56)