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

はてなブログで「購読中のブログ」の一覧を表示するスクリプト

JavaScript プログラミング はてなブログ

JavaScriptで「購読中のブログ」の一覧を表示するスクリプトを書きました。 外部への公開が目的ではなく、自分が確認するためのものです。

仕様

各ブラウザから「購読中のブログ」の画面を表示して、このスクリプトを実行すると、 テキストエリアが追加されて以下の一覧を表示します。

  • ユーザーid
  • ブログのURL
  • 最新記事の見出し
  • 購読中のブログの件数

f:id:splicom:20140313105908j:plain

使い方

  1. 「購読中のブログ」の最後のページ数を確認する
  2. 「購読中のブログ」の画面を開く
  3. 各ブラウザのコンソールからスクリプトを実行する

「購読中のブログ」の最後のページ数を確認する

「購読中のブログ」の最後のページ数を、後ほど出てくるソースのpage_numberに設定してください。 2ページ目以降を開くと分かると思いますが、URLにページ数のパラメータ(page=)があるので、その数字を適当に変更するか、 1ページに表示されるブログの件数が10なので、だいたいの登録数が分かっている方は、そのあたりから割り出しを。

「購読中のブログ」の画面を開く

おそらく「ダッシュボード」の画面でも実行できると思いますが、分かりやすくするため。 当然のことながら、はてなブログにログインしている状態じゃないと動かないので、その念押しの意味もあります。

各ブラウザのコンソールからスクリプトを実行する

スクリプト自体が常用するものではないため、ブックマークレットよりも コンソールから実行した方が良いと思ったので。

IE(Ver.11)

IEの場合はtrim()を使っている都合で、Ver.9以降が必須になります。

ツール → 開発ツール*1 → コンソール

f:id:splicom:20140313111010j:plain

スクリプトをコピーして、Ctrl+Enterまたはウィンドウの右下にある緑の再生ボタン(画像にはありませんが)を押すと実行できます。

Firefox (Ver.27)

メニュー → Web開発 → スクラッチパッド*2

f:id:splicom:20140313111021j:plain

スクリプトをコピーして、「実行」ボタンまたはCtrl+Rを押すと実行できます。

Chrome(Ver.33)

メニュー → ツール → JavaScriptコンソール*3 → Console

f:id:splicom:20140313110000j:plain

スクリプトをコピーしてEnterを押すと実行できます。

注意事項

  • 何百、何千とブログを登録している場合でもおそらく問題ないと思いますが、正しく動作するかは検証できていません。
  • 画面やブラウザの仕様が変わると動作しない可能性があります。

2015/07/08 22:29 追記

右側に表示される「こんなブログもあります」のブログをカウントに含めないようにしました

追記ここまで

ソース

var page_number = 1; // 「購読中のブログ」の最後のページ数
var page_index = 1;
var blog_count = 0;

var header = document.getElementById("main-header");
var textarea = document.createElement("textarea");
textarea.cols = 150;
textarea.rows = 10;
header.appendChild(textarea);

var req = new XMLHttpRequest();

req.onreadystatechange = function() {
  if (req.readyState == 4 && req.status == 200) {
    var dom = document.createElement("dom");
    dom.innerHTML = req.responseText;
    dom.getElementsByClassName("admin-subscribe-wrapper-right").item(0).remove();

    var users = dom.querySelectorAll("a.entry-unit-user-name");
    var entries = dom.querySelectorAll("h3.entry-unit-entry-title");

    for(var j=0; j<users.length; j++) {
      textarea.value += "id:" + users[j].text.trim() + "\n" + users[j] + "\n" + entries[j].innerText.trim() + "\n\n";
      blog_count++;
    }
    page_index++;
    if(page_index <= page_number) {
      var url = "http://blog.hatena.ne.jp/-/antenna?page=" + page_index;
      req.open('GET',url, true);
      req.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
      req.send();
    }else{
      textarea.value += "購読中のブログは" + blog_count + "件です";
      return true;
    }
  }
}

req.open('GET',"http://blog.hatena.ne.jp/-/antenna", true);
req.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8');
req.send();

Firefoxの場合は、以下の行のinnerTextをtextContentに変更してください。

変更前: textarea.value += "id:" + users[j].text.trim() + "\n" + entries[j].innerText.trim() + "\n\n";
変更後: textarea.value += "id:" + users[j].text.trim() + "\n" + entries[j].textContent.trim() + "\n\n";

プロフィールのアイコンも取得してもうちょっと手を入れると、「購読中のブログ」を公開する ページなんてのもつくれる(ただし手動更新)と思います。

*1:ショートカットはF12

*2:ショートカットはShift+F4

*3:ショートカットはCtrl+Shift+J