エンジニアブログ2019.04.26【オフィスIoT】ICカードで出退勤する。稟議通ったのに僕が注文依頼出してなかったせいで、カード開発進みませんでした!!ただ、かなりいい感じに前回のコードの改修が済んだので、せっかくなので解説という形にしたいと思います。//ヘッドレスモードをオフにする。//フォームが出現するまで待機。無くても動くけど念のため。//フォームにアドレス・パスワードを入力して送信。//ロードするまで待つ。//Slackの(自分)の要素を探す。browser.close();})();こんな感じと相成りました。進歩は、sleep()という固定値で待機する処理が消えたことですね。ポイント解説していきます。上の奴から一部分ずつ解説していきます。"networkidle0"});//フォームが出現するまで待機。無くても動くけど念のため。"networkidle0"}を渡しました。これを指定しないとJSが読み込まれる前にアドレスを打ち込み始めやがります。そのためにsleep()を使っていたのですが...どうやらJSが読み込まれるのを待つことで打ち込みが正常に開始できるようです。この点、もしもロードがめちゃくちゃ長くなったときに固定値だと対応できないので、きちんとイベント処理で対応できるようになったのはいい感じですね。//フォームにアドレス・パスワードを入力して送信。page.click('button#signin_btn');ここら辺は、CSSと同じようなセレクタを指定しています。一意でないと事故が起きる可能性があるので、id使ってあげるととってもいい感じです。場合によってはidが無くclassのみで要素探さないといけないケースもあると思います。#Firefox最新版とかってやると、該当する要素全部出してくれます。これで過不足なくobjectを取得できているか確認しましょう。ちなみに、$$()はdocument.querySelectorAll()と同じで、objectの配列が帰ってきます。$()はdocument.querySelector()となり、一番最初のobjectだけ返してくれます。スクレイピングの必須知識ですね。//ロードするまで待つ。success');また、以前はgeneralのチャンネルIDで判定していたのですが、ログインボタンの有無で判定するようにしました。URLによる分岐にも挑戦したのですが、改変するほどのコードではなかったためこちらを採用しました。ここだけは検討点ですね。//Slackの(自分)の要素を探す。page.click('.p-channel_sidebar__you_label');また、個人ページへの移動も、ユニークIDを使う必要がなくなりました。Slackの自分のページにのみ表示される要素を取得して移動すると、Slackページのリロードが入らないので動き自体も素早くなりました。page.click('#msg_input_send');browser.close();最後にこいつらでコマンド打ってボタン押しておしまいですね。本当は動きを見せられれば一番面白いのですが、いかんせん今回セキュアな情報が多すぎるので諦めます。こんな感じでリファクタリングが完了してかなり満足いく動きになりました。どんな状況であってもきちんと狙った動きができるようなもの作れるとかなり安心できますね。スピードを重視するとどうしても「動けばいい」という考え方に寄りがちです。いったインプット→アウトプットで、より効率の良い方法についての情報を常に集めていくべきだなと改めて感じました。次回はちゃんとICカードリーダのお話をしていきます。いえ、ICカードでジョブカン打刻するのは公式アプリ使うのが一番良さそうなんですよね。言いますのも、現状の方法のまま行くと1.利用者がSlackIDを全員持っていないといけない2.そのSlackにジョブカンを紐づけてもらわないといけない3.さらにSlackIDを全員分保管しておかないといけないとまあ、かなり問題点が多い完成品となってしまいます。Slackアカウント取得してくれっていうのは問題ないのですがパスワード渡してもらうのはセキュリティ的にどうなんだろうとか、ジョブカンと連携したりするのは我々エンジニアは楽でもきっと難しい人も多くいるだろうとか・・・。いった部分考えるとなかなか大型化には向いていないんですよね。今回作った仕組みだと。買ってもらったカードリーダは公式アプリにそのまま流用できるようなやつを買ってもらいました。公式使うとなっても稼働させるマシンがラズパイからWindowsマシンに変わるくらいのもんですね。公式使うってことは僕のアプリが無駄になるのですが・・・。その後についてももちろん考えておりますのでまだまだ終わりません。やりたいことは無限大です。今回作った動画を社内で共有したら「こんなの作ってよ!」という依頼が飛んできました。頼られると応えたくなるのが僕ですので、やる気に満ち溢れております。頑張ったことがより頑張れることに繋がるこの感じ、最高。佐藤樹2019年4月にハッピーズへ新卒入社。人を笑顔にできるサービスを作るのが夢。