「[[Open棟梁 wiki>https://opentouryo.osscons.jp]]」は、「[[Open棟梁Project>https://github.com/OpenTouryoProject/]]」,「[[OSSコンソーシアム .NET開発基盤部会>https://www.osscons.jp/dotNetDevelopmentInfrastructure/]]」によって運営されています。
-[[戻る>多用途認証サイト（Multi-purpose Authentication Site）]]
*目次 [#j9e4c8e8]
#contents
*概要 [#d0cd2bd9]
[[多用途認証サイト（Multi-purpose Authentication Site）]]の導入前の評価を行うためのファーストステップガイド。
*(1) 前提 [#c28f8d88]
**v00-50時点の前提環境 [#b9dba1e7]
-Visual Studio 2015
-.NET Framework 4.6
-SQL Server (Express) (メモリストアの検証ではRDBは不要)
*(2) 一式のダウンロードとセットアップ [#z97dcc62]
**[Download ZIP]する。 [#we80df78]
以下から、[Download ZIP]する。~
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/
-branchを選択してください。
-現時点では、develop branchを選択（master branchにプッシュしていない）。
-上級者は[Download ZIP]ではなく、git cloneでも可能。
**localのFileSystemに解凍する。 [#g02b35ae]
どこでもイイですが、ココではCドライブ直下に解凍した前提で説明を続けます。
**一式のビルドする。 [#de5b479c]
***ビルド [#g6bdf645]
以下のバッチを実行して、多用途認証サイトをビルドします。
-1_DeleteDir.bat
-2_DeleteFile.bat
-3_Build_Framework.bat
-4_Build_Framework_Tool.bat
-10_MultiPurposeAuthSite.bat
***プロキシ認証 [#f9da8feb]
-NuGetパッケージの復元のため、プロキシ認証を求められる場合は、~
z_Common.batファイルにプロキシ認証のCredentialを設定して下さい。
http_proxy=http://[username]:[password]@[proxy fqdn or ip address]
-若しくはVisual Studioから開いてビルドして下さい。~
Visual Studioがプロキシ認証のCredential入力を要求してきます。
*(3) [[app.config>https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config]]ファイルを設定する。 [#yae20ec8]
以下の項目を設定する。
**Administrator（システム管理者のアカウント） [#z8dbd98b]
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L93
システム管理者のアカウントを入力する（以下の要件を満たす必要がある）。
-[[ユーザ名検証（既定のユーザ名は、E-mail>https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L115]]
-[[パスワード検証（8文字以上の大文字・小文字、数値、記号>https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L120]]
**登録されるテストユーザのpassword [#bc6a1b41]
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L109
-[[テスト用に登録される下記テストユーザ>https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/Controllers/AccountController.cs#L1537]]のパスワードを入力する。
--super_tanaka@gmail.com
--tanaka@gmail.com
--super_sato@gmail.com
--sato@gmail.com
-[[前述と同様に、パスワードの要件を満たす必要がある>#zb79c716]]。
**外部ログインの追加時に XSRF の防止 [#o2d971a4]
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L140
適当なランダム文字列を設定する（下記のようなサイトを使用する）。
-パスワード自動生成 (Automated Password Generator)~
http://www.graviness.com/temp/pw_creator/
**JWTの署名に使用する X.509 証明書 [#k338b3fb]
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L173
-デプロイした先に合わせ証明書のパスを変更する。
-ココでは、Cドライブ直下ということなので、以下のようにパスを設定する。
--C:\MultiPurposeAuthSite\root\programs\MultiPurposeAuthSite\CreateClientsIdentity\CreateClientsIdentity_RS256.pfx
--C:\MultiPurposeAuthSite\root\programs\MultiPurposeAuthSite\CreateClientsIdentity\CreateClientsIdentity_RS256.cer"
*(4) 証明書をインストールする。 [#te05840e]
以下の位置にあるテスト用のJWT署名・検証用の証明書をインストールする。
-C:\MultiPurposeAuthSite\root\programs\MultiPurposeAuthSite\CreateClientsIdentity
** *.cer [#r8b711c5]
CreateClientsIdentity_RS256.cer をダブルクリックし、~
「信頼されたルート証明機関」にインストール
** *.pfx [#wac48fe8]
CreateClientsIdentity_RS256.pfx をダブルクリックし、~
証明書のインポートウィザードを使用してインストール（パスワードは "test"）
*(5) 疎通確認を行う。 [#f984838a]
-この設定状態ではメモリストアを使用しているため、デバッグを停止する度にユーザが初期化されるため注意する。
-毎回、サインアップを繰り返すのが面倒な場合は、[[テストユーザ>#b024e3a1]]のアカウントを使用すると良い。
**国際化対応の確認 [#cf3bea5e]
-ブラウザの既定の言語を変更すると（以下は、IEでの設定例）
#ref(IE_LanguageConfig.png,left,nowrap,国際化対応１)
-日英の国際化対応がされていることを確認できる。
#ref(DisplayedInEnglish.png,left,nowrap,国際化対応２,60%)
-国際化対応の動作を変更するには、以下のweb.configの設定を見直す。~
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/Web.config#L19
**レスポンシブデザインの確認 [#d97c9085]
-多用途 認証サイトの画面は、Open棟梁2.0テンプレートを使用しており、レスポンシブデザインに対応している。
-レスポンシブデザインの確認のため、画面サイズを小さくすると、メニューがハンバーガーメニューに変更されることを確認する。
#ref(ResponsiveWebDesign.png,left,nowrap,レスポンシブデザイン)
**サインアップ [#a63d7ac1]
ヘッダに表示されているSignupボタンを押下してサインアップ画面に遷移してサインアップを行う。
#ref(Signup.png,left,nowrap,サインアップ)
**E-mail confirmation [#z3e40ffa]
E-mailアドレスの確認（E-mail confirmation）を行う。
***確認用リンクの取得 [#r4066120]
この設定状態はデバッグモードなのでVisual Studioのデバッグ画面に確認用リンクが表示される。~
※ 本番時は、E-mailに本、確認用リンクを含んだE-mailが送信される。
#ref(E-mailConfirmation.png,left,nowrap,確認用リンクの取得)
***確認用リンクを貼り付けて実行 [#j11ea79e]
確認用リンクをブラウザのアドレスバーに貼り付けてEnter押下で以下の画面が表示される。~
「ログインするにはここをクリックしてください。」を押下してログイン画面に遷移する。
#ref(E-mailConfirmed.png,left,nowrap,確認用リンクを貼り付けて実行)
***サインイン [#uead025d]
ログイン画面でサインインする。
#ref(Signin.png,left,nowrap,サインイン)
**アカウント編集 [#f41ac715]
-サインインした後、ヘッダに表示されている「こんにちは[メールアドレス]さん！」をクリックし、アカウント編集を行う。
#ref(Edit.png,left,nowrap,アカウント編集)
-この設定状態では、SecurityStamp機能が有効になっている。~
この場合、編集後、幾らか時間が経過した後に自動的にサインアウトするので注意する。
***パスワードの変更 [#pd7c4e69]
-[パスワードの変更]リンクを押下して、[パスワードの変更]画面に遷移し、パスワード変更を行う。
-この設定状態では、SecurityStamp機能が有効になっている。~
この場合、編集後、幾らか時間が経過した後に自動的にサインアウトする。
-再度サインインする際、変更後のパスワードでサインインできることを確認する。
***電話番号の設定 [#hece1649]
-[電話番号の設定]リンクを押下して、[電話番号の設定]画面に遷移し、電話番号設定を行う。
-[電話番号の設定]を行うと、電話番号の確認（TelNum confirmation）が行われる。
-この設定状態はデバッグモードなのでVisual Studioのデバッグ画面に確認コードが表示される。~
※ 本番時は、携帯電話（スマホ）に本コードを含んだSMSが送信される。
#ref(TelNumConfirmation.png,left,nowrap,電話番号の確認コード)
-確認コードを入力して実行すると以下の画面が表示される。
#ref(TelNumConfirmed.png,left,nowrap,確認コードを入力して実行した結果)
-ここで、電話番号が入力できたことを確認する。
-必要に応じて、[電話番号の削除]リンクを押下して、電話番号の削除をテストする。
***2要素認証をオンにする [#t86e475c]
-2要素認証の[有効にする]リンクを押下して、2要素認証をオンにする。
#ref(EnableTwo-FactorAuthentication.png,left,nowrap,2要素認証をオンにする)
-この状態で別のブラウザ（Chrome ---> Internet Explorer）を立ち上げてサインインを試みる。
-すると、以下のような画面が表示されるので、好みの通知プロバイダを選択して送信を押下する。~
（電子メールコードと電話コードから選択可能だが、電話コードは電話番号を入力しておかないと表示されない）
#ref(Two-FactorAuthentication.png,left,nowrap,2要素認証)
-後は、前述の[[電話番号の設定>#u625914a]]のように、確認コードが送信されるので、~
ソレを使用して2要素認証のプロセスを完了することで、別ブラウザでもサインインできるようになる。
**パスワード・リセット [#w188afb8]
-次に、パスワード・リセットを行うので、ヘッダに表示されているSignoutボタンを押下して一度サインアウトを行う。
-ヘッダに表示されているSignupボタンを押下してサインアップ画面に遷移する。
-このサインアップ画面で、「パスワードを忘れた場合。」リンクを押下する。
-すると、以下の「パスワードを忘れましか？」画面に遷移するため、~
自分のアカウントのE-mailのアドレスを入力して送信ボタンを押下する。
#ref(PasswordReset.png,left,nowrap,パスワード・リセット)
-後は、前述の[[E-mailアドレスの確認（E-mail confirmation）>#v3d2ab0c]]のように、確認用リンクが送信されるので、~
ソレを使用してパスワード・リセットのプロセスを完了させることでパスワード失念時もセルフのリカバリができる。
-パスワード・リセットのプロセスの完了後、確認のためサインインが成功することを確認する。
**アカウントのロックアウト [#b2ae184f]
-次に、アカウントのロックアウトの確認を行うので、ヘッダに表示されているSignoutボタンを押下して一度サインアウトを行う。
-[[初期状態では、5回間違えると5分間>https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L127]]、アカウントのロックアウトが行われる（指定の回数、サインインに失敗すると以下の画面が表示される）。
#ref(AccountLockout.png,left,nowrap,アカウントのロックアウト)
-アカウントのロックアウト中はサインインが失敗することを確認し、~
指定時間経過後にアカウントのロックアウトが解除され、サインインが成功することを確認する。
*(6) OAuth2の機能確認を行う。 [#nde458fe]
**Authorization Codeグラント種別 [#tad2bf60]
以下は未サインイン時のシーケンス。~
サインイン済みの場合は、ログイン画面がショートカットされる。
***フローを開始する。 [#rfdc2790]
スターターのリンクをクリックする。
#ref(AuthorizationCode1.png,left,nowrap,AuthorizationCode：フローを開始する。)
***権限を認可する。 [#b53e16b5]
-ログイン画面が表示され、サインイン後に、以下の権限認可画面が表示される。
-権限とはスターターのリンクに設定されているscopeというクエリ文字列
#ref(AuthorizationCode2.png,left,nowrap,AuthorizationCode：権限を認可する。)
***確認画面(テスト用)で確認する。 [#za6451b6]
-以下の画面が表示され、Bearer Tokenを確認できる。~
※注意 : この画面はテスト用。本来ココに表示されている情報は画面上に露見させない。
#ref(AuthorizationCode3.png,left,nowrap,AuthorizationCode：結果を確認する。,60%)
-以下は確認画面(テスト用)の項目値の説明
--State
---CSRF(XSRF)を防止するための値
---上段エンドポイントで取得したQuery値
---下段がスターターのリンクに格納したQuery値（テスト用にSessionで取得）
--Code~
Authorization CodeのCodeの値（Bearer Tokenに変換する前のコード）
--Access Token
---Jwt~
JWT形式のAccess Token(JWTに関する詳細は[[コチラ>https://techinfoofmicrosofttech.osscons.jp/index.php?JWT]]を参照のこと)
---Json~
JWTのペイロード部分をBase64UrlデコードしたJSON文字列。~
[[IDトークンと同じ形式>https://techinfoofmicrosofttech.osscons.jp/index.php?OpenID%20Connect#ofb73c59]]。これに、roles、scopesを追加してある。
{
"roles":["xxxx","yyyy"],
"scopes":["username","email","telno","aaa","bbb"],
"iss":"http://jwtssoauth.opentouryo.com",
"aud":"xxxx",
"sub":"xxxx@gmail.com",
"iat":"nnnn",
"exp":"nnnn",
"nonce":"nnnn",
"email":"xxxx@gmail.com"
}
--Refresh Token~
Access Tokenのリフレッシュ処理に使用するRefresh Token
--ボタン
---Refresh~
Refresh Tokenを用いてAccess Tokenのリフレッシュする Tokenエンドポイントを呼び出す。
---Get user claim~
Access Tokenを使用してユーザーのクレーム情報を取得するResources ServerのWeb APIを呼び出す。
--Response~
サーバーで行ったHTTPClientを使用したRESTのレスポンスを表示する。
***JWTの署名検証処理 [#b6c3cd0c]
-画面下部のリンクからhttps://jwt.io/にアクセスして、
-「Encoded PASTE A TOKEN HERE」欄に前述の「Access Token(Jwt)」を貼り付ける。
-すると、JWTのヘッダーとペイロードがBase64UrlデコードされJSONが表示される。
-次に、「ALGORITHM」欄のドロップダウンリストを「RS256」に切替える。
-この状態で、以下のpublicKey.key中の公開鍵を「VERIFY SIGNATURE」欄のPublic Keyに貼り付けると、~
C:\MultiPurposeAuthSite?\root\programs\MultiPurposeAuthSite?\CreateClientsIdentity?\publicKey.key
#ref(jwt_io1.png,left,nowrap,JWTの署名検証処理１,60%)
-[Invalid Signature]（赤）→[Signature Verified]（青）に表示が切り替わり、JWTの署名が検証されたことを確認できる。
#ref(jwt_io2.png,left,nowrap,JWTの署名検証処理２,60%)
**Implicitグラント種別 [#n81487c7]
以下は未サインイン時のシーケンス。~
サインイン済みの場合は、サインイン画面がショートカットされる。
***フローを開始する。 [#jdc1be1f]
スターターのリンクをクリックする。
#ref(Implicit1.png,left,nowrap,Implicit：フローを開始する。)
***確認画面(テスト用)で確認する。 [#z9c90649]
-以下の確認画面(テスト用)が表示される。
-[Get user claim]ボタンを押下するとAccess Tokenを使用してユーザーの~
クレーム情報を取得するResources ServerのWeb APIを呼び出すことができる。
#ref(Implicit2.png,left,nowrap,Implicit：結果を確認する。)
-以下のようにWeb API呼出の結果が表示される。
#ref(Implicit3.png,left,nowrap,Implicit：結果を確認する。)
**Resource Owner Password Credentialsグラント種別 [#w5277c28]
[[こちら>多用途認証サイトの動作検証#ff1f98d1]]の手順に従ってテストを行う。
**Client Credentialsグラント種別 [#b2f15820]
[[こちら>多用途認証サイトの動作検証#dc7b96b2]]の手順に従ってテストを行う。
*(7) ユーザストアをメモリストアからDBMSに変更する [#o0b4eef3]
*(8) Internet アクセス用のInternetProxy設定を設定する。 [#e69a8e18]
企業内から社内プロキシ経由で評価する場合に、~
Internet アクセス用のInternetProxy設定を設定する。~
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L50
-UseInternetProxy : true
-InternetProxyURL : urlを入力
-Proxy credential
--InternetProxyUID : ユーザID
--InternetProxyPWD : パスワード
*(9) 外部ログイン [#dddf2d61]
**app.configファイルを設定する。 [#bef0a00f]
https://github.com/OpenTouryoProject/MultiPurposeAuthSite/blob/develop/root/programs/MultiPurposeAuthSite/MultiPurposeAuthSite/app.config#L50
*(10) オンライン決済 [#h18acb23]
*(11) Notification Providerをテストする [#na0b8ee9]
**Smtp [#v57844e8]
**SMS(Twilio) [#o6f39501]
*(12) オプションを変更してテストする [#sc13e508]
**UID＝メアド以外 [#scf52f44]
**マルチテナント [#d1ca33bd]
***マルチテナントの場合 [#edc4fa45]
***マルチテナントでない場合 [#ya84e95b]
*(13) OAuth2の3分割テストを行う。 [#p57f0e1a]
多用途認証サイトをOAuth2で登場する3つのサーバー機能に分割して動作検証をする。
-Client
-Authorization Server
-Resource Server
*参考 [#cc978ccf]
-[[多用途認証サイト（Multi-purpose Authentication Site）]]
-[[多用途認証サイトの動作検証]]
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
