IEがいよいよ使えなくなる（https://togetter.com/li/1833525）ということで、普段使いはChromeなのでいいんだけど自作のIEを利用したスクレイピングツールの移行を考えないとなあ…ということでぼちぼち調べてみた結果。
WebDriverという仕組みが使えるらしいということで（←周回遅れ）使い方を調べてみた。仕組みは簡単だったけど、spec（WebDriver W3C Recommendation）が使う側の観点ではなくて、実装側観点で書かれてて難解だったのでメモも兼ねて。
Chromeの場合はChromeDriverをダウンロードし、解凍したchromedriver.exeを適当なフォルダに置いて起動するだけで良い。
ChromeDriverはport 9515で待ち受けているらしいので、localhost:9515にリクエストを投げる。
VBAからはxmlhttpでChromeDriverサーバにリクエストを投げて、返ってくるレスポンスを利用する形でChromeの操作が可能になる。
新規セッションを作る
POST http://localhost:9515/session HTTP/1.1 Content-Type: application:json { "capabilities": {} }
新規Chromeウィンドウが開きセッションIDが返る。
HTTP/1.1 200 OK Content-Length: 789 Content-Type: application/json; charset=utf-8 cache-control: no-cache Connection: close { "value": { "capabilities": { "acceptInsecureCerts": false, "browserName": "chrome", "browserVersion": "97.0.4692.71", "chrome": { "chromedriverVersion": "97.0.4692.71 (adefa7837d02a07a604c1e6eff0b3a09422ab88d-refs/branch-heads/4692@{#1247})", "userDataDir": （省略） }, "goog:chromeOptions": { "debuggerAddress": "localhost:60732" }, "networkConnectionEnabled": false, "pageLoadStrategy": "normal", "platformName": "windows", "proxy": {}, "setWindowRect": true, "strictFileInteractability": false, "timeouts": { "implicit": 0, "pageLoad": 300000, "script": 30000 }, "unhandledPromptBehavior": "dismiss and notify", "webauthn:extension:credBlob": true, "webauthn:extension:largeBlob": true, "webauthn:virtualAuthenticators": true }, "sessionId": "b670858dbd58c01d2721b9a8548d834f" } }
セッションID(sessionId)はこの後の処理でずっと使うので覚えておく。
指定したURLを開く(Navigate To)
http://localhost:9515/session/{セッションID}/url
POST http://localhost:9515/session/b670858dbd58c01d2721b9a8548d834f/url HTTP/1.1 Content-Type: application:json { "url": "https://（省略）" }
応答
HTTP/1.1 200 OK Content-Length: 14 Content-Type: application/json; charset=utf-8 cache-control: no-cache Connection: close { "value": null }
現在のURLを取得する(Get Current URL)
http://localhost:9515/session/{セッションID}/url
GET http://localhost:9515/session/b670858dbd58c01d2721b9a8548d834f/url HTTP/1.1
応答
HTTP/1.1 200 OK Content-Length: 508 Content-Type: application/json; charset=utf-8 cache-control: no-cache Connection: close { "value": "https://（省略）" }
HTML要素を検索する(Find Elements)
http://localhost:9515/session/{セッションID}/elements
usingに検索方法を、valueに検索する文字列を指定する。
検索方法にはxpathの他にもcss selector、tag nameなども使える。
POST http://localhost:9515/session/b670858dbd58c01d2721b9a8548d834f/elements HTTP/1.1 Content-Type: application:json { "using": "xpath", "value": "//*[contains(@class,'product')]" }
見付かった複数の要素のIDの一覧が返ってくる。
HTTP/1.1 200 OK Content-Length: 15811 Content-Type: application/json; charset=utf-8 cache-control: no-cache Connection: close { "value": [ { "element-6066-11e4-a52e-4f735466cecf": "3ede9e25-c17c-486e-a1f3-618c201270c5" }, （中略） { "element-6066-11e4-a52e-4f735466cecf": "b41e4cbb-a210-407a-bc30-d9177d9ae0e2" } ] }
HTML要素を起点にして別のHTML要素を検索する(Find Elements From Element)
http://localhost:9515/session/{セッションID}/element/{起点要素ID}/elements
usingに検索方法を、valueに検索する文字列を指定する。
↑で見つかった要素ID 3ede9e25-c17c-486e-a1f3-618c201270c5 を起点にしてさらにHTML要素を検索する。
POST http://localhost:9515/session/b670858dbd58c01d2721b9a8548d834f/element/3ede9e25-c17c-486e-a1f3-618c201270c5/elements HTTP/1.1 Content-Type: application:json { "using": "xpath", "value": "descendant::*[contains(@class,'title')]/descendant::a" }
見付かった複数の要素のIDの一覧が返ってくる。
HTTP/1.1 200 OK Content-Length: 327 Content-Type: application/json; charset=utf-8 cache-control: no-cache Connection: close { "value": [ { "element-6066-11e4-a52e-4f735466cecf": "e6024817-b584-4585-907a-8e55f76398ca" }, （中略） { "element-6066-11e4-a52e-4f735466cecf": "8addecef-e28e-48a8-b12b-6522779def9e" } ] }
HTML要素の属性を取得する(Get Element Attribute)
http://localhost:9515/session/{セッションID}/element/{要素ID}/attribute/{属性名}
↑で見つかった要素ID e6024817-b584-4585-907a-8e55f76398ca（Aタグ）のhrefを取得してみる。
GET http://localhost:9515/session/b670858dbd58c01d2721b9a8548d834f/element/e6024817-b584-4585-907a-8e55f76398ca/attribute/href HTTP/1.1
HTTP/1.1 200 OK Content-Length: 49 Content-Type: application/json; charset=utf-8 cache-control: no-cache Connection: close { "value": "/detail/detail.php?product_id=1198823" }
セッションを閉じる(Delete Session)
DELETE http://localhost:9515/session/b670858dbd58c01d2721b9a8548d834f HTTP/1.1
ウィンドウが閉じる。
HTTP/1.1 200 OK Content-Length: 14 Content-Type: application/json; charset=utf-8 cache-control: no-cache Connection: close { "value": null }
テストにはREST Client on VSCodeを使わせてもらってます。便利。
