はてブAPIでwebサービスを作りたい全ての人に向けて書きました

はてブAPIでwebサービスを作りたい全ての人に向けて書きました

日本で人気のwebサービス「はてなブックマーク」のAPIをこれから利用しようと思っている人の力になれたらと思い、はてなブックマークAPIの使い方の(ほぼ)全てをまとめました!

ブックマーク数を取得する

まずは基本的な「ブックマーク数」の取得方法を紹介します。

個別URLのブックマーク数の取得

取得方法

下記のようにURLを組み立てることで、指定したURLのブックマーク数を取得することができます。

GET http://api.b.st-hatena.com/entry.count?url={目的のURL}

例えば、YAHOO! JAPANのトップページのブックマーク数を取得するには、次の通りです。

http://api.b.st-hatena.com/entry.count?url=http://www.yahoo.co.jp リンク

結果は次のように、ブックマーク数がそのままダイレクトで返ってきます。

46

そのURLのブクマ数が0の場合は、0ではなく、空データが返ってくるので処理にご注意下さい。

(データは空)

サンプルプログラム (PHP)

以上を踏まえて作成したPHPのサンプルプログラムが下記です。

PHP

<?php

	// チェックするURL
	$url = 'http://www.yahoo.co.jp/' ;

	// JSONデータを取得
	$count = @file_get_contents( 'http://api.b.st-hatena.com/entry.count?url=' . rawurlencode( $url ) ) ;

	//データが存在しない場合は0扱い
	if( !isset( $count ) || empty( $count ) )
	{
		$count = 0 ;
	}

	// 出力
	echo '<h2>実行結果</h2>' ;
	echo '<dl>' ;
	echo 	'<dt>取得結果</dt>' ;
	echo 		'<dd><mark>' . number_format( $count ) . '</mark></dd>' ;
	echo '</dl>' ;

?>

このコードの動作を確認する

サンプルプログラム (JavaScript)

上記をJavaScriptで実現すると次のようになります。Ajax通信にはjQueryを使用しています。

HTML

<h2>実行結果</h2>
<dl>
	<dt>取得した結果<dt>
		<dd><mark id="result"></mark></dd>
</dl>

JavaScript

// チェックするURL
var url = 'https://www.youtube.com/' ;
 
// Ajax通信
$.ajax({

	url: 'http://api.b.st-hatena.com/entry.count?url=' + encodeURIComponent( url ) ,
	dataType: 'jsonp' ,

	// 取得に成功した時の処理
	success:function( count )
	{
		//データが存在しない場合は0扱い
		if( typeof( count ) == 'undefined' || !count )
		{
			count = 0 ;
		}

		// アラート表示
		// alert( 'カウント数は' + count + 'です!' ) ;

		// ツイートカウントをHTML([ID=result]の要素内)へ書き出す
		document.getElementById( 'result' ).innerHTML = count ;
	} ,

	//取得に失敗した時の処理
	error:function()
	{
		alert("通信に失敗しました…。");
	} ,

	//完了した時の処理
	complete:function()
	{
		return false ;
	}

}) ;

はてなブックマークのAPIがSSL通信に対応していないため、HTTPSで始まるウェブページ上では動作しません。従って、下記デモは通信エラーが発生します。HTTPで始まるウェブページ上では問題なく動作します。

このコードの動作を確認する

webサイトの合計ブックマーク数の取得

「全てのページをチェックする」などと面倒なことをしなくても、webサイトの合計はてブ数を取得するAPIが用意されています。

IXR_Library.phpを読み込む

IXR Library

このAPIを利用するには、XML-RPCという形式でリクエストを送る必要があります。PHP用にそれを容易にするライブラリ「IXR_Library.php」が存在するのでこちらを利用します。下記サイトからダウンロードし、サーバーにアップロードして、requireで読み込んで下さい。

サンプルプログラム

下記が、1サイトの合計ブックマーク数を取得する、PHPのサンプルプログラムです。トップページのURLを指定すればサイト全体の、フォルダのURLを指定すればそのフォルダ内の、合計ブックマーク数を取得します。よかったら参考にしてみて下さい!

PHP

<?php

	// チェックするサイトのURL
	$url = 'https://twitter.com/' ;

	// IXR_Library.phpまでのパス
	$path = './IXR_Library.php' ;

	// エラー判定
	if( !file_exists( $path ) )
	{
		echo '<p>[IXR_Library.php]が[' . $path . ']に存在しないみたいです…。</p>' ;
	}
	else
	{
		// IXR_Libraryの読み込み
		require $path ;

		// インスタンスの作成
		$ixr = new IXR_Client( 'http://b.hatena.ne.jp/xmlrpc' ) ;

		// クエリの指定
		$ixr->query( 'bookmark.getTotalCount' , $url ) ;

		// JSONデータを取得
		$count = $ixr->getResponse() ;

		//データが存在しない場合は0扱い
		if( !isset( $count ) || empty( $count ) )
		{
			$count = 0 ;
		}

		// 出力
		echo '<h2>実行結果</h2>' ;
		echo '<dl>' ;
		echo 	'<dt>調べたURL</dt>' ;
		echo 		'<dd><a href="' . $url . '" target="_blank">' . $url . '</a></dd>' ;
		echo 	'<dt>取得結果</dt>' ;
		echo 		'<dd><mark>' . number_format( $count ) . '</mark></dd>' ;
		echo '</dl>' ;

	}

?>

このコードの動作を確認する

RSSフィードを取得する

はてブのエントリーを使ってニュースサイトなどを作成するには、RSSを読み込むことになります。カテゴリー別など条件を付けてRSSを読み込む方法を紹介します。下記の基本URLの後に、紹介していくパスを追加して下さい。

GET http://b.hatena.ne.jp

人気エントリー

いわゆる「ホッテントリ」を読み込む方法です。人気記事を収集するwebサービスで有用ですね。

全体
/hotentry?mode=rss
カテゴリ別
/hotentry/{カテゴリID}.rss
social … 世の中
economics … 政治と経済
life … 暮らし
knowledge … 学び
it … テクノロジー
fun … おもしろ
entertainment … エンタメ
game … アニメとゲーム

新着エントリー

全ての記事を集めたい場合は、新着記事を次々と収集する必要がありますよね。その場合はこちらが有用です。

全体
/entrylist?mode=rss
カテゴリ別
/entrylist/{カテゴリID}?mode=rss
social … 世の中
economics … 政治と経済
life … 暮らし
knowledge … 学び
it … テクノロジー
fun … おもしろ
entertainment … エンタメ
game … アニメとゲーム

オプション

上記URLにパラメータを追加することで、新着エントリーフィードの出力条件を絞り込むことができます。

新着順
sort=recent
人気順
sort=popular
最低はてブ数
threshold={数字}

URLの例

例えば500以上のブックマークがある人気エントリーのみを収集したい場合は、下記のURLを指定します。

http://b.hatena.ne.jp/entrylist?mode=rss&threshold=500 リンク

これは盲点なのですが、thresholdを指定しない場合、デフォルトでブックマーク数が3以上のエントリーが出力されます。全てのエントリーを出力したい場合は、1を指定することで可能です。

http://b.hatena.ne.jp/entrylist?mode=rss&threshold=1 リンク

特定ワード・タグ・タイトルで絞り込む

特定の話題に絞った記事リストを作りたい場合に有用です。

キーワード
/search/text?q={キーワード}&mode=rss
タグ
/search/tag?q={キーワード}&mode=rss
タイトル
/search/title?q={キーワード}&mode=rss

オプション

上記URLにパラメータを追加することで、出力条件を絞り込むことができます。新着エントリーとは微妙に違うのでご注意下さい。

新着順
sort=recent
人気順
sort=popular
最低はてブ数
threshold={数字}
開始日
date_begin={YYYY-MM-DD}
終了日
date_end={YYYY-MM-DD}
セーフサーチ
safe={on / off}

特定URLで絞り込む

例えば、特定サイトのURLを入力するとそのサイトの人気エントリーランキングを出力してくれるwebサービスとかを作る時に便利ですねー。http://example.comと指定すれば1つのサイトのみですが、example.comと指定すれば、a.example.comb.example.comなどのサブドメインを横断検索することができます。

人気順
/entrylist?url={URL}&mode=rss&sort=count
タグ
/entrylist?url={URL}&mode=rss&sort=eid
タイトル
/entrylist?url={URL}&mode=rss&sort=recent

ユーザーフィードの取得

これまでは全体のエントリー情報を取得しました。今度は個々のユーザーのブックマーク情報が含まれたフィードを取得してみましょう。そのURLは次のように組み立てます。

GET http://b.hatena.ne.jp/{ユーザーID}/rss?of={ページ}

1ページで20件ずつ取得することができます。ページの指定は20単位で行ないます。例えば2ページ目(21〜40件目)を取得したい場合はof=20を、3ページ目(41〜60件目)を取得したい場合はof=40を指定して下さい。このofというのは、offsetのことですね。

http://b.hatena.ne.jp/syncer/rss?of=40 リンク

キャッシュ対策について

個人フィードはキャッシュが働く関係で、最新の情報を取得できない場合があります。そのため、末尾に適当なパラメータを付けることでキャッシュを働かせず、常に最新の情報を取得するようにしましょう。例えば、PHPだったらtime()でUNIX TIMESTAMPを付けるのが便利です。

http://b.hatena.ne.jp/syncer/rss?of=40&14023238743 リンク

サンプルプログラム

さて、はてブのフィードを様々な条件で取得する方法が分かったと思います。続いては、取得したフィードをサーバーサイドで解析する方法を紹介します。サンプルプログラムの言語はPHPです。タイトルとリンクは(string)で強制的に型変換しておくとデータが崩れません。よろしければ参考にしてみて下さい!

パブリックフィードの取得

PHP

