OpenID Connectローンチおめでとう!

ということで、OpenID ConnectはOAuth 2.0の技術を使ってるぐらいしか知らず、

OpenID 2.0もわりとさっぱりだったので最近勉強してたんですけど、よし使ってみるか!って思って

ライブラリ見てたら、JanrainというSaasを発見したので紹介してみるっていう流れ。

 

なお、Janrainに関する日本語の情報がとても乏しく、さらにJanrain経験3時間くらいのスライムなので

色々と間違っているかもしれませんが、いつも通りご容赦を。

 

で、Janrainは認証系のSaasで

・OpenIDとかOAuthとかそういう系のソーシャルサインオンを提供

・色んなWebアプリ(認証プロバイダ)に対応

・Janrain自体にもユーザ情報を確認できるらしい(未確認)

・シングルサインオンもできます

・ユーザ登録数とかログイン数とかの分析もできます

・Social Sharing(Twitterで共有的な)も簡単にできます

といったサービスです。

 

メインどころは一番最初に書いたソーシャルサインオンのところで、

普通はサービスに応じて認証プロトコルを変えないといけないから

OAuth 1.0, 2.0やらOpenID 1.1, 2.0, Connectやら色々と切り替えないといけなくて

利用言語のライブラリもその分対応してないといけないけど

JanrainだとAPI呼ぶだけであとはJanrainがサーバサイドでサービスごとの差異を吸収しますよー

っていうのが良いみたい。

 

百聞は一見に如かずということで、実際にやってみました。

 

1. Janrain登録

まずは登録。→https://dashboard.janrain.com/signin

JanrainSignIn

 

もちろん、ソーシャルサインオンもできまっせ。

 

2. ダッシュボードからアプリ(Engage)を作成

ログインするとダッシュボード画面に遷移するので

[New Property]から新しいアプリ(Engage)を作成します。

JanrainDashboard

JanrainNewProperty

JanrainNewApp

 

3. 作成したアプリの吹き出しアイコン(?)をクリックして管理画面へ遷移

JanrainDashboardAfterCreate

 

4. Sign-InsをクリックしてWidget作成画面に遷移

色々と表示されてますが、とりあえずSign-Insでソーシャルログイン用のWidgetを作成します。

ダッシュボード画面でユーザ登録数とかログイン回数をグラフで閲覧することもできます。

JanrainApp

 

 

5. Sign-in Widget作成画面でWidgetを設定

ここでは、認証プロバイダやレイアウトの設定ができます。

が、Basic(無料プラン)だと全然カスタマイズできないっぽいです…。

JanrainWidget

 

6. Get the Codeでhtml, JSのコードを取得

Get the Codeのリンクをクリックすると設定すべきhtml, JSのコードが表示されるので、

自分のアプリのログインページに設置する。

JanrainCode

 

実際はこんな感じ。

 

7. 認証情報取得用プログラムの作成

実際の認証は

上記htmlのSignInリンクをクリック

→作成したWidgetが出てくるので、任意のサービスのボタンを押下

→任意のサービスのログイン画面がポップアップウィンドウで表示される。

→ログイン後にJanrainに認証パラメータが渡され(コールバックURL)、

Janrainはクライアントに指定したトークンURL(上記例ではjanrain.php)に対してtokenをPOSTする。

→POSTされたtokenとアプリケーションKeyを使って

Janrainに認証用APIを投げて、Janrainから認証情報を取得する

っていう流れになります。

 

 

最後の”POSTされたtokenとアプリケーションKeyを使ってJanrainから認証情報を取得する”

というプログラムを作成します。

詳細はWidget作成画面のCall the APIリンクをクリックしたとこのドキュメントをご参考ください!

 

サンプル(janrain.php)は以下↓

 

これで準備はOKです!

 

で、SignInリンククリックしてログインして認証情報を取得した結果(var_dump)↓

JanrainResponse

 

 

あとは、取得したidentifierとかをDBに格納して登録処理したり、

SELECTしてログイン処理したりと、アプリ側で後はよろしく、って感じになってます。

 

ちなみにJanrainはユーザ情報のstoreも出来る(Capture)とか書いてあったけど

アプリを作成しようとすると[Contact Us]のボタンが出て作成できない…。

これはお問い合わせいただいたら、ストア用のアプリ作成できるようにしますって感じなんだろうか。

JanrainContactUs