見出し画像

ブラウザ操作をプログラミングで自動化できるSeleniumを試してみた。

anpapa

これまではnoteのAPIを叩いてGASでいろいろと情報取得してみましたが、今度はnoteに自動でログインして、ログイン後の情報を取得したり操作したりしてみたいと考えました。その観点で調べたところ、ブラウザ操作を自動化できるSeleniumというソフトウェアが有名で使えそうでしたので、今回は自動ログイン云々の前に、まずはSeleniumをとにかく動かしてみるという第１歩を試してみます。

■やることポイント
・Seleniumの概要理解
・Windows10（自身のPC）での環境構築
・Javascript(Node.js)でのプログラミング
・Seleniumを使ってブラウザ自動化プログラムを動かしてみる

まずSeleniumの公式サイトをざっくり読む

自身のPCがWindowsなので、WindowsのPC環境にSeleniumをインストールする。インストールするためには、上記サイトを読むと、

JavaScriptへのSeleniumライブラリのインストールはnpmを使います。

npm・・・と名前は聞いたことがあるが使ったことがなかったのでそこから調べていく。Node.jsのパッケージ管理ツールとのこと。次はNode.jsか・・・と関連して知識を得られるのがプログラミングの楽しいところでもありますね！と辿っていき、必要なのは、Node.jsとnpmのインストールを事前に行い、実行環境が整ったところで、npmのコマンドでSeleniumをインストールすればよさそう。以下のサイトを参考にさせていただきました。

Node.jsのインストールはこちらから。インストールすれば同時にnpmもインストールされた。

WindowsのコマンドプロンプトまたはPowerShellにて、以下コマンドを打って、バージョン情報が出てこればひとまずOK

node -v
npm -v

その後、npmのインストール先の関係で環境変数（NODE_PATH）を設定したあと、いよいよSeleniumをnpmコマンドでインストールする。

npm install -g selenium-webdriver

ここまでできたら、次は、自動化で操作するブラウザごとのドライバーもインストールする必要がある。今回はchromeを使用することを考えているため、以下サイトから自身の使っているchromeのバージョンのドライバをダウンロードする。

ダウンロード→展開すると、chromedriver.exe　ファイルがあるので、このファイルを任意のフォルダに配置し、そのフォルダまでのパスも環境変数（Path）に設定する。例として、以下に配置したとすると、
C:\Program Files\chromedriver\chromedriver.exe
環境変数のPathに、C:\Program Files\chromedriver　を追加する。
その後、コマンドプロンプト等で、以下のコマンドを打って、Starting ChromeDriver～～～云々と何かメッセージが出てこれがひとまずOK。

chromedriver

ここまで出来たら環境構築は完了で、次はSeleniumを使ったブラウザ自動操作のプログラミングをしていく。Seleniumは様々な言語、JavaやPython、Rubyなどで利用できるが、今回はJavascript(Node.js)を使っていきます。

まずは動作させることを目的に、noteのトップページにアクセスして、ページタイトル文字列を取得して表示するだけのコードを書いてみます。

const {Builder} = require('selenium-webdriver');

async function getPageTitle() {
   let driver = await new Builder().forBrowser('chrome').build();
   await driver.get('https://note.com/');
   let title = await driver.getTitle();
   return title;
};

getPageTitle().then(result =>{
   console.log(result);
});

補足：１行目のちょっと見慣れない書き方について、右辺はNode.jsで外部モジュールを読み込む方法、左辺は分割代入の書き方。以下参考。

このコードをjsファイルとして保存(ファイル名：test.js)し、ローカルPCの任意の場所に配置。コマンドプロンプトまたはPowerShellから保存したjsファイルをNode.jsで実行します。Javascriptといえばブラウザ上で実行されるものというイメージがありますが、Node.jsを使えばそのままJavascriptのコードを実行できます。便利ですね！以下のようにnode test.jsと実行すると、chromeブラウザが自動で起動してきて、noteのトップページが表示され、コンソールにページタイトルが表示されました。

なにやら「システムに接続されたデバイスが機能していません。（0x1F）と出力されていますが、そこはよくわからないが気にしないことにして(笑)、無事にコンソールに「note ――つくる、つながる、とどける。」とページタイトルを取得して表示されています。
またchromeブラウザが自動的に起動し、noteのトップページが表示されています。chromeの上部に「Chromeは自動テストソフトウェアによって制御されています。」とも表示されています。（ブラウザ側でも判別しているようですね、すごい）

動画（スクリーンキャプチャ）はこちらです。（ぜひチャンネル登録もよろしくお願いします！）

ということで、１からSeleniumを動かすところまで実施してみました。まだページタイトルを自動で取得しただけですので、実用的ではないですが、次はこれを使って自動ログインをしてログイン後の情報を取得できるか実験してみたいと思います。

ちょっとしたことでも、実際にプログラミングをして動かすところまでやるといろいろと躓きや付随する学びが得られました！Node.jsにも俄然興味が出てきたので、今後もいろいろと使ってみたいと思います。ではまた！

この記事が気に入ったらサポートをしてみませんか？