<?php

	// 取得するフィードURLを指定
	$feed = 'http://b.hatena.ne.jp/hotentry?mode=rss' ;

	// フィードを取得してオブジェクトに変換
	$obj = simplexml_load_string( @file_get_contents( $feed ) ) ;
 
	// エラー判定
	if( !$obj || !isset( $obj->item ) || empty( $obj->item ) )
	{
		echo '<p><a href="' . $feed . '" target="_blank">フィード</a>を取得できませんでした…。</p>' ;
	}
	else
	{
		// HTML
		$html = '' ;

		// 個々のエントリーを読み込んでいく
		foreach( $obj->item as $item )
		{
			// 各値の整理
			$url = (string)$item->link ;									// URL
			$date = $item->children( 'dc' , true )->date ;					// エントリーの日付
			$title = (string)$item->title ;									// タイトル
			$category = $item->children( 'dc' , true )->subject ;			// カテゴリ
			$count = $item->children( 'hatena' , true )->bookmarkcount ;	// ブクマ数

			// 日付の整形
			$date = date( 'Y/m/d H:i:s' , strtotime( $date ) ) ;

			// HTML
			$html .= '<dd>' ;
			$html .= 	'[' . $category . '] - ' . $title . ' (' . $date . ') ' . $count . 'users' ;
			$html .= 	'<br><a href="' . $url . '" target="_blank" rel="nofollow">' . $url . '</a>' ;
			$html .= '</dd>' ;
		}

		// 出力
		echo '<h2>実行結果</h2>' ;
		echo '<dl>' ;
		echo 	'<dt>取得したフィード</dt>' ;
		echo 		'<dd><a href="' . $feed . '" target="_blank">' . $feed . '</a></dd>' ;
		echo 	'<dt>取得結果</dt>' ;
		echo 		$html ;
		echo '</dl>' ;
	}

?>

このコードの動作を確認する

個人フィードの取得

PHP

<?php

	// 取得するフィードのURLを指定
	$feed = 'http://b.hatena.ne.jp/syncer/rss' ;
  
	// キャッシュを防止するため、パラメータを追加する
	$param = explode( '?' , $feed ) ;
	$feed .= ( isset($param[1] ) && !empty( $param[1]) ) ? '&' . time() : '?' . time() ;

	// フィードを取得してオブジェクトに変換
	$obj = simplexml_load_string( @file_get_contents( $feed ) ) ;
 
	// エラー判定
	if( !$obj || !isset( $obj->item ) || empty( $obj->item ) || !isset( $obj->channel ) || empty( $obj->channel ) )
	{
		echo '<p><a href="' . $feed . '" target="_blank">フィード</a>を取得できませんでした…。</p>' ;
	}
	else
	{
		// HTML
		$html_1 = '' ;
		$html_2 = '' ;

		// チャンネル情報
		$channel = (string)$obj->channel->title ;												// ユーザー名
		$count = $obj->channel->children( 'opensearch' , true )->totalResults ;					// 総ブックマーク数
		$link = (string)$obj->channel->link ;													// ユーザー画面のURL

		// チャンネル情報のHTML
		$html_1 .= '<a href="' . $link . '" target="_blank">' . $channel . '</a> (総ブックマーク数は' . $count . ')' ;

		// 個々のエントリーを読み込んでいく
		foreach( $obj->item as $item )
		{
			// 各値の整理
			$url = (string)$item->link ;														// URL
			$date = $item->children( 'dc' , true )->date ;										// エントリーの日付
			$comment = ( isset($item->description) ) ? $item->description : '' ;				// コメント
			$title = (string)$item->title ;	 													// タイトル
			$tags = implode( ',' , (array)$item->children( 'dc' , true )->subject ) ;			// タグ

			// 日付の整形
			$date = date( 'Y/m/d H:i:s' , strtotime( $date ) ) ;

			// HTML
			$html_2 .= '<dd>' ;
			$html_2 .= 	$title . ' (' . $date . ')' ;
			$html_2 .= 	'<br>' . $tags . '「' . $comment . '」' ;
			$html_2 .= 	'<br><a href="' . $url . '" target="_blank" rel="nofollow">' . $url . '</a>' ;
			$html_2 .= '</dd>' ;
		}

		// 出力
		echo '<h2>実行結果</h2>' ;
		echo '<dl>' ;
		echo 	'<dt>ユーザー情報</dt>' ;
		echo 		'<dd>' . $html_1 . '</dd>' ;
		echo 	'<dt>フィードのURL</dt>' ;
		echo 		'<dd><a href="' . $feed . '" target="_blank">' . $feed . '</a></dd>' ;
		echo 	'<dt>取得結果</dt>' ;
		echo 		$html_2 ;
		echo '</dl>' ;
	}

?>

このコードの動作を確認する

エントリー情報を取得する

さて、前章ではフィードを利用して、エントリーの一覧を取得・解析する方法を紹介しました。続いては、個々のエントリー情報、はてブコメントなどを詳しく取得・解析する方法について紹介します。下記の公式APIを利用します。

リクエスト方法

エントリー情報を取得するためのリクエストURLは次のように組み立てます。

GET http://b.hatena.ne.jp/entry/jsonlite/?url={目的のURL}

例えば、このサイトのこの記事の情報を取得するには下記のように指定します。アクセスしてみて下さい。

http://b.hatena.ne.jp/entry/jsonlite/?url=http://syncer.jp/hatebu-api-matome リンク

ちなみに、指定するURLはPHPだったらrawurlencode()を使ってエンコード(特殊文字変換)しておきましょう。

http://b.hatena.ne.jp/entry/jsonlite/?url=http%3A%2F%2Fsyncer.jp%2Fhatebu-api-matome リンク

取得できるJSON

アクセスすると、下記のJSONデータを取得することができます。コメントがある、ないに関係なく、bookmarksプロパティに個人個人のユーザーのブクマ情報が配列で含まれます。下記は「okyawa」「kimyan」さんの計2つのブクマのみを表示してますが、100個、1000個となるとデータは膨大になりますねー。青文字は説明用に付けたコメントです。

JSON

{
	"count": "66",
	"bookmarks": [
		{
			"timestamp": "2014/06/16 12:34:43",
			"comment": "",
			"user": "okyawa",
			"tags": [
				"schema.org",
				"google",
				"SEO",
				"Microdata"
			]
		},
		{
			"timestamp": "2014/06/16 00:30:36",
			"comment": "Googleリッチスニペット対策!初心者向けにスキーマ(http://t.co/8WBe4ZB7jP)のマークアップ方法を徹底的に教えるよ! こういうの参考にして、自分なりにもまとめていかないと。 細かいけどきちんと資料化する。",
			"user": "kimyan",
			"tags": [

			]
		}
	],
	"url": "http://syncer.jp/schema-entering",
	"eid": "199719462",
	"title": "Googleリッチスニペット対策!初心者向けにスキーマ(Schema.org)のマークアップ方法を徹底的に教えるよ! - Syncer",
	"screenshot": "http://screenshot.hatena.ne.jp/images/200x150/9/f/4/7/2/ba04f38bd7becdc15f98ddc98bded4996ec.jpg",
	"entry_url": "http://b.hatena.ne.jp/entry/syncer.jp/schema-entering"
}

各プロパティの内容

JSONデータのそれぞれのプロパティは、下記のデータを含んでいます。

count
ブックマーク数。
bookmarks
ユーザー別のブックマーク情報。
timestamp
ユーザーがブックマークした日付。
comment
ユーザーのコメント。
user
ユーザーのID。
tags
ユーザーがブックマーク時に付けたタグ。
url
エントリーのURL。
eid
エントリーのID。
title
エントリーのタイトル。
screenshot
スクリーンショット画像のURL。
entry_url
エントリーページのURL。

サンプルプログラム

PHPの場合

それではPHPを使って、はてブコメントなどを出力してみましょう。下記がサンプルプログラムです。非常にシンプルなものですが、個々のデータにアクセスする方法を参考にしていただければ…、と思います!

PHP

<?php

	// エントリー情報を取得するURL
	$entry = 'http://syncer.jp/schema-entering' ;

	// JSONデータを取得してオブジェクトに変換
	$json = @file_get_contents( 'http://b.hatena.ne.jp/entry/jsonlite/?url=' . rawurlencode( $entry ) ) ;

	// 取得したJSONをオブジェクトに変換する
	$obj = json_decode( $json ) ;

	// エラー判定
	if( !$obj || !isset($obj->title) || !isset($obj->url) || !isset($obj->eid) || !isset($obj->screenshot) || !isset($obj->entry_url) )
	{
		echo '<p>エントリー情報を取得できませんでした…。</p>' ;
	}
	else
	{
		// HTML
		$html = '' ;

		// 情報を取得
		$title = $obj->title ;				// タイトル
		$url = $obj->url ;					// URL
		$id = $obj->eid ;					// エントリーID
		$img = $obj->screenshot ;			// スクリーンショット画像のURL
		$page = $obj->entry_url ;			// はてブコメント欄のURL

		// エントリー情報
		$html .= '<h2>エントリー情報</h2>' ;
		$html .= '<dl>' ;
		$html .= 	'<dt>タイトル</dt>' ;
		$html .= 		'<dd>' . $title . '</dd>' ;
		$html .= 	'<dt>URLアドレス</dt>' ;
		$html .= 		'<dd><a href="' . $url . '" target="_blank">' . $url . '</a></dd>' ;
		$html .= 	'<dt>エントリーページ</dt>' ;
		$html .= 		'<dd><a href="' . $page . '" target="_blank">' . $page . '</a></dd>' ;
		$html .= 	'<dt>スクリーンショット</dt>' ;
		$html .= 		'<dd><img src="' . $img . '" style="max-width:100%"></dd>' ;

		//個々のブクマ(コメント)を取得していく
		if( isset($obj->bookmarks) && !empty($obj->bookmarks) )
		{
			// HTML
			$html .= 	'<dt>各ブックマーク</dt>' ;

			// [$obj->bookmarks]の配列をループ
			foreach( $obj->bookmarks as $item )
			{
				// 各情報
				$user = $item->user ;																						// ユーザーID
				$icon = 'http://cdn1.www.st-hatena.com/users/' . substr( $user , 0 , 2 ) . '/' . $user . '/profile.gif' ;	// ユーザーアイコン
				$com = ( $item->comment ) ? ' 「' . $item->comment . '」' : '' ;											// コメント
				$date = $item->timestamp ;																					// ブクマした日付
				$tags = implode( ',' , (array)$item->tags ) ;																// タグ一覧
 
				// HTML
				$html .= '<dd><img src="' . $icon . '" width="30" height="30"> ' . $user . $com . ' (' . $date . ') ' . $tags . '</dd>' ;
			}
		}

		$html .= '</dl>' ;

		// 出力
		echo $html ;
	}

