ウェブマトリクスマンから WebMatrix のネタでブログ書けという無言の圧力を何となく感じていたので、今回は私が作成した Hatena.Helper の使い方説明をかねて書いてみます。
とりあえず WebMatrix って何？どうやって使う？？基本的な操作法は？？？という場合は、超わかりやすい開発入門が公開されていますので、一通り読んでおくのを推奨します。
Web 開発入門 - Microsoft Web Platform
みんな大好きウェブマトリクスマンが優しく教えてくれる XPS/PDF も公開されています。冗談抜きでわかりやすいのでお勧めです。
とりあえず WebMatrix で新規サイトを空っぽで作成して、Index.cshtml を追加しました。サイドバーのファイルツリーに反映されないときは表示を更新してください。
そして Hatena.Helper のインストールを行うのですが、その為には「ASP.NET Web ページの管理」から行う必要があります。そして管理ページを表示するにはパスワードの設定などが必要ですが、そのへんは全て先程の開発入門に書いてあるので省略します。
「ASP.NET Web ページの管理」では最初にパッケージマネージャが表示されるので、検索窓に "Hatena" と入力して検索すると以下のように表示されます。
バージョン違いも表示されていますが、1.4 が最新版となるので「インストール」をクリックします。クリックするともう一度インストールボタンが表示されるので、クリックすると実際にインストールされて使えるようになります。
インストールが完了したら WebMatrix の画面に戻りましょう。ファイルツリー表示が反映されていない場合は最新へ更新してください。
以下のように App_Code\Hatena.cshtml が追加されます。
それでは Index.cshtml に必要なコードを書いていきたいところなんですが、その前にはてな認証の設定を行いましょう。
はてな認証API から新規 API キーを取得します。「新規 API キーを取得」をクリックすると説明を入力するボックスがありますが、あとからも変更可能なので適当に入力して登録ください。
登録が完了してもまだ使える状態ではないので、編集を選択して以下のように設定を行います。必要なのはタイトル、コールバック URL、ステータスの 3 つで、コールバック URL には IIS Express で使われているアドレスを入力します。ステータスを有効にするのを忘れずに設定を完了してください。
これで作成した API キーと秘密鍵が使えるようになりましたので、Index.cshtml に以下のようなコードを書きます。先程取得した API キーと秘密鍵は ApiKey と SecretKey プロパティに設定します。
API キーと秘密鍵の設定が終われば、あとは Auth メソッドを呼び出すだけではてな認証の処理が行われます。認証に成功した場合は Auth メソッドの戻り値にユーザー情報が格納されたクラスのインスタンスが返ってきますので、あとはその情報を利用してユーザー ID とアイコン画像の表示を行います。
@{
Hatena.ApiKey = "(API キー)";
Hatena.SecretKey = "(秘密鍵)";
var user = Hatena.Auth();
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
ユーザー名: @user.Name<br />
アイコン: <img src="@user.ImageUrl" />
</body>
</html>
そして WebMatrix のメニューから「実行」を選択すると実際に認証処理が行われ、はてな側の確認ページへリダイレクトされます。
このページで「アカウント情報の読み取りを許可」を選択すると、設定したコールバック URL へリダイレクトが行われて、ユーザー情報が利用できるようになります。
実際に読み取りを許可した場合には以下のようにユーザー名とアイコン画像が表示されます。
非常に簡単なサンプルでしたが、WebMatrix と Hatena.Helper の組み合わせで簡単にはてな認証を使うことが出来ました。
ここで取得したユーザー名を使って認証クッキーを発行すると、実際にログイン機能として利用出来ますね。