次の方法で共有


パスワード変更ページを簡単に作る方法

download1.gif サンプル コードのダウンロード (aspnettips_ChangePassword.msi, 235 KB) ※このサンプルをお使いいただくためには、 が必要です。

セキュリティ上、パスワードを定期的に変更することは有用です。そのため、パスワードを変更するためのページの需要は多くあります。 ASP.NET 2.0 では、パスワード変更ページを簡単に作るための ChangePassword コントロールが用意されています。このコントロールを使えば、コードの追加をせずにパスワード変更機能を実装することができます。

今回は ChangePassword.aspx Web フォームを追加した状態から、その上に標準的なパスワード変更機能を実装します。なお、あらかじめ Web サイト管理ツールを使って、サイトへのアクセス方法を「インターネットから」に設定し、フォーム認証を有効にしておきます(Web.config を直接編集しても可)。

Cc719204.ChangePassword_fig01(ja-jp,MSDN.10).gif

 図 1 今回作成するページ

今回は、次の手順でパスワード変更機能を作成します。

  1. ChangePassword コントロールを配置

  2. コントロールのデザインを設定

  3. ボタンやラベルの表示テキストを編集

  4. リダイレクト先 URL を設定

  5. 実行

(1) ChangePassword コントロールを配置

最初に、ChangePassword コントロールを配置します(図2)。HTML ソースではこのような形で記述されることになります(図3)が、ページを整形する場合はこの <asp:ChangePassword ...> ~ </ asp:ChangePassword> の部分を崩さないよう注意してください。

Cc719204.ChangePassword_fig02(ja-jp,MSDN.10).gif

 図 2 ChangePassword コントロール

Cc719204.ChangePassword_fig03(ja-jp,MSDN.10).gif

 図 3 HTML ソース

(2) コントロールのデザインを設定

次に、ChangePassword コントロールに対してデザインを設定します。プロパティの「スタイル」グループ(図4)で細かい設定ができるほか、デザイナ上から「ChangePassword タスク」を展開し、[オートフォーマット] を利用することも可能です。今回は、オートフォーマットで「クラシック」を選択します(図5)。

 図

 図 4 スタイルに関するプロパティ

Cc719204.ChangePassword_fig05(ja-jp,MSDN.10).gif

 図 5 オートフォーマットによる整形

(3) ボタンやラベルの表示テキストを編集

必要に応じて、ボタンやラベルの表示テキストを変更します。そのために、プロパティの「表示」グループ内の値を編集します。最初に、 [パスワード:] ラベルの表示テキストを「現在のパスワード:」に変更するため、PasswordLabelText プロパティを編集します。続いて、変更完了画面のタイトルを「パスワードの変更完了」にするため、SuccessTitleText プロパティを編集します(図7)。完了画面の編集結果を確認するには、デザイナーから「ChangePassword タスク」を開き、「ビュー」で「正常に完了」を選びます(図7)。

ChangePassword_fig06.gif

 図6 ラベルの表示テキストを変更

Cc719204.ChangePassword_fig07(ja-jp,MSDN.10).gif

 図 7 編集結果の確認

(4) リダイレクト先 URL を設定

パスワード変更が成功した後で [ 続行 ] ボタンをクリックしたときのリダイレクト先 URL は、ContinueDestinationPageUrl プロパティに指定します。また同様に、パスワード変更をキャンセルしたときにリダイレクトするページの URL は、CancelDestinationPageUrl プロパティに指定します。今回は、[ 続行 ] ボタンクリック時、キャンセル時とも「~/Default.aspx」を指定します(図8)。

 図

 図 8 リダイレクト先の設定

(5) 実行

以上で準備が整いました。あらかじめ設定したユーザー(ユーザー名「testUser」、パスワード「testUser01#」)でログインした状態から、PasswordRecover.aspx を開きます。ここで、現在のパスワードと、新しいパスワードを入力します(図9)。

Cc719204.ChangePassword_fig09(ja-jp,MSDN.10).gif

 図 9 新旧パスワードの入力

[ パスワードの変更 ] ボタンをクリックすると、パスワード変更処理が実行されます。古いパスワードが違っていたり、新しいパスワードの設定に問題があったりした場合は、エラーメッセージが表示されます(図10)。パスワード変更に成功した場合は、変更完了画面が表示されます(図11)。この変更完了画面の [ 続行 ] ボタンをクリックすると、Default.aspx へリダイレクトされます。

Cc719204.ChangePassword_fig10(ja-jp,MSDN.10).gif

 図 10 パスワード変更失敗

Cc719204.ChangePassword_fig11(ja-jp,MSDN.10).gif

 図 11 パスワード変更成功