?>

このコードの動作を確認する

JavaScriptの場合

ついでにサーバーサイドではなく、クライエントサイド(JavaScript)で同じようにエントリー情報を取得・出力する方法を紹介します。Ajax通信にはjQueryを利用するので、あらかじめ読み込んで下さい。なお、はてなブックマークのAPIがSSL通信に対応していないため、当サイト(HTTPSから始まるウェブページ)では、通信エラーが発生します。HTTPから始まるサイトなら、正常に動作します。

HTML

<h2>実行結果</h2>
<dl>
	<dt>取得した結果<dt>
		<dd><mark id="result"></mark></dd>
</dl>

JavaScript

// エントリー情報を取得するURL
var entry = 'http://syncer.jp/schema-entering' ;
 
//Ajax通信
$.ajax({
	url: 'http://b.hatena.ne.jp/entry/jsonlite/?url=' + encodeURIComponent( entry ) ,
	dataType: 'jsonp' ,

	success:function( obj )
	{
		// 各情報
		var title = obj.title ;			// タイトル
		var url = obj.url ;				// URL
		var id = obj.eid ;				// エントリーID
		var img = obj.screenshot ;		// スクリーンショット画像のURL
		var page = obj.entry_url ;		// はてブコメント欄のURL
 
		// [id=result]の要素内に出力
		$( '#result' ).append( '<p><a href="' + url + '">' + title + '</a></p><p><img src="' + img + '"><br>(<a href="' + page + '">コメント一覧ページはこちら</a>)</p>' ) ;
 
		//個々のブクマ(コメント)を取得していく
		for( var i=0 , l=obj.bookmarks.length ; l > i ; i++ )
		{
			var user = obj.bookmarks[i].user ;																			// ユーザーID
			var icon = 'http://cdn1.www.st-hatena.com/users/' + user.substr( 0 , 2 ) + '/' + user + '/profile.gif' ;	// アイコン
			var com = obj.bookmarks[i].comment ;																		// コメント
			var date = obj.bookmarks[i].timestamp ;																		// ブクマした日付
			var tags = obj.bookmarks[i].tags.join( ',' ) ;																// タグ一覧
 
			//出力
			$( '#result' ).append( '<p><img src="' + icon + '" width="30" height="30">' + user + ' ' + com + '(' + date + ') ' + tags + '</p>' ) ;
		}
 
	},

	error:function()
	{
		alert( '通信に失敗しました…。' ) ;
	} ,

	complete:function()
	{
		return false;
	}
});

このコードの動作を確認する

プロフィールアイコンを取得する

はてブユーザーのプロフィールアイコンを取得する方法を紹介します。

アイコン画像のURLについて

はてブユーザーのアイコン
はてブユーザーのアイコン

はてブユーザーのプロフィールアイコンを利用したい場合、アイコン画像のURLは下記の通りに指定します。

GET http://cdn1.www.st-hatena.com/users/{ユーザーIDの頭2文字}/{ユーザーID}/profile.gif

例えば、私のはてなブックマークのIDはsyncerなので、アイコン画像のURLは下記の通りとなります。試しに右側のリンクからURLにアクセスしてみて下さいね。画像サイズは64x64です。

http://cdn1.www.st-hatena.com/users/sy/syncer/profile.gif リンク

サイズを調整する方法

ファイル名のprofileのサフィックス(接尾辞)に文字を加えることで、画像サイズを調整することができます。例えば_sを付けることで、画像サイズが16x16になります。

http://cdn1.www.st-hatena.com/users/sy/syncer/profile_s.gif リンク

_lを付けると32x32になります。正直、この細かい画像サイズ指定が役に立つことはないとは思いますが…。

http://cdn1.www.st-hatena.com/users/sy/syncer/profile_l.gif リンク

サンプルプログラム

ID名からプロフィールアイコンのURLを取得するサンプルプログラムを紹介します。

PHP

PHP

<?php

	// ユーザーのID
	$id = 'syncer' ;

	// サフィックス (サイズ指定 / [_l]=32x32、[_s]=16x16)
	$size = '' ;

	// URLを取得
	$url = 'http://cdn1.www.st-hatena.com/users/' . substr( $id , 0 , 2 ) . '/' . $id . '/profile' . $size . '.gif' ;

	// 出力
	echo '<h2>実行結果</h2>' ;
	echo '<dl>' ;
	echo 	'<dt>URL</dt>' ;
	echo 		'<dd>' . $url . '</dd>' ;
	echo 	'<dt>画像</dt>' ;
	echo 		'<dd><img src="' . $url . '"></dd>' ;
	echo '</dl>' ;

?>

このコードの動作を確認する

JavaScript

PHP

<h2>実行結果</h2>
<dl>
	<dt>URL<dt>
		<dd><span id="url"></span></dd>
	<dt>画像<dt>
		<dd><span id="result"></span></dd>
</dl>

PHP

// ID
var id = 'syncer' ;

// サフィックス (サイズ指定 / [_l]=32x32、[_s]=16x16)
var size = '' ;

// URLを取得
var url = 'http://cdn1.www.st-hatena.com/users/' + id.substr( 0 , 2 ) + '/' + id + '/profile' + size + '.gif' ;

// [id=url]にURLアドレスを出力
document.getElementById( 'url' ).innerHTML = url ;

// [id=result]に画像を出力
document.getElementById( 'result' ).innerHTML = '<img src="' + url + '">' ;

このコードの動作を確認する

フォロワー数を取得する

はてブユーザーのフォロワー(お気に入られ)数を取得し、webサービスに組み込む方法を紹介します。

フォロワー数を取得できるURL

はてブのフォロワー数
はてブのフォロワー数

あまり機能している印象はないんですが、「はてブ」にも一応フォローシステムがあります。TwitterやYoutubeみたいに、フォロワー数をブログのプロフィール欄なんかに表示したい時がありますよね。取得するための公式APIはありませんが、下記のページから取得することができます。

GET http://b.hatena.ne.jp/{ユーザーID}/sidebar

サンプルプログラム

公式の機能ではないので、取得間隔は1日ごとくらいにしておきましょう。下記は1日間隔で「はてブ」のフォロワー数を取得し、自分のサーバーの指定ファイルに記録するPHPプログラムです。プログラムで書き出すキャッシュファイルのディレクトリはパーミッションで書き込み権限を有効にしておいて下さいね。

PHP

<?php

	// はてなID
	$id = 'syncer' ;

	// フォロワー数を記録するキャッシュファイル
	$file = './hatena_follower.txt' ;

	// 前回取得から1日経過してた場合のみ情報を取得
	if( !file_exists($file) || ( ($_SERVER["REQUEST_TIME"]-86400) > filemtime($file) ) )
	{
		// スクレイピングでHTMLを取得
		$code_1 = @file_get_contents( 'http://b.hatena.ne.jp/' . $id . '/sidebar' ) ;

		// フォロワー数の部分を取得する
		$code_2 = explode( 'a href="/' . $id . '/follower">' , $code_1 ) ;
		$code_3 = explode( '</a></li>' , $code_2[1] ) ;
		$follower = $code_3[0] ;

		// キャッシュファイルに記録
		@file_put_contents( $file , $follower ) ;
	}

	//1日経過してない場合は記録してあるフォロワー数を取得
	else
	{
		$follower = @file_get_contents( $file ) ;
	}

	// フォロワー数が上手く取得できない場合
	if( !$follower )
	{
		$follower = 0 ;
	}

	// フォロワー数を出力
	echo '<h2>実行結果</h2>' ;
	echo '<dl>' ;
	echo 	'<dt>' . $id . 'さんのフォロワー数</dt>' ;
	echo 		'<dd>' . $follower . '</dd>' ;
	echo '</dl>' ;

?>

このコードの動作を確認する

はてなスター数を取得する

はてブユーザーのコメントを扱う場合、「コメントに付いたスターの数を取得したい」と思うことがありますよね?例えば人気コメントなんかを表示するには、はてなスター数を元にデータを整形しなければなりません。

Hatena Developer Center内のページ。はてなスターAPIを利用するための公式ドキュメントがあります。 http://developer.hatena.ne.jp/ja/documents/star リンク

ユーザーが獲得した合計スター数を取得する

取得方法

ブコメに付いたはてなスター
ブコメに付いたはてなスター

まず基本として、あるURL(ブログ)に付いた「はてなスター数」を取得するには下記のようにURLを組み立てます。

GET http://s.hatena.ne.jp/blog.json?uri={目的のURL}

本来、はてなブログに付いたスター数をカウントするAPIですが、実はブコメに付いたスター数もカウントしてくれるのをご存知でしょうか?あるユーザーがこれまでにブコメで獲得したスター数の合計を取得するには、URLの部分に、マイページのURLを指定します。URLはエンコードして下さいね。

http://b.hatena.ne.jp/syncer/ リンク

例えば、私がこれまで稼いだ合計スター数を取得してみましょう。URLは下記の通り指定します。あとで再度触れますが、指定するURLはエンコードしておきましょう。

http://s.hatena.ne.jp/blog.json?uri=http%3A%2F%2Fb.hatena.ne.jp%2Fsyncer%2F リンク

