JavaScriptを使用したフォーム認証の利用
JavaScriptとScriptManagerコントロールの組み合わせで、ASP.NETのフォーム認証サービスを呼び出して利用できます（図4・図5）。
この機能を利用すると、クライアントサイドからプロファイルサービスや、ロールサービス（次項で解説）を呼び出して活用することができます。この機能はASP.NET 2.0 AJAX Extensionsでも実装可能でしたが次項の理解を深めるために、ここでも解説します。
なお、この利用方法は、「［ASP.NET AJAX］クライアントサイド・スクリプトからASP.NETの認証機能を利用するには？」にて詳しく解説されています。
手順としては以下のようになります。
- Web サイト管理ツールからユーザーを登録する
- web.configに認証サービスの有効化設定をする
- Webフォームを作成する
- 認証サービスを呼び出すJavaScriptを記述する
Web サイト管理ツールからユーザーを登録する
メニューバーの［Webサイト］から［ASP.NET 構成］を選択し、Webサイト管理ツールを起動します。その後、ロールの作成（サンプルではAdminとUser）、ユーザーの作成を行います（図6、図7）。
web.configで認証サービスを有効化する
続いて、認証サービスを利用するためにweb.configに有効化するためにauthenticationService要素のenabled属性をtrueに設定します。
<system.web.extensions> <scripting> <webServices> <authenticationService enabled="true"/> </webServices> </scripting> </system.web.extensions>
なお、本稿では認証ユーザーのみがアクセス可能なフォルダとしてRoleフォルダを用意しています。ソリューション エクスプローラ上でRoleフォルダを作成し、その直下に以下の記述をしたweb.configを配置します。これで、ログインしたユーザーのみがRoleフォルダ内にアクセスできます。
<authorization> <deny users="?"/> <allow users="*"/> </authorization>
Webフォームを作成する
それでは、実際に利用するWebフォームの作成をします。
<asp:ScriptManager ID="ScriptManager1" runat="server"> <Scripts> <asp:ScriptReference Path="~/Authentications.js" /> </Scripts> </asp:ScriptManager> <table> <tr> <td>ユーザー名</td> <td><input type="text" id="username" /></td> </tr> <tr> <td>パスワード</td> <td><input type="password" id="password" /></td> </tr> <tr> <td colspan="2" align="center"> <button onclick="OnClickLogin(); return false;">Login</button> </td> </tr> </table>
ポイントはASP.NETで提供されているログインコントロールを一切利用していない点です。
認証サービスを呼び出すJavaScriptを記述する
最後に、認証サービスを呼び出すJavaScriptファイルの記述を行います。前項で設定したLoginボタンをクリックされた時に、Microsoft AJAX LibraryのSys.Services.AuthenticationServiceクラスを利用して認証サービスにアクセスします。
/// <reference name="MicrosoftAjax.js"/> var username; var password; // ページロード時に実行される処理 function pageLoad() { username = $get("username"); password = $get("password"); } // Loginボタンクリック時に実行される処理 function OnClickLogin() { // 認証サービスへのアクセス // 今回はユーザー名・パスワード・ログイン認証後の //リダイレクト先のURLを設定 Sys.Services.AuthenticationService.login(username.value, password.value,false,null,"Role/Default.aspx",null,null,null); }
以上の設定でJavaScriptを使用したフォーム認証は完成です。実行すると、登録したユーザー・パスワードを入力した時のみ「Role/Default.aspx」へとリダイレクトされます（図4・図5）。
Sys.Services.AuthenticationService.loginメソッドでは、次のような構文で記述することになっています。実際に設定した内容と照らし合わせて見てください。
Sys.Services.AuthenticationService.login(
ユーザー名(必須),
パスワード。既定値はnull,
クッキーを永続的に保持するかどうか。既定値はfalse,
カスタム情報（将来使用するために予約済）。既定値はnull,
リダイレクト先のURL。既定値はnull,
処理成功時のコールバック関数。既定値はnull,
例外発生時のコールバック関数。既定値はnull,
ユーザー コンテキスト)
また、同じような手順でクライアントサイドからプロファイルサービスの呼び出しも可能です。こちらについては、「［ASP.NET AJAX］クライアントサイド・スクリプトからASP.NETのプロファイル機能を利用するには？」にて詳しく解説されているので、そちらを参考にしてください。
