Reblog の再燃者を調べる

Tumblr Dashboard

約1年前に投稿した変態仮面の公式HPのキャプが少しだけ Reblog されるようになっていたので、
誰が火付け役になったのかを調べてみました。

Tumblr では投稿に対するリアクションとして notes というものがあります。
Facebook なら「イイネ！」の数、Twitter なら fav や RT の数が反応の指標であるように、Tumblr は Reblog と Like の数のカウントがこれにあたります。

Tumblr の notes の画面

最近の Dashboard ではこの notes の部分をクリックすると Reblog したページに飛べるようになっています。
どうやってるのかなと要素の情報を見てみると、そもそも notes の要素に Post の URL が埋めこまれていたと分かりました。

各 Post の URL には Post ID が含まれていて最新の投稿ほど値が高くなります。
再燃という事は時間的に隔たりがありこの Post ID の値にも開きがあるはずなので、そのあたりで見つけられそうです。

という事で誰が変態仮面を掘ったのか調べてみます。
全体的な流れとしては

  1. Dashboard で該当の Post を見つける
  2. Notes を開いて読み込ませる
  3. post 要素の id(HTML的な意味) を確認
  4. JavaScript を走らせてデータを回収

という感じになります。

使用するブラウザは Firefox でも出来ますが、表示が見やすいので Google chrome を使います。

まず Dashboard で該当の Post を見つけます。

ありました。

1,234 notes というような部分をクリックすると Notes が表示されるので開きます(ポストにフォーカスが合っていれば n キーでも開けます)。
このままだと Notes は直近 50 件しか表示されていないのである程度読みこませる為にスクロールします。

今回は notse 数もそこまで大きくないため、全 notes を読み込ませました。

次に post 要素の id を拾います。
投稿の白い部分を右クリックして「要素の検証」をクリックします。

開発コンソールが表示されて要素の情報が丸見えです。

この中で必要なのは post_container クラス直下の post クラス要素の id です。
id="post_72201059020" とあるので id は post_72201059020 であると分かりました。

あとは JS コンソールタブに切り替えて JavaScript を走らせれば終わりです。
JS コンソールを開きます。

ここで

Array.apply(0, ここに先程のPostIDを使用します.querySelectorAll('.notes > li span.action[data-post-url]')).filter(function(elm) {
  console.log( elm.getAttribute('data-post-url').match(/\d+/g).slice(-1)[0]);
});

こんな感じのコードを走らせます。
上のコードの「ここに先程のPostIDを使用します」に先程の ID を使います。
今回の場合は

Array.apply(0, post_72201059020.querySelectorAll('.notes > li span.action[data-post-url]')).filter(function(elm) {
  console.log( elm.getAttribute('data-post-url').match(/\d+/g).slice(-1)[0]);
});

です。
実行すると各 Reblog の Post ID が列挙されます。

あとはスクロールしながら
数字の離れている場所を探します。

見つけました、72167183345 であると分かりました。

今度はこの数字を使ってスクリプトを実行します

Array.apply(0, <Post ID>.querySelectorAll('.notes > li span.action[data-post-url]')).filter(function(elm) {
  return  elm.getAttribute('data-post-url').match(/\d+/g).slice(-1)[0] == ここに先程の数字を使います;
});

上記の「Post ID」の部分、「ここに先程の数次を使います」の部分をそれぞれ差し替えて実行します。

無事 Reblog の再燃者を見つけることに成功しました。
今回は huzitaka さん が発端になったようです。
もちろんその後 Reblog を繋いだ方々の影響もありますが。

Notes が 500 程度だったのでこのやり方で事無きを得ましたが、Notes が数千や数万という場合には厳しいでしょう。
何かいい方法をご存知の方がいらしたら、コメント欄やエントリー書きましたよ、という情報を書いてくれると助かります。


追記(2013-01-05).
cinerariaa さんから「Dashboard ではなく直接 notes ページを開いた方が楽ですよ」というリプ(Twitter / cinerariaa)を頂いたので確認した所、確かにそうだったのでそちらに対応したスクリプトも書いておきます。

まず該当する投稿を開きます。
今回の例では変態仮面HPのキャプのページです。

ページを開いたら

location.href = document.body.innerHTML.match(/tumblrReq\.open\('GET','(\/notes\/\d+\/[^\?]+)/)[1]

を実行します。
上記のスクリプトは notes ページのパスを拾い、そのページに移動します。
Post ページに note が表示されていない場合は上手く動作しませんが UserAgent の変更で対応できます。

必要な値を回収しながら下記のスクリプトを実行します。

/**
 * 表示中の notes の post id をリストアップします
 * ここでは本文中のような post_(整数) なる値は必要しません。
 */
Array.apply(0, document.querySelectorAll('span.action[data-post-url]')).filter(function(elm) {
  console.log( elm.getAttribute('data-post-url').match(/\d+/g).slice(-1)[0]);
});
/**
 * 特定の post id を抽出します
 * リストアップした id から開きのある post id を見つけそれを使用します
 */
Array.apply(0, document.querySelectorAll('span.action[data-post-url]')).filter(function(elm) {
  return  elm.getAttribute('data-post-url').match(/\d+/g).slice(-1)[0] == post_id; /* この post_id の部分を任意の整数に差し替えてください */
});