取得できるJSON

リクエストすると、下記のようなJSONデータを取得することができます。このうち、countプロパティに、色別のスター数のデータが入っています。star_countプロパティが、全スターの合計数です。下記の例では、今まで合計83,258個のスターを獲得してきたというわけですね。

ちなみに、その種類のスター数が0個の場合、0というデータではなく、プロパティ自体が存在しないのでご注意下さい。

JSON

{"count":{"green":409,"blue":5,"red":24,"purple":3,"yellow":"82817"},"title":"\u306f\u3066\u306a\u30b9\u30bf\u30fc\u65e5\u8a18","uri":"http://d.hatena.ne.jp/hatenastar/","star_count":83258}

個別のブックマークに付いたスター数を取得する

取得方法

今度は合計ではなく、個別のコメントに付いた「はてなスター」の数を取得してみましょう。合計数を取得した時のものとは違って、リクエストURLは下記になります。

GET http://s.hatena.com/entry.json?uri={ブコメのパーマリンク}

ブコメのパーマリンク
ブコメのパーマリンク

ブコメのパーマリンクは、コメント一覧画面の名前のリンクをクリックした時のものです。例えば下記です。

http://b.hatena.ne.jp/syncer/20150717#bookmark-228023 リンク

はてブのエントリー情報から組み立てる場合は下記の通り、材料を利用します。

http://b.hatena.ne.jp/{ユーザーID}/{コメントの日付(YYYYMMDD)}#bookmark-{エントリーID}

例えば「arayutw」のコメントのパーマリンクは次の通りになります。なお、エントリーIDはJSONデータのeidプロパティに含まれています。

http://b.hatena.ne.jp/arayutw/20140616#bookmark-199719462

ブコメの「はてなスター」の数を取得するには、このURLを指定すればいいというわけですねー。ただ注意点があって、#を含むため「URLエンコード(特殊文字変換)」をしてやる必要があります。URLエンコードをするには、PHPならrawurlencode()を使います。

http://s.hatena.com/entry.json?uri=http%3A%2F%2Fb.hatena.ne.jp%2Fsyncer%2F20150717%23bookmark-228023 リンク

取得できるJSON

リクエストすると、下記のようなJSONデータを取得することができます。

JSON

{
	"entries": [
		{
			"stars": [
				{
					"quote": "",
					"name": "cropwataru"
				},
				{
					"quote": "",
					"name": "akihiko810"
				},
				{
					"quote": "",
					"name": "enkunkun"
				}
			],
			"can_comment": 0,
			"colored_stars": [
				{
					"stars": [
						{
							"quote": "",
							"name": "netcraft"
						}
					],
					"color": "red"
				},
				{
					"stars": [
						{
							"quote": "",
							"name": "netcraft"
						}
					],
					"color": "green"
				}
			],
			"uri": "http://b.hatena.ne.jp/arayutw/20140614#bookmark-199497578"
		}
	],
	"can_comment": 0
}

各項目の解説は下記の通りです。

stars
イエロースターを付けたユーザーの情報。
colored_stars
カラースターを付けたユーザーの情報。
colored_stars->color
スターの色。
quote
コメントを引用した場合、その引用部分。
name
ユーザーID。
uri
スターの対象URL。

ブコメのスター数の算出方法

合計数を取得した時とは違って、数を算出するのが面倒です。starsのプロパティにはイエロースターを付けた全ユーザーが配列となって含まれています。この場合、「cropwataru」「akihiko810」「enkunkun」さんから1つずつ、合計3つのイエロースターをもらったということです。

ちなみに同じ人が複数、スターを付けた場合は、次のようにダブる形になります。この例では「enkunkun」さんが3個、スターを付与しています。

JSON

{
	"entries": [
		{
			"stars": [
				{
					"quote": "",
					"name": "enkunkun"
				},
				{
					"quote": "",
					"name": "enkunkun"
				},
				{
					"quote": "",
					"name": "enkunkun"
				}
			]
		}
	]
}

カラースターの算出方法

カラースターの場合は、colored_starsプロパティの中に、それぞれの色のデータが配列となって入っています。例えば下記は、colorプロパティにあるred、つまりレッドスターを、「netcraft」さんからもらっているということになります。グリーンスターの数も同じように算出します。グリーンスターの場合は「yamada」「tarou」さんからもらっていて合計2つです。

JSON

{
	"entries": [
		{
			"colored_stars": [
				{
					"stars": [
						{
							"quote": "",
							"name": "netcraft"
						}
					],
					"color": "red"
				},
				{
					"stars": [
						{
							"quote": "",
							"name": "yamada"
						},
						{
							"quote": "",
							"name": "tarou"
						}
					],
					"color": "green"
				}
			]
		}
	]
}

サンプルプログラム

はてなスター数を取得するためのサンプルプログラムを作成してみました。スペースの関係上、最低限のことしかしてませんが、参考にしたり、カスタマイズの下地としてよろしければご利用下さい!

ユーザーの合計はてなスター数を取得する

PHP

<?php

	// ユーザーページのURLを指定
	$user = 'http://b.hatena.ne.jp/syncer/' ;

	// JSONデータを取得
	$json = @file_get_contents( 'http://s.hatena.ne.jp/blog.json?uri=' . rawurlencode( $user ) ) ;

	// オブジェクトに変換
	$obj = json_decode( $json ) ;

	// それぞれの合計スター数を算出(0の場合に備えて三項演算子で条件分け)
	$red = ( isset( $obj->count->red ) ) ? $obj->count->red : 0 ;
	$green = ( isset( $obj->count->green ) ) ? $obj->count->green : 0 ;
	$yellow = ( isset( $obj->count->yellow ) ) ? $obj->count->yellow : 0 ;
	$blue = ( isset( $obj->count->blue ) ) ? $obj->count->blue : 0 ;
	$purple = ( isset( $obj->count->purple ) ) ? $obj->count->purple : 0 ;
	$all = ( isset( $obj->star_count ) ) ? $obj->star_count : 0 ;

	// 出力する
	echo '<h2>実行結果</h2>' ;
	echo '<dl>' ;
	echo 	'<dt>ユーザー</dt>' ;
	echo 		'<dd><a href="' . $user . '" target="_blank">' . $user . '</a></dd>' ;
	echo 	'<dt>黄</dt>' ;
	echo 		'<dd>' . $yellow . '個</dd>' ;
	echo 	'<dt>緑</dt>' ;
	echo 		'<dd>' . $green . '個</dd>' ;
	echo 	'<dt>赤</dt>' ;
	echo 		'<dd>' . $red . '個</dd>' ;
	echo 	'<dt>青</dt>' ;
	echo 		'<dd>' . $blue . '個</dd>' ;
	echo 	'<dt>紫</dt>' ;
	echo 		'<dd>' . $purple . '個</dd>' ;
	echo 	'<dt>合計</dt>' ;
	echo 		'<dd>' . $all . '個</dd>' ;
	echo '</dl>' ;

?>

このコードの動作を確認する

個々の「はてブコメント」のスター数を取得する

PHP

<?php

	// ブコメのパーマリンクを指定
	$bukome = 'http://b.hatena.ne.jp/syncer/20150717#bookmark-228023' ;

	// JSONデータを取得してそのままオブジェクト形式に変換
	$json = @file_get_contents( 'http://s.hatena.com/entry.json?uri=' . rawurlencode( $bukome ) ) ;

	// オブジェクトに変換
	$obj = json_decode( $json ) ;

	// エラー判定
	if( !$obj )
	{
		echo '<p>スター数を取得できませんでした…。</p>' ;
	}
	else
	{
		// 黄色スター数を算出 (0の場合に備えて条件分け)
		$yellow = ( isset($obj->entries[0]->stars) ) ? count( (array)$obj->entries[0]->stars ) : 0 ;

		// カラースター数を記録する配列
		$color = array(
			'green' => 0 ,
			'red' => 0 ,
			'blue' => 0 ,
			'purple' => 0 ,
		) ;

		// カラースター数をチェック
		if( isset($obj->entries[0]->colored_stars) && !empty($obj->entries[0]->colored_stars) )
		{
			foreach( $obj->entries[0]->colored_stars as $item )
			{
				$color[ $item->color ] = ( isset($item->stars) ) ? count( (array)$item->stars ) : 0 ;
			}
		}

		// 合計スター数を算出
		$all = $yellow + $color['red'] + $color['blue'] + $color['green'] + $color['purple'] ;

		// 出力する
		echo '<h2>実行結果</h2>' ;
		echo '<dl>' ;
		echo 	'<dt>対象のコメント</dt>' ;
		echo 		'<dd><a href="' . $bukome . '" target="_blank">' . $bukome . '</a></dd>' ;
		echo 	'<dt>黄</dt>' ;
		echo 		'<dd>' . $yellow . '個</dd>' ;
		echo 	'<dt>緑</dt>' ;
		echo 		'<dd>' . $color['green'] . '個</dd>' ;
		echo 	'<dt>赤</dt>' ;
		echo 		'<dd>' . $color['red'] . '個</dd>' ;
		echo 	'<dt>青</dt>' ;
		echo 		'<dd>' . $color['blue'] . '個</dd>' ;
		echo 	'<dt>紫</dt>' ;
		echo 		'<dd>' . $color['purple'] . '個</dd>' ;
		echo 	'<dt>合計</dt>' ;
		echo 		'<dd>' . $all . '個</dd>' ;
		echo '</dl>' ;
	}
?>

このコードの動作を確認する

OAuth認証をする

2014年10月頃まで、このホームページのコメント欄では、はてなアカウントを利用してユーザー認証をするシステムがありました。他には有名どころでいえばGunosyで「はてなアカウント」を使った認証システムがありますね。その認証システムを実装する方法をサンプルプログラムと一緒に紹介します。

アプリケーションを登録する

