詳しいことは分からないけど自動打刻ツールをつくりたい

#　まえがき
私の会社の出退勤管理は，社内ネットワークにログインし，会社のマイページから
出勤管理→ID・Password入力→出勤ボタンを押す
という流れでやっています．

朝結構出勤打刻をするのを忘れてしまうので，この流れを自動でできないかな～
と思いpython+seleniuim+chromedriverで動かしてみました．
（スクレイピングと言うそう）
参考ページがiOS多すぎて混乱しました...
このページはWin10用に書いています．

自分のプログラミング経験は，大学2年の頃の必修でC言語初級を受けただけです．

1. 環境構築<br>
1.1 pythonを入れる<br>
1.2 Chromedriverを入れる<br>
2. コードをかく<br>
2.1 seleniumを動かす<br>
2.2 スクリプトからブラウザを開く<br>
2.3 入力ボックスの要素を見つける<br>
2.4 入力ボックスに社員番号とパスワードを入れる<br>
2.5 出勤ボタンをclickする<br>
3. スクリプトを少ない手順で実行させる<br>
方法1 . タスクスケジューラの設定<br>
方法2 . ショートカットの作成<br>
方法3 .拡張子を.pyにして保存

#1. 環境構築
### 1.1 pythonを入れる
PCでpythonを動かすための準備です．
こちらのページから最新ver.を入れました．
2021/9/12現時点で最新ver.は3.9.7でした．
.zipを解凍し，.exeを実行してインストールするのですが
その際にチェックリストにでてくるAdd pathにチェックします．
https://www.python.org/downloads/

###1.2 ChromeDriverをいれる
スクリプトからブラウザを操作するための準備です．
まず会社で使っているChromeのver.を確認します．
Chromeを開いて設定>Aboutから見られます．
ちなみにChromeが最新のverじゃないと動かないなどもあるそうです．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2004199/be52b640-bc36-db5d-92a7-4932828b3310.png)

そうしたら以下のサイトで対応するChromeDriverを入れました．
(<font color="deepskyblue">Chrome Driver 93.0.4577.63</font>)
https://sites.google.com/a/chromium.org/chromedriver/downloads

↑のサイトはまもなくなくなると書いてあるので，新しいサイトページも
載せておきます．
https://sites.google.com/chromium.org/driver/

Chromedriver.exeは分かりやすい場所に保存してください．
あとでスクリプト書くときにパスが必要になります．
私はC:直下に入れました．

# 2. コードを書く
### 2.1 Seleniumを動かす
Seleniumはスクリプト上でブラウザを動かせるものだと思います．
Python 3.9を開いて以下のようにします．

```:python
import selenium
from selenium import webdriver
#pathの場所は任意
driver = webdriver.Chrome(executable_path="C:\chromedriver.exe") 
```
### 2.2 ブラウザを開く
```
#Chromeを開いてみる
driver.get("https://google.com/")
```
出勤ページのURLを入れればそのページが開きます．
googleの検索ボックスを出勤ページだと見立てて進めていきます．

### 2.3 入力ボックスの要素を見つける
要素を見つけることで，そこに対しての命令実行を行うことができます．
大体name,idで書かれています．

まず，ブラウザの入力欄がどう指定されているかを調べます．
開いたブラウザから設定>その他のツール>デベロッパーツールと開くと
HTMLが表示されます．
カーソルを合わせて，検索ボックスの要素を探すためにたどっていきます．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2004199/d3b135f1-d989-ee96-0cea-1bb0d780f51d.png)

▶を押すとどんどん細かく見ることができるので，左画面の色がついている
箇所と照らし合わせながら見つけてください．
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2004199/1394fea2-e26b-5544-322d-c303d7837ace.png)

name="q"と書かれているところが入力boxの要素っぽいですね．

### 2.4 入力ボックスに社員番号とパスワードを入れる

以下のようにコードで入力を実行します．

```
from selenium.webdriver.common.keys import Keys as keys
id = driver.find_element_by_name('q').send_keys('社員番号')
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2004199/96c027e6-14fc-0a9d-493e-bccfa1cacebc.png)

入力されました．

### 2.5 出勤ボタンを押す
出勤ボタン（検索ボタン）の要素を見つけます．
(私の会社の出勤ボタンはnameで指定されているのですが、chromeではsubmitでデータを送信しています。)

```
id = driver.find_element_by_name('q').submit()
```
もしくは出勤ボタンが以下のような要素で書かれていた時
input <font color="red">name</font>='SYUKKIN'
name要素でデータを送信するなら以下のコードでも可能です。
```
syukkin=driver.find_element_by_name('SYUKKIN').click()
```
出勤できました.


# 3. スクリプトを少ない手順で実行させる
###方法1. タスクスケジューラの設定

Windows10には標準でタスクスケジューラというソフトが入っています．
起動時条件とスクリプトを設定するだけで決まった時間に動かすことができます．


### 方法2. ショートカットの作成

こちらはショートカットキーでスクリプトを実行するものです．
下記の記事が参考になります。

https://www.yutaka-note.com/entry/shortcut001


###方法3. 拡張子を.pyにして保存

スクリプトをメモ帳にコピーして拡張子を.pyに変えると、
アイコンをクリックすれば実行してくれます.
(直接.pyで保存する方法があるかも)
私は一応まだ怖いのでこのやり方でやっています.

# あとがき

たぶん環境設定とかコードとか引用ばかりなので詳しいことわからないんですけど
出退勤忘れなくなったから、良しとします

# 参考資料

https://aiacademy.jp/media/?p=346

https://qiita.com/shota-nekoneko/items/64bbd0c2f534d20e7b77

https://kurozumi.github.io/selenium-python/locating-elements.html

https://www.yutaka-note.com/entry/shortcut001