rfriendsでラジオ録音

ラジコ、らじるらじる、タイムフリーのラジオ番組を録音

Javascriptで動的に出力されるhtmlを取得する方法

 今回AuDeeのDownloaderを作成するにあたり困ったことは、Javascriptでページを動的に作成していることでした。

f:id:rfriends:20210911054642p:plain

 このスクリーンショットの例ではたとえば3というところをクリックすると3ページ目が表示されます。
 ところが、これをwgetで取得してもページ1しか取得できません。

https://audee.jp/program/show/100000165(ページ1)
https://audee.jp/program/show/100000165#page3(ページ3)

 整理すると,ページ3を表示させた状態で以下を実行すると、

1.ブラウザの「名前を付けて保存」(ページ3)
2.ブラウザの「ソースを表示」(ページ1)

 また、wgetを実行すると、

3.wget https://audee.jp/program/show/100000165(ページ1)
4.wget https://audee.jp/program/show/100000165#page3(ページ1)

となります。

 いろいろと検索をした結果、これを解決するにはヘッドレスブラウザを使えばいいということがわかりました。
ここではchromeのヘッドレスモードを使った例を示します。(windowsでの実行例)

cd C:\Program Files\Google\Chrome\Application
chrome --headless --disable-gpu --dump-dom https://audee.jp/program/show/100000165#page3  > c:\temp\test3.html

test3.htmlにページ3のhtmlが保存されていました。
めでたしめでたし。


(追記)
なお、AuDeeのDownloader Ver.1.00ではこの手法の採用は見送っています。
理由はユーザ環境に必ずChromeがあるわけではないので。


(参考)
ヘッドレスブラウザとは何か?
https://www.seleqt.net/programming/six-headless-browsers/
ヘッドレス Chrome ことはじめ
https://developers.google.com/web/updates/2017/04/headless-chrome