はてなのアプリケーションを登録する
はてなのアプリケーションを登録する

認証システムを作成するには、はてなのwebサーバー上にアプリケーションを登録する必要があります。先ほど紹介したURLにアクセスし「OAuth開発者向け設定ページ」というリンクから、アプリケーションを登録して下さい。パスワードチェック後、画面一番下に「新しいアプリケーションの追加」というボタンがあるので、そこから行ないます。

アプリケーションの情報を入力

アプリ情報の入力
アプリ情報の入力

簡単に見ていきましょう。アプリの登録は簡単です。まずはアプリ名、アプリの説明、アプリがあるURL(自分のブログ・ホームページ)を入力します。ちなみにアプリケーションロゴ・アプリケーションアイコンは登録しようとしてもエラーが出てできないので、無視して下さい。

コンシューマーキーとコンシューマーシークレットを確認

アプリのキーとシークレット
アプリのキーとシークレット

続いて、画面中断にある「コンシューマーキー(OAuth Consumer Key)」「コンシューマーシークレット(OAuth Consumer Secret)」を確認(メモ)します。

アプリのパーミッションを設定

アプリのパーミッションを設定する
アプリのパーミッションを設定する

続いてアプリの権限を設定します。必要だと思う権限にチェックを入れて下さい。例えばこのホームページのコメント欄の場合は、ユーザーの認証を行なうだけなのでread_publicのみの設定です。アプリを通してブックマークの追加・削除をしたい場合はwrite_publicにもチェックが必要です。

アプリの「現在の状態」を確認する

アプリのステータスを確認する
アプリのステータスを確認する

最後に念のため、アプリのステータスを確認して下さい。「状態」が「有効」になっていれば大丈夫です。問題がなければ「変更する」をクリックしてアプリ登録は完了でございます。

はてなの認証システムを作成する

早速ではありますが、はてなの認証システムを通して、ユーザーの「アクセストークン」「アクセストークンシークレット」を取得してみましょう。この「アクセストークン」「アクセストークンシークレット」を利用すると、ブックマークの追加・削除ができるようになります。

OAuthリクエスト用の関数

ざっくりとした説明ですが、はてなの認証はOAuth1.0という規格に沿っています。このOAuth1.0はリクエストをする際に、パラメータに合わせて「署名」を作る必要があります。この「署名」を作るための関数が下記です。$consumer_key$consumer_secretを設定して下さい。$callback_urlには、このライブラリではなく、このライブラリを呼び出すプログラムを設置するURLを指定します。通常は変更しなくても大丈夫ですが、上手くいかない場合は直接、指定して下さい。

内容を現時点で詳しく理解する必要はないと思います。おまじないのようなものだと思って下さい。この2つの関数をいつでも呼び出せるようにしておいて下さいね。

PHP

<?php

// OAuthリクエスト用の関数
function hatena_oauth( $request_url , $method , $params_b , $response_header=0 )
{
	// 設定項目
	$consumer_key = '' ;																							// コンシューマーキー
	$consumer_secret = '' ;	 																			// コンシューマーシークレット
	$callback_url = ( !isset($_SERVER['HTTPS']) || empty($_SERVER['HTTPS']) ? 'http://' : 'https://' ) . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'] ;		// このプログラムを設置するURL

	// リクエスト用のパラメータ
	$params_a = array
	(
		'oauth_callback' => $callback_url ,
		'oauth_consumer_key' => $consumer_key ,
		'oauth_nonce' => md5( microtime() ) ,
		'oauth_signature_method' => 'HMAC-SHA1' ,
		'oauth_timestamp' => time() ,
		'oauth_version' => '1.0' ,
	);

	// アクセストークンなど取得時と、データ取得時での差異をちょこちょこと調整する
	if( isset( $params_b['oauth_token'] ) )
	{
		$params_a['oauth_token'] = $params_b['oauth_token'] ;
		unset( $params_b['oauth_token'] , $params_a['oauth_callback'] ) ;
	}

	if( isset( $params_b['oauth_token_secret'] ) )
	{
		$oauth_token_secret = $params_b['oauth_token_secret'] ;
		unset( $params_b['oauth_token_secret'] ) ;
	}
	else
	{
		$oauth_token_secret = '' ;
	}

	if( isset($params_b['oauth_verifier']) )
	{
		$params_a['oauth_verifier'] = $params_b['oauth_verifier'] ;
		unset( $params_b['oauth_verifier'] ) ;
	}

	// リクエストボディの完成
	$request_body = http_build_query( $params_b ) ;

	// キーを作成する
	$signature_key = rawurlencode( $consumer_secret ) . '&' . rawurlencode( $oauth_token_secret ) ;

	// [$params_a]と[$params_b]を署名作成のため合体
	$params_c = array_merge( $params_a , $params_b ) ;

	// [$params_c]をアルファベット順に並び替える
	ksort( $params_c ) ;

	// 配列[$params_c]を[キー=値&キー=値...]の文字列に変換
	$signature_params = str_replace( array( '+' , '%7E' ) , array( '%20' , '~' ) , http_build_query( $params_c , '' , '&' ) ) ;

	// リクエストメソッド、リクエストURL、パラメータを、URLエンコードしてから[&]で繋ぎ、データを作成する
	$signature_data = rawurlencode( $method ) . '&' . rawurlencode( $request_url ) . '&' . rawurlencode( $signature_params ) ;

	// キー[$signature_key]とデータ[$signature_data]をHMAC-SHA1方式のハッシュ値に変換し、base64エンコードして、署名を作成する
	$signature = base64_encode( hash_hmac( 'sha1' , $signature_data , $signature_key , true ) ) ;

	// [$params_a]に署名を追加する
	$params_a['oauth_signature'] = $signature ;

	// ヘッダーを作成する
	$header_params = http_build_query( $params_a , '' , ',' ) ;

	// GETの場合、[$params_b]をリクエストURLの末尾に付ける
	if( $params_b && $method=='GET' )
	{
		$request_url .= '?' . http_build_query( $params_b , '' , '&' ) ;
	}

	// コンテキストを用意
	$context = array(
		'http' => array(
			'method' => $method ,
			'header' => array(
				'Authorization: OAuth ' . $header_params ,
			),
		)
	) ;

	// POSTメソッドの場合、コンテキストにリクエストボディを加える
	if( $request_body && $method != 'GET' )
	{
		$context['http']['content'] = $request_body ;
	}

	// CURLでリクエスト
	$curl = curl_init() ;

	// オプションのセット
	curl_setopt( $curl , CURLOPT_URL , $request_url ) ;
	curl_setopt( $curl , CURLOPT_HEADER, 1 ) ; 
	curl_setopt( $curl , CURLOPT_CUSTOMREQUEST , $method ) ;
	curl_setopt( $curl , CURLOPT_SSL_VERIFYPEER , false ) ;								// 証明書の検証を行わない
	curl_setopt( $curl , CURLOPT_RETURNTRANSFER , true ) ;								// curl_execの結果を文字列で返す
	curl_setopt( $curl , CURLOPT_HTTPHEADER , $context['http']['header'] ) ;			// ヘッダー
	if( isset($context['http']['content']) && !empty($context['http']['content']) )		// ボディ (POST時)
	{
		curl_setopt( $curl , CURLOPT_POSTFIELDS , $context['http']['content'] ) ;
	}
	curl_setopt( $curl , CURLOPT_TIMEOUT , 5 ) ;										// タイムアウトの秒数

	// 実行
	$res1 = curl_exec( $curl ) ;
	$res2 = curl_getinfo( $curl ) ;

	// 終了
	curl_close( $curl ) ;

	// 取得したデータ
	$response = substr( $res1, $res2['header_size'] ) ;									// 取得したデータ(JSONなど)
	$header = substr( $res1, 0, $res2['header_size'] ) ;								// レスポンスヘッダー (検証に利用したい場合にどうぞ)

	// 取得したデータを返却
	return ( !$response_header ) ? $response : array( $response , $header ) ;

}

// GETクエリ形式の文字列を配列に変換する関数
function get_query( $data = '' )
{
	// 文字列を[&]で区切って配列に変換する
	$ary = explode( '&' , $data ) ;

	// [&]が含まれていない場合は終了
	if( 2 > count( $ary ) )
	{
		return false ;
	}

	// 文字列を配列に整形する
	foreach( $ary as $items )
	{
		$item = explode( '=' , $items ) ;
		$query[ $item[0] ] = $item[1] ;
	}

	// 返却
	return $query ;
}

OAuth認証をするための処理

先ほど紹介した関数を利用して、認証処理をPHPで実装してみたのが次のコードです。$scopeにはアプリの権限を指定して下さい。登録した時と同じ内容じゃないとエラーが発生します。指定するのは「スコープ名」です。

PHP

