概要
前回の続きです。
今回はクライアントの方の設定をします。GoogleやFacebook等でOAuthを用いた認証の設定をしたことがある人はすぐできます。
OAuthクライアントの作成
アクセス制御
→/ (最上位のレルム)
→エージェント
→OAuth2.0 クライアント
と進んで以下の画面まで移動します。
エージェント (0 エージェント)
の新規
を押します。
新しくクライアントを登録します。注意としてこの時の設定が
- 名前=client_id
- パスワード=client_secret
として登録されます。今回はOpenAMSample
、hogefugapiyo
として作成します。
作成するとエージェントに追加されているのでクリックして詳細を設定します。
ここでは主に最低限以下の設定をします。
項目 | 説明 | 今回の例 |
---|---|---|
リダイレクトURL | Authorization codeやAccess Tokenを返すためのURL | http://localhost:3000/oauth2callback |
スコープ | 認証で必要な承認項目 | openid, profile, email |
表示する名称 | ユーザに承認してもらう際に表示する名称 | OpenAMSample |
表示する説明 | ユーザに承認してもらう際に表示する説明 | テストテスト |
IDトークン署名応答アルゴリズム | トークン署名のアルゴリズムを設定 | HS256 |
完了したら保存します。
OpenIDConnectを使ってみる
実装
OpenID Connect認証の実装部分を参考に認証を動作確認してみます。
passportの設定を以下の様にして、それ以外は全て同じ実装でOKです。
passport.use(new OpenidConnectStrategy({ authorizationURL: "http://openam.example.com:8080/openam/oauth2/authorize", tokenURL: "http://openam.example.com:8080/openam/oauth2/access_token", userInfoURL: "http://openam.example.com:8080/openam/oauth2/userinfo", clientID: "OpenAMSample", clientSecret: "hogefugapiyo", callbackURL: "http://localhost:3000/oauth2callback", scope: ["openid", "email", "profile" ] }, function(accessToken, refreshToken, profile, done) { console.log('accessToken: ', accessToken); console.log('refreshToken: ', refreshToken); console.log('profile: ', profile); return done(null, profile); })); passport.serializeUser(function(user, done){ done(null, user); }); passport.deserializeUser(function(obj, done){ done(null, obj); });
各URLは前回説明したエンドポイントをそれぞれ設定します。
動作確認
クライアントアプリを起動してlocalhost:3000にアクセスします。
ログインしてみます。
するとユーザの承認確認画面に移ります。
ユーザの詳細情報を記述してないので何も表示されてないですが、email等設定しているとここで表示されます。
承認するとログインが完了します。
以上です。お疲れ様でした。