読者です 読者をやめる 読者になる 読者になる

能書き

それっぽいことを書くやつです

Amesh Hacks

東京アメッシュスクレイピングしてわいわいできるようにしたので手順のメモ

まずは画像を探す

みた感じ Canvasで直接描画してる感じではなかったので(フィーリング)、画像を取得して<img>で出してるか、Canvasに書いてるか、だろうな〜と思った
とりあえずChromeのコンソールで「Network」タブ見ながらリロード。
f:id:ikr7:20140801203957p:plain
グワーッ

ファイルいっぱいロードしてて(94個も!)探すのめんどいので「Network」タブの「Filter」→「Images」と選択して画像だけ表示させる。
あったぞ!!!!!!
f:id:ikr7:20140801204355p:plain

どうやら
tokyo-ame.jwa.or.jp/mesh/000/[5分おきの時刻].gif
って感じらしい。

画像 URL を生成してる部分を探す

スクレイピングしてわいわいするにあたって、時刻から 201408012040 みたいな文字列を生成してもいいけど、アメッシュ割と適当で1分くらい平気で遅れるので(やってみるとわかる) ので画像のURLを生成してる箇所を探します。

こんな時に便利なのが「ロードしたファイル全ての中から検索」するやつで、Chromeのコンソールの「Sources」タブで Alt+⌘+F ( WindowsならAlt+Ctrl+F ? ) するとニュッと出てくる。早速「.gif」で検索します。

あっっ!!!!!!!これっぽい!!!!!!11!!
f:id:ikr7:20140801205315p:plain

なるほど〜Amesh.js の 141 行目か〜 となります。で、そのあたりはこんな感じ。
f:id:ikr7:20140801205552p:plain

フムフム this.imageList ね〜 。「Sources」タブで Alt+⌘+F で検索します。
f:id:ikr7:20140801205902p:plain

こんどは initialize.js の 141 行目か〜 って感じになります。その辺を見ます。
f:id:ikr7:20140801210113p:plain

ええっJSONP用!? ということは 画像ファイル名のリストは .js ファイルでロードされてるってことになります。「Network」タブで「Filter」→「Scripts」で抽出します。
f:id:ikr7:20140801210340p:plain

mesh_index.js?9379297 っていうのがメチャ怪しいですね。( JSONP でなんかをロードするとき、ブラウザにキャッシュされないように ?[乱数] ってURLに付与するのはよくあるやり方ですね。 )

で、mesh_index.js?9379297 の中身がこんな感じ。

Amesh.setIndexList(["201408012100","201408012055","201408012050","201408012045","201408012040","201408012035","201408012030","201408012025","201408012020","201408012015","201408012010","201408012005","201408012000","201408011955","201408011950","201408011945","201408011940","201408011935","201408011930","201408011925","201408011920","201408011915","201408011910","201408011905","201408011900"]);

うお〜〜〜!!!!!これだ〜!!!!!

結論

Alt+⌘+F で検索するの死ぬほど便利