<?php

	// はてな用のライブラリの読み込み
	require './hatena-oauth-library.php' ;

	// アプリの権限(複数の場合は[,]で区切る)
	$scope = 'read_public,write_public' ;

	// セッションスタート
	session_start() ;

	// HTML用
	$html = '' ;

	// はてなでの認証が終了してリダイレクト時、アクセストークンを取得
	if( isset($_GET['oauth_token']) && !empty($_GET['oauth_token']) && is_string($_GET['oauth_token']) && isset($_GET['oauth_verifier']) && !empty($_GET['oauth_verifier']) && is_string($_GET['oauth_verifier']) && isset($_SESSION['oauth_token_secret']) && !empty($_SESSION['oauth_token_secret']) && is_string($_SESSION['oauth_token_secret']) )
	{
		// アクセストークンをリクエストする
		$data = hatena_oauth( 'https://www.hatena.com/oauth/token' , 'POST' , array( 'oauth_token' => $_GET['oauth_token'] , 'oauth_token_secret' => $_SESSION['oauth_token_secret'] , 'oauth_verifier' => $_GET['oauth_verifier']) ) ;

		// 配列に変換
		$query = get_query( $data ) ;

		// セッション終了
		$_SESSION = array() ;
		session_destroy() ;

		// エラー判定
		if( !$query )
		{
			$html .= '<p>アクセストークンの取得に失敗しました…。もう一度、認証をするには、<a href="' . explode( '?' , $_SERVER['REQUEST_URI'] )[0] . '">こちら</a>をクリックして下さい。</p>' ;
		}
		else
		{
			// 情報の整理
			$url_name = rawurldecode( $query['url_name'] ) ;
			$display_name = rawurldecode( $query['display_name'] ) ;
			$oauth_token = rawurldecode( $query["oauth_token"] ) ;
			$oauth_token_secret = rawurldecode( $query['oauth_token_secret'] ) ;

			// 出力する
			$html .=  '<h2>実行結果</h2>' ;
			$html .=  '<dl>' ;
			$html .=  	'<dt>ユーザーID</dt>' ;
			$html .=  		'<dd>' . $url_name . '</dd>' ;
			$html .=  	'<dt>名前</dt>' ;
			$html .=  		'<dd>' . $display_name . '</dd>' ;
			$html .=  	'<dt>アクセストークン</dt>' ;
			$html .=  		'<dd>' . $oauth_token . '</dd>' ;
			$html .=  	'<dt>アクセストークンシークレット</dt>' ;
			$html .=  		'<dd>' . $oauth_token_secret . '</dd>' ;
			$html .=  '</dl>' ;
		}
	}

	// 初回アクセス時、リクエストトークンを取得して、はてなの認証画面にリダイレクトする
	else
	{
		// リクエストトークンを取得する
		$data = hatena_oauth( 'https://www.hatena.com/oauth/initiate' , 'POST' , array( 'scope' => $scope ) ) ;

		// 取得した文字列を変換
		if( !$query = get_query( $data ) )
		{
			$html .= '<p>リクエストトークンの取得に失敗しました…。もしかしたら「コンシューマーキー」「コンシューマーシークレット」「権限」の設定が違っているかもしれません…。</p>' ;
		}
		else
		{
			// セッションに保存
			session_regenerate_id( true ) ;
			$_SESSION['oauth_token_secret'] = rawurldecode( $query['oauth_token_secret'] ) ;

			// 認証画面へリダイレクト
			header( 'Location: https://www.hatena.ne.jp/oauth/authorize?oauth_token=' . $query['oauth_token'] ) ;
		}
	}

?>

<?php
	// ブラウザに[$html]を出力 (HTMLのヘッダーとフッターを付けましょう)
	echo $html ;
?>

OAuth認証のデモを用意しました。認証時、アプリケーションの権限として、読み取り権限、書き込み権限を要求しています。これらは次章以降で説明する、「ブックマークの追加」「ブックマークの削除」のデモンストレーションに必要な権限なので、ご了承下さい。このアプリケーションがあなたの操作を介さず、あなたのデータにアクセスすることはありません。

このコードの動作を確認する

アクセストークンを確認する

先ほどのサンプルプログラムを起動して認証を進めると、アクセストークンとアクセストークンシークレットがブラウザに表示されるはずです。webサービスではこのようにして得られるユーザーのアクセストークン、アクセストークンシークレットを利用して、何らかのサービスを実現します。サンプルでは画面上に出力するだけでしたが、必要な場合はデータベースなどに保存して下さい。

例えば目的が「認証」だけならば、アクセストークン、アクセストークンシークレットが得られた時点で本人確認(=そのユーザーがはてなユーザーであること)扱いにしていいと思います。

プロフィールを取得してみる

アクセストークンとアクセストークンシークレットが有効か、を確認します。例えば、下記のリクエストで「はてなユーザー」のプロフィールを取得することができます。先ほど紹介した「OAuth認証用の関数(hatena_oauth())」を利用して取得できるか試してみましょう。$access_token$access_token_secretに値を設定して下さい。プロフィール情報を取得できれば、それらの値が有効だということです。

PHP

<?php

	// はてな用のライブラリの読み込み
	require './hatena-oauth-library.php' ;

	// アクセストークンとアクセストークンシークレット
	$access_token = '' ;
	$access_token_secret = '' ;

	// プロフィールデータを取得する
	$json = hatena_oauth( 'http://n.hatena.com/applications/my.json' , 'GET' , array( 'oauth_token' => $access_token , 'oauth_token_secret' => $access_token_secret ) ) ;

	// HTML用
	$html = '' ;

	// データ取得のエラー判定
	if( !$json )
	{
		$html .= '<p>アクセストークンかアクセストークンシークレットがおかしいです…。偽物?</p>' ;
	}
	else
	{
		// 取得したJSONデータをオブジェクトに変換
		$obj = json_decode( $json ) ;

		// HTML
		$html .= '<h2>実行結果</h2>' ;
		$html .= $obj->display_name . 'さんのアクセストークンとアクセストークンシークレットが本物であることを確認しました。' ;
		$html .= '<dl>' ;
		$html .= 	'<dt>ユーザーID</dt>' ;
		$html .= 		'<dd>' . $obj->url_name . '</dd>' ;
		$html .= 	'<dt>ユーザー名</dt>' ;
		$html .= 		'<dd>' . $obj->display_name . '</dd>' ;
		$html .= 	'<dt>アイコン画像</dt>' ;
		$html .= 		'<dd><img src="' . $obj->profile_image_url . '"></dd>' ;
		$html .= '</dl>' ;
	}

?>

<?php
	// ブラウザに[$html]を出力 (HTMLのヘッダーとフッターを付けましょう)
	echo $html ;
?>

このコードの動作を確認する

関数の使い方について

サンプルで紹介した関数(hatena_oauth())は、OAuth認証が必要な他のAPIでも利用することができます。多分ですが、TumblrとかTwitterなど、OAuth1.0規格のAPIなら利用できるはずです。下記のように利用して下さい。

PHP

<?php

	// ライブラリの読み込み
	require './hatena-oauth-library.php' ;

	// 設定
	$request_url = 'http://...' ;		// リクエストURL
	$request_method = 'POST' ;			// リクエストメソッド
	$params = array(					// パラメータ
		'oauth_token' => '...' ,		// アクセストークン
		'oauth_token_secret' => '...' ,	// アクセストークンシークレット
	) ;

	// リクエストの返り値が[$json]に代入されます
	$json = hatena_oauth( 
		$request_url ,
		$request_method , 
		$params
	) ;

	// 第4引数に[1]を指定すると、データとレスポンスヘッダーをセット(配列)で取得できます
	list( $json , $response_header ) = hatena_oauth( 
		$request_url ,
		$request_method , 
		$params ,
		1
	) ;

例えば、はてなブックマークの「FEED URI」を利用してみましょう。詳細は下記ページをご覧下さい。

PHP

<?php

	// はてな用のライブラリの読み込み
	require './hatena-oauth-library.php' ;

	// アクセストークンとアクセストークンシークレット
	$access_token = '' ;
	$access_token_secret = '' ;

	// リクエストの設定
	$request_url = 'http://b.hatena.ne.jp/atom/feed' ;		// リクエストURL
	$request_method = 'GET' ;								// リクエストメソッド

	// パラメータの設定
	$params = array(
		'oauth_token' => $access_token ,					// アクセストークン
		'oauth_token_secret' => $access_token_secret ,		// アクセストークンシークレット
	) ;

	//リクエストの返り値が[$json]に代入される
	$xml = hatena_oauth(
		$request_url ,
		$request_method ,
		$params
	) ;

	// HTML
	$html = '' ;

	//出力
	$html .= '<h2>実行結果</h2>' ;
	$html .= '<p>下記が、リクエストを通して取得したデータです。</p>' ;
	$html .= '<p><textarea rows="8">' . $xml . '</textarea></p>' ;

?>

<?php
	// ブラウザに[$html]を出力 (HTMLのヘッダーとフッターを付けましょう)
	echo $html ;
?>

このコードの動作を確認する

ブックマークを追加、削除する

前章ではOAuth認証を利用した「アクセストークン」「アクセストークンシークレット」の取得方法を紹介しました。それでは、今回は取得できたそれらを使って、ブックマークを追加したり、削除したりしてみましょう。なお、前章で紹介したOAuth認証用の関数(hatena_oauth())を利用します。

ブックマークを追加する

それではPHPを利用して、ブックマークを追加してみましょう。前章を読んでいる方は、延長上なのですぐに理解できるはずです。まず、ブックマークを新規追加するための条件を下記ページで確認してみましょう。

リクエスト方法

下記がエンドポイントです。POSTメソッドでリクエストを送って下さい。

POST http://api.b.hatena.ne.jp/1/my/bookmark

下記のパラメータを指定することができます。

url
ブックマークするURL。
comment
ブックマークに付けるコメント。
tags
タグを10個まで指定可。
post_twitter
1を指定するとTwitterに投稿する。ユーザーがTwitterと連携している必要がある。
post_facebook
1を指定するとFacebookに投稿する。ユーザーがFacebookと連携している必要がある。
post_mixi
1を指定するとmixiに投稿する。ユーザーがmixiと連携している必要がある。
post_evernote
1を指定するとevernoteに投稿する。ユーザーがevernoteと連携している必要がある。
send_mail
1を指定するとメールに投稿する。ユーザーが有料会員になっている必要がある。
private
1を指定するとこのブックマークを非公開にする。

ちなみにtagsで複数の値を指定する方法が不明です…。空白で区切ってもカンマで区切っても1つのタグ名で登録されてしまいました。タグを複数指定したい場合は、コメントの最初に[タグ1][タグ2]と入れることで、複数のタグを設定することができます。

サンプルプログラム

以上の情報を元に作成したPHPのサンプルプログラムが下記です。よろしければ試してみて下さい。hatena_oauth()の読み込みを忘れないで下さいね!

PHP

