Puppeteerでポップアップウィンドウを操作する

日本のウェブサービスは、ウェブサービスと称していても実体は非常に旧式なサービスで、現代的なモダンな作りになっていないものが沢山まだあります。特に事務系の請求書をダウンロードするタイプのサービスではそれが顕著で、ダウンロードするだけなのに、わざわざポップアップさせてクリックさせるといった、いけてない作りのサービスがやまほどあります。

そんな一例がリクルートスタッフィングの請求書ダウンロード。このサイトからPuppeteerでダウンロードするには2つの面倒な問題をクリアする必要があります。今回はこのポップアップと、対象の月の請求書をダウンロードする厄介な問題をクリアしようと思います。

今回使用するライブラリ等

今回はスクレイピングさせる為の補助として、cheerioと呼ばれるNode.js上でjQueryのようにDOM操作をする事のできるモジュールを入れています。

今回のダウンロード上の問題点

今回対象としてるウェブサービスでは、以下のような問題点があるため、そのままクリックでダウンロードしようとしてもダウンロードが出来ません。

  1. 年度月でフィルタして特定する事が出来ない。
  2. 請求書ページまでは、セッションが必要になってるので、いきなりそのページには飛べないので、クリックさせて遷移が必要。
  3. 一番の肝は対象の年月のデータを特定出来ない事。Tableをスクレイピング&解析して、請求年月日から推察、対象の文字がクリックのonClickに含まれているかどうかを判定して、対象のTDが何番目にあるかを特定し、クリックさせる必要がある。
  4. 請求データは過去4ヶ月分しか掲載されていない。1行のTRとして上部に表示されている。(2行目のTRは不要)
  5. 開封ボタンを押すとダウンロード用のポップアップが出る仕組み。ポップアップを捕捉してそちらを操作する必要がある。
  6. 請求は1月に複数含まれてる事があるので、全てチェックをして開封をする必要がある。

図:非常に面倒なUIです。

ソースコード

冒頭部分

  • 今回はログイン画面から順番にたどっていく必要があるので、請求書ページにダイレクトに飛びません。
  • Box Driveに直接保存する為、subfolderはユーザIDと組み合わせてパスを生成しています。
  • グローバル変数でデスクトップのパスを取得しておきます。
  • つづけて、getprompt()を実行してユーザの入力を受付待ちします。
  • chromeはいつもの「C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe」ではなく、「C:\\Users\\ユーザー名\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe」となるため、ユーザ毎のパスを取得して、chromepathに格納する

プロンプト入力受付部分

  • promptsを使って、4つの質問を受け付けるようにします。
  • useridとpassword、指定の年度月の4つを質問し、それぞれの形式で受け付けます。passwordを指定しておくと****と隠した状態で表示されるようになります。
  • 取得した数値を引数にmain()を実行します。
  • この段階で完成品フォルダをmakeDirにて作成してしまいます。
  • promptsのtypeがnumberは数値入力なのですが、バグで5桁以上入れようとすると(特に0の連続)入力がクリアされてしまうので、今回はtextにしています。

Puppeteer部分

  • 前半部分は前回のエントリーとほぼ同じ。
  • 今回の1番目の肝は、Table要素を取得して二次元配列データに変換する部分です。#contentsAreaの部分が年度月のTableなのでこれに対してTD要素内を二次元配列化してあげる。値はtextではなくinnerHTMLで取得する
  • リクルートの場合、2つ目のTRは利用しないので不要です。
  • forループ内でcheerioに食わせてまず、対象aタグ内のonClick内の文字列をprop(“onclick”)にて取得します
  • 取得した文字列内にchoicedayと同じ文字列が含まれているかどうかを判定させます。判定は正規表現にて行います。判定結果無い場合にはnullが返ってきます。
  • 同じ文字列が入っていた場合には、ループを抜けて、あらかじめカウンタさせていた数字に該当するTDエレメントをクリックさせます。
  • 全てチェックをチェックさせ、開封ボタンをクリックするとポップアップが表示されます。
  • ポップアップページを捕捉させて、ロードが完了したら、対象のダウンロードボタンをクリックさせて請求書をダウンロードする。
  • 完了したら、popupwinを閉じ、alertを出してあげて終了。
  • 最後に保存先フォルダをspawnsyncにてexplorerを使ってオープンしています。

関連リンク

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)