<?php

	// はてな用のライブラリの読み込み
	require './hatena-oauth-library.php' ;

	// アクセストークンとアクセストークンシークレット
	$access_token = '' ;
	$access_token_secret = '' ;

	// ブックマークするURL
	$url = 'https://syncer.jp/' ;
	$comment = 'APIを使って、ブックマークをしてみました。' ;

	// リクエストの設定
	$request_url = 'http://api.b.hatena.ne.jp/1/my/bookmark' ;		// リクエストURL
	$request_method = 'POST' ;								// リクエストメソッド

	// リクエストを送信する
	$json = hatena_oauth(
		$request_url ,
		$request_method ,
		array(
			'oauth_token' => $access_token ,
			'oauth_token_secret' => $access_token_secret ,
			'url' => $url ,
			'comment' => $comment ,
		)
	) ;

	// JSONをオブジェクトに変換
	$obj = json_decode( $json ) ;

	// HTML用
	$html = '' ;

	// 出力
	$html .= '<h2>実行結果</h2>' ;

	// 成功判定
	if( isset($obj->permalink) && !empty($obj->permalink) )
	{
		$html .= '<p>ブックマークに成功しました。<a href="' . $obj->permalink . '" target="_blank">こちら</a>から確認して下さい。</p>' ;
	}
	else
	{
		$html .= '<p>ブックマークに失敗したみたいです…。</p>' ;
	}

	$html .= 	'<h3>取得したデータ</h3>' ;
	$html .= 	'<p>下記が、リクエストを通して取得したデータです。</p>' ;
	$html .= 	'<p><textarea rows="8">' . $json . '</textarea></p>' ;

?>

<?php
	// ブラウザに[$html]を出力 (HTMLのヘッダーとフッターを付けましょう)
	echo $html ;
?>

このコードの動作を確認する

ブックマークを削除する

続いて、APIを利用してブックマークを削除してみましょう。ブックマークを削除するためのリクエストの条件は、下記のページで確認できます。

リクエスト方法

下記がエンドポイントです。DELETEメソッドでリクエストを送って下さい。

DELETE http://api.b.hatena.ne.jp/1/my/bookmark

下記のパラメータを指定することができます。

url
削除したい、ブックマーク先のURL。

サンプルプログラム

こちらが、PHPでブックマークを削除するためのサンプルプログラムです。hatena_oauth()を読み込んでご利用下さい。先ほどのコミカルなサンプルブックマークが削除されれば成功です…。ぜひまたブックマークして下さいね!

PHP

<?php

	// はてな用のライブラリの読み込み
	require './hatena-oauth-library.php' ;

	// アクセストークンとアクセストークンシークレット
	$access_token = '' ;
	$access_token_secret = '' ;

	// ブックマークを削除するURL
	$url = 'https://syncer.jp/' ;

	// リクエストの設定
	$request_url = 'http://api.b.hatena.ne.jp/1/my/bookmark' ;		// リクエストURL
	$request_method = 'DELETE' ;								// リクエストメソッド

	// リクエストを送信する
	$res = hatena_oauth(
		$request_url ,
		$request_method ,
		array(
			'oauth_token' => $access_token ,
			'oauth_token_secret' => $access_token_secret ,
			'url' => $url ,
		) ,
		1					// 今回はレスポンスヘッダーも取得するため、第4引数を[1]に
	) ;

	// HTML用
	$html = '' ;

	// 出力
	$html .= '<h2>実行結果</h2>' ;

	// 成功判定 ( レスポンスヘッダーに[HTTP/1.1 204]という文字列があれば、という雑な判定… )
	if( strpos( $res[1] , 'HTTP/1.1 204' ) !== false )
	{
		$html .= '<p>ブックマークの削除に成功しました。</p>' ;
	}

	// ブックマークが存在しない場合
	elseif( strpos( $res[1] , 'HTTP/1.1 404' ) !== false )
	{
		$html .= '<p>対象のURLにブックマークしていないみたいです…。</p>' ;
	}

	// その他のエラー
	else
	{
		$html .= '<p>ブックマークの削除に失敗したみたいです…。</p>' ;
	}

	$html .= 	'<h3>取得したデータ</h3>' ;
	$html .= 	'<p>下記は取得したレスポンスヘッダーです。ステータスコードが<code>204</code>なら成功です。</p>' ;
	$html .= 	'<p><textarea rows="8">' . $res[1] . '</textarea></p>' ;

?>

<?php
	// ブラウザに[$html]を出力 (HTMLのヘッダーとフッターを付けましょう)
	echo $html ;
?>

このコードの動作を確認する

削除の場合、返されるJSONデータはありません。強いていうならBoolean値のfalseが返ります。レスポンスヘッダーのステータスコードが204なら成功、400(リクエストの不備)または404(対象のブックマークが存在しない)だと失敗です。

Web Hookを利用する

はてなブックマークのAPIには「Web Hook」の機能があります。Web Hookとは簡単に言うと、「任意のタイミングで、サービス(はてブ)側がアプリ(制作者)側のプログラムを起動してくれるシステム」です。

これにより、例えば「あるユーザーがエントリーをブックマークをしたらアプリを起動する」ということが実現できます。アプリ側は、例えば「起動されたらそのEvernoteにエントリーの情報を送る」などの機能を備えておきます。

cronが「"任意の時間"でプログラムを起動してくれるシステム」なのに対して、Web Hookは「"任意のタイミング"でプログラムを起動してくれるシステム」と考えるとイメージが湧きやすいかもしれません。もちろん、どんなタイミングを設定できるかは、Web Hookを提供するwebサイトによります。

設定できるイベント

さて、はてブではWeb Hookにおいて、どんなタイミング(イベント)を設定できるのかを見てみましょう。次の通りです。例えば、「他人からのスターが付いたら、Twitterでつぶやく」みたいなプログラムも可能になりますね。

add
ブックマークを追加した。
update
ブックマークを更新した。
delete
ブックマークを削除した。
star
他人からのスターが付いた。
id_call
他人からのIDコールが発生した。
favorite:add
お気に入りのユーザーがブクマした。

受信するパラメータ

先ほどの表で「statusって何?」と思った方もいると思います。これは、指定したタイミング(イベント)が発生した時に、サービス側がアプリ側に送るパラメータの1つです。サービス側は条件が揃った時、次のパラメータを付けて、アプリをPOSTリクエストで起動してくれます。

status
前項で説明したイベントコード。
key
ユーザーが指定したパスワード。
username
ブックマークをした、自分にスターを付けた、自分にIDコールをしたユーザーのID。
title
エントリーのタイトル。
count
イベントが発生した時点のブックマーク数。
permalink
イベント対象(ブコメ)のパーマリンク。
comment
イベント対象に付いたコメント。
timestamp
イベントが発生した日時。
is_private
ブックマークが非公開の時に1となる。
client
ブックマークを行なった経路。ブックマーク追加・更新のイベントのみに付くパラメータ。
Web … ウェブブラウザ
AtomAPI … API
Twitter … Twitter
Mail … メール
color
スターの色。はてなスターのイベントのみに付く。
quote
はてなスターで引用された文字列。はてなスターのイベントのみに付く。

タグについて

ブックマークにタグが付いている場合、そのデータはcommentに、「[タグ1][タグ2]このページ素晴らしいですねー。」というような形で含まれます。

サンプルプログラム

例えばPHPだったら$_POST["status"]で、受け取ったイベントの判定ができるというわけですねー。次は「他人からスターが付いたらファイルに記録する」というサンプルプログラムです。「これだと問題ないか…?」と思った人は正解ですが、ここではとりあえず「リクエストを受け取るイメージ」を持っていただくのが目的なので、そのまま読み進めて下さい。

PHP

<?php

	// イベントがstarじゃなければ終了
	if( $_POST["status"] != 'star' ) exit ;
 
	// スターを付けた人
	$people = $_POST['username'] ;
 
	// スターの色
	$color = $_POST['color'] ;
 
	// 記録する
	@file_put_contents( './memo.txt' , $people . 'さんが{$color}のスターを付けたよ!' ) ;

これで、例えばechoで出力しても意味がないことは分かりますよね?Web Hookによるリクエストはcronと同じく、人がいないところで発生するプログラム起動です。このところは整理しておきましょう。

ユーザー側で必要な設定

ユーザーによるWeb Hookの設定
ユーザーによるWeb Hookの設定

サービス側は手当たり次第にWeb Hookによるリクエストを送りつけてくるわけではありません。ユーザー側の設定に基づいて、Web Hookによるリクエストを送ってくれます。ここではユーザー側の設定方法を紹介します。マイページの設定画面の「外部サイト連携」というタブを開き、Web Hookという項目に進んで下さい。

イベントを設定する
イベントを設定する

「イベントを受け取るURL」には、プログラムのURLを入力して下さい。また、「受け取るイベントの種類」には、プログラムの機能に合わせた項目を選択して下さいね。チェックしなければ、そのイベントが発生しても、サービス側はアプリ側にリクエストを送りません。

キーについて

さて、「キー」について説明します。先ほど紹介した「スターを受け取ったらメモする」というサンプルプログラムには問題があります。その最たるものは「誰でもPOSTリクエストができてしまうこと」です。何らかの方法でプログラムの存在、URLを知った人物がサービス側を装ったリクエストを送りつけてきたら大変ですよね?

そういったことを防ぐために用意されたパラメータが、この「キー」です。ここで設定する「キー」をユーザー側、アプリ側で共有することで、第三者の悪戯を防ぐシステムが出来上がる、というわけなんです。「キー」のパラメータを利用して、例えば次のように条件分けします。

PHP

<?php

	// ユーザー画面で設定したキー
	$key = 'hdfhsdkhdfhfdds' ;
 
	// キーの確認(キーが合わなければエラー処理)
	if( $_POST['key'] != $key )
	{
		echo 'キーが違います!!悪戯はやめて下さい!!' ;
		exit ;
	}

キーが違う場合、アクセスが悪戯、つまり人間によるブラウザを経由したアクセスかもしれないので、echoをしておく意味があるのは理解できますよね?「echoなんてしたら悪戯犯を刺激するだけ、プログラムの存在を教えるだけ」という問題はここではおいといて、大切なのは「〜の場合は人間によるアクセスかもしれない」というケースを想像・想定することです。

その上でechoをするメリットはないので外すのですが…。exitにしたり、次みたいに404(Not Found)を偽装するのもいいかもしれません。

PHP

<?php

	// キーの確認(キーが合わなければ404扱いにしてリダイレクト)
	if( $_POST['key'] != $key )
	{
		header( 'HTTP/1.1 404 Not Found' ) ;
		header( 'Location: {専用の404ページのURL}' ) ;
	}

サンプルプログラム

さて、以上を踏まえて作成したサンプルプログラムが下記になります。ブックマークをすると、このプログラムと同じフォルダにwebhook_memo.txtというメモが生成され、ブックマークした内容が記録されます。

Web Hookの設定では「ブックマークの追加/更新/削除」にチェックを入れておいて下さいね。よろしければ、Web Hookの動作確認や、下地にしてご利用下さい。

PHP

<?php

	// ユーザー画面で設定したキー
	$key = '' ;
 
	// パラメータをチェック(おまじない)
	foreach( $_POST as $a => $b ) if( !is_string( $_POST[$a] ) ) exit ;
 
	// キーが違ったら終了(エラー)
	if( !isset($_POST['key'] ) || $_POST['key'] != $key ) exit ;
 
	// ステータスが違ったら終了(エラー)
	if( !isset( $_POST['status']) || $_POST['status'] != 'add') exit ;

	// パラメータを整理
	$user = ( isset($_POST['username']) ) ? $_POST['username'] : '' ;	//ユーザー
	$title = ( isset($_POST['title']) ) ? $_POST['title'] : '' ;		//エントリーのタイトル
	$count = ( isset($_POST['count']) ) ? $_POST['count'] : '' ;		//ブックマーク数
	$comment = ( isset($_POST['comment']) ) ? $_POST['comment'] : '' ;	//コメント
	$permalink = ( isset($_POST['permalink']) ) ? $_POST['permalink'] : '' ;		//パーマリンク
	$timestamp = ( isset($_POST['timestamp']) ) ? $_POST['timestamp'] : '' ;		//ブックマークした日付
	$date = date( 'Y/m/d H:i' , strtotime($timestamp) ) ;		//日時を整形
	$client = ( isset($_POST['client']) ) ? $_POST['client'] : '' ;		//ブックマークした経路

	// メモする内容
	$memo = "{$user}が{$title}に{$client}経由でブックマークをしました。<br/>{$count}個目のブックマークです。<br/>コメント「{$comment}」<br/>日時:{$date}<br/>URL:{$permalink}";		//メモする内容

	// メモする
	@file_put_contents( './webhook_memo.txt' , $memo ) ;

アプリケーション連携を解除する

この記事のサンプルデモを利用した人は、当サイトのアプリケーションを認証したはずです。当サイトのアプリケーションが、あなたの操作なしに、あなたのデータにアクセスすることはありませんが、セキュリティ上、アプリケーション連携は解除しておいて下さい。大変、お手数おかけしてしまい、申し訳ございません。連携の解除は、「はてなブックマーク」ではなく、「はてな」の設定画面からできます。

アプリケーション連携を解除する手順

「外部アプリケーション認証」をクリック
「外部アプリケーション認証」をクリック

設定画面にアクセスしたら、上部メニューにある「外部アプリケーション認証」をクリックして下さい。

メニューを選択する
メニューを選択する

「外部アプリケーション認証」の画面に移動します。メニューの中から「外部のアプリケーションから、はてなのサービスを利用する」をクリックして下さい。

「無効化」をクリック
「無効化」をクリック

アプリケーションの設定画面に移動します。この中に、あなたが現在、連携している外部アプリケーションの一覧が表示されます。その中から、解除したいアプリケーションの、「状態」の欄にある「無効化」というボタンをクリックして下さい。

APIを使ったwebサービスまとめ

さて、これまで長々と「はてなブックマーク」のAPIの使い方を紹介してきました。最後に、はてブのAPIを利用したwebサービスの数々を紹介していこうと思います。どれもアイデアが刺激される素晴らしいものばかりです!

はてブ1000users超え記事アンテナ(´・ω・)

はてな1000超えアンテナ
はてな1000超えアンテナ

既に閉鎖済みのサイトです。週6フリーターの人が作成したwebサービス。ブクマ数が1000を超えた記事だけを、「レシピ」など独自のカテゴリーに分けて表示するという内容でした。コンテンツの1つで「はてブ流行る直前記事アンテナ」というものもありました。その制作過程を書いた下記の記事は必読です。

ブコメヨム

ブコメヨム
ブコメヨム

Twitter上の友人である、ごろどく氏の作成したウェブサービスです。画面を切り替えることなく、それぞれのエントリーのコメントが読めるwebサービス。そしてブックマーク数に対するコメントの割合も表示されていて、盛り上がり具合が分かりやすいのも嬉しいですねー。

はてブ全件チェッカー

はてブ全件チェッカー
はてブ全件チェッカー

手前味噌で申し訳ございません。私が作ったwebサービスで「はてな全件チェッカー」です。単純に入力したURL(webサイト)の、合計ブックマーク数を表示するものです。

はてブ整理

はてブ整理
はてブ整理

ブックマーク時に付けた、タグを一括で削除できるwebサービス。逆に指定したタグを一括で付けることもできます。

歴代はてブ多い順!!

歴代はてブ多い順!!
歴代はてブ多い順!!

月ごと、年ごと、そして歴代のブックマーク数ランキングを掲載しているサイト。シンプルながら、とても興味深く有益な情報ですよね。

Habory

Habory
Habory

はてブしたエントリーを、同時にReadability、pocket、Instapaperに登録してくれるwebサービス。はてブが公式に連携対応してないサービスでも、APIを利用することによって連携が可能になり、ユーザーに価値あるサービスを提供することができる良い例ですね。有名サービスの「ツイエバ」を運営している方の作品です。

はてブみる

はてブみる
はてブみる

自分がこれまでにしたブックマークエントリーを、スクリーンショット付きで一覧表示してくれるwebサービス。タグで絞り込む機能もあります。独創性の強い、かなり異色なサービスですね。

はてさぽ

はてさぽ
はてさぽ

2005年開始当初からの、年別、月別のはてブランキングを閲覧することができます。一覧性があって大変見やすいです。

ブクシィ

ブクシィ
ブクシィ

はてなブックマークのエントリーをmixiの日記風にして読むことができるwebサービス。エントリー情報が日記本文で、ブコメが日記コメントのように表現されている。見た目を変更しただけでこうも面白い。個人が作るwebサービスっていいですよね。

@hatenastar_ranking

@hatenastar_ranking
@hatenastar_ranking

はてなスターの獲得数ランキングを、1時間ごとに自動でつぶやくTwitterのbot。他の様々なwebサービスと組み合わせるのも、APIの楽しさですねー。

BLOGMARK

BLOGMARK
BLOGMARK

私の友人(だと勝手に思ってる)SPYDERさんが作成したwebサービス。はてブ数、Tweet数、Like数の推移を集計し、グラフで視覚的に確認できる。ブログパーツもあるので今すぐ登録しよう!

Skimii

Skimii
Skimii

2015年3月に公開された、はてなブックマークビューアのウェブアプリ。ページ遷移なしで快適に動作します。タグでエントリーを検索するのに便利なのが特徴的で、Twitterを通してログインすることで、設定を保存することなどができます。

Hateneighbor

Hateneighbor
Hateneighbor

2015年6月に公開された、はてなブックマークで、自分と似た傾向のブックマークをするユーザーを検索するウェブサービスです。はてなブックマークにおけるフォロー、フォロワー機能をなかなか活用できていないという人は、このウェブサービスを利用してユーザーを探して見ましょう。

じわじわ来てるエントリー

じわじわ来てるエントリー
じわじわ来てるエントリー

一時の勢いではなく、少しずつブックマーク数が増えて60を超えた、いわば真に良質なエントリーを取り上げたサイトです。システム的には、新着エントリーを収集しておき、1日ごとに個々のエントリーのブクマ数の増え具合をチェックしているのでしょうか。残念ながら、2014年12月にサービスが終了してしまいました。

FateV

FateV
FateV

最近10日間のはてブエントリーを効率良く見れる、はてブブラウザー。未読、既読の管理や、ユーザー数、キーワードなどでフィルタリングできるのが便利だ。2015年7月に確認したところ、ウェブサービス、開発記録の記事、ともに閉鎖してしまったようです。

TopHatenar

TopHatenar
TopHatenar

ブックマークとRSS購読者数の推移が掲載されたサイト。2014年6月現在、2014年1月からの集計が停止している。2015年1月現在、ウェブサイトにも繋がらなくなってしまいました。

HatebuNote

HatebuNote
HatebuNote

「自分が見やすいデザインではてブを見る」という目的で作られた、自分のためのはてブ閲覧サービス。デザインを変えたり、エントリーを絞ったりで、自分のためだけのはてなブックマークを作成するのも面白いと思います。2015年7月に確認したところ、閉鎖していました。

Stepinto

Stepinto
Stepinto

はてブを地図で振り返るwebサービス。例えば「ぐるなび」や「ロケタッチ」など、位置情報を含んだ対応ページをブックマークしたものをGoogle Mapsで振り返ることができます。WebHookをユーザー向けに活用したwebサービスの事例として、とても参考になりますね!2015年7月に確認したところ、閉鎖してしまっていました…。

ダウンロード

記事の中で紹介したサンプルプログラムを配布しています。シンプルで分かりやすいことを目的としたため、必要最低限のエラー処理しかしていないことをご考慮下さい。よろしければ、カスタマイズしてご利用下さいね。