Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

Visual Studio 2008とASP.NET 3.5で広がったクライアントサイド開発

Visual Studio 2008徹底入門(4)

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
目次

JavaScriptを使用したロール情報の利用

 ASP.NET 3.5ではMicrosoft AJAX LibraryとScriptManagerコントロールを利用して、ASP.NETロールサービスを呼び出して利用することができます。つまり、クライアントサイドでロールベースの制御が可能になりました。

 クライアントサイドでロールを参照できると、ロールによってコントロールの表示やデザインを変更、表示するデータの範囲を絞ることが可能になります(図8・図9)。

図8 Adminユーザーのページ
図8 Adminユーザーのページ
図9 Userユーザーのページ
図9 Userユーザーのページ

 手順としては以下のようになります(前項で作成したWebサイトを利用しています)。

  1. web.configにロールサービスの有効化設定をする
  2. Webフォームを作成する
  3. ロールサービスを呼び出すJavaScriptを記述する

web.configにロールサービスの有効化設定をする

 ロールサービスを利用するためにweb.configに有効化設定を記述します。

web.configの設定
<system.web.extensions>
    <scripting>
        <webServices>
            <authenticationService enabled="true"/>
            <roleService enabled="true"/>
        </webServices>
    </scripting>
</system.web.extensions>

 ロールサービスを利用するために、roleService要素のenabled属性をtrueに設定しています。

Webフォームを作成する

 今回はロールによる外観を変化させるために、認証後リダイレクトされるページ(Role/Default.aspx)Webフォーム上にいくつかのコントロールと、ロールサービスにアクセスするためにScriptManagerコントロールを配置します。

Role/Default.aspxの一部
<form id="form1" runat="server">
    <h1><div id="Role" ></div></h1>
    <asp:ScriptManager ID="ScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Path="Role.js" />
        </Scripts>
    </asp:ScriptManager>
    
    <asp:Calendar ID="Calendar1" runat="server"></asp:Calendar>
    <asp:HyperLink ID="HyperLink1" 
runat="server" NavigateUrl="~/LogIn.aspx">
Login状態保持のままLoginページへ</asp:HyperLink> <asp:Button ID="Button1" runat="server"
Text="Button" OnClientClick="return false;" />
<div id="placeHolder"> <button id="LogOutButton"
onclick="OnClick_LogOut();">
LogOut</button> </div> </form>

 また、外観を変更するためのCSSも記述します。こちらも至ってシンプル。

Role.css
.Admin
{
    background-color: #0000FF;
    color: #FFFFFF;
    font-family: メイリオ;
    font-size: x-large;
}

.User
{
    background-color: #000000;
    color: #FFFFFF;
    font-family: メイリオ;
    font-size: x-large;
}

ロールサービスを呼び出すJavaScriptを記述する

 ロールサービスを呼び出すJavaScriptファイルの記述は以下のようになります。今回はAdminとRoleの2種類、そしてどちらかのロールにしか属していないことからシンプルなコードにしています。

Role/Role.js
/// <reference name="MicrosoftAjax.js"/>

var roleProxy;

        //  ページロード時に実行される処理
        function pageLoad(){
            
            roleProxy = Sys.Services.RoleService;
            roleProxy.load(LoadCompletedCallback);
        }

        //  読み込み処理完了時のコールバック関数
        function LoadCompletedCallback(roles)
        {
            //  roles[0]は認証済みのユーザーのロール
            //  それぞれにロールのテキストを表示
            var roleInfo = "Role: " + roles[0];
            $get("Button1").value = roleInfo;
            $get("Role").innerHTML = roles[0];

            //  Adminロール・Userロールによって表示を切り替え
            //  .classNameにてRoleのクラス名を設定し、CSSを反映            
            if (roles[0] == "Admin"){
                $get("Button1").className = "Admin";
                $get("Role").className = "Admin";
                $get("Calendar1").style.visibility = "visible";
                $get("HyperLink1").style.visibility = "hidden";
            }
            else if(roles[0] == "User")
            {
                $get("Button1").className = "User";    
                $get("Role").className = "User";
                $get("Calendar1").style.visibility = "hidden";
                $get("HyperLink1").style.visibility = "visible";
            }
        }

 以上の設定でJavaScriptを使用したロールサービスの利用は完成です。実際に実行すると、ユーザーのロールによって、「Role/Default.aspx」のページの表示が変わります(図8・図9)。

 Sys.Services.RoleService.loadメソッドでは、以下のような構文で記述することになっています。実際に設定した内容と照らし合わせて見てください。

loadメソッドの構文
Sys.Services. RoleService.load (
    処理成功時のコールバック関数。既定値はnull,
    例外発生時のコールバック関数。既定値はnull,
    ユーザー コンテキスト)

 Sys.Services. RoleServiceは他に以下メンバがあります。

Sys.Services. RoleServiceクラスのメンバ
メンバ 概要
DefaultWebServicePathフィールド ロールサービスへのパスを指定
loadメソッド 認証ユーザーのロールを読み込む
defaultFailedCallbackプロパティ 例外発生時のコールバック関数の取得・設定
defaultLoadCompletedCallbackプロパティ 読み込み完了時のコールバック関数の取得・設定
defaultSucceededCallbackプロパティ 処理成功時のコールバック関数の取得・設定
defaultUserContextプロパティ ユーザーコンテキストの取得・設定
IsUserinRoleプロパティ 認証ユーザーが指定されたロールかチェック
pathプロパティ ロールサービスのパスを取得・設定
roles プロパティ 認証ユーザーのロールを取得
timeoutプロパティ ロールサービスサービスのタイムアウトを取得・設定

まとめ

 今回はASP.NET 3.5周りの変更点をいくつかピックアップして紹介してきました。今回の記事でサーバーサイドからのアプローチ以外に、クライアントサイドからのアプリケーション作成の可能性も感じてもらえたかと思います。今まで、ASP.NET(サーバーサイド)のみでしか利用していなかった方も、少しクライアントサイド開発に目を向けていただけたら幸いです。

 次回は、VS2008を利用することで開発を行いやすくなったWPFです。お楽しみに。

参考資料

  1. ScottGu's Blog
  2. Chica's Blog
  3. Visual Studio 2008 Professional Edition
  4. MSDN ライブラリ
 


  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

  • 山田 祥寛(ヤマダ ヨシヒロ)

    静岡県榛原町生まれ。一橋大学経済学部卒業後、NECにてシステム企画業務に携わるが、2003年4月に念願かなってフリーライターに転身。Microsoft MVP for ASP/ASP.NET。執筆コミュニティ「WINGSプロジェクト」代表。 主な著書に「入門シリーズ(サーバサイドAjax/XMLD...

  • WINGSプロジェクト りばてぃ/FUJIKO/ナオキ(リバティ, フジコ, ナオキ)

    <WINGSプロジェクトについて> 有限会社 WINGSプロジェクトが運営する、テクニカル執筆コミュニティ(代表 山田祥寛)。主にWeb開発分野の書籍/記事執筆、翻訳、講演等を幅広く手がける。2018年11月時点での登録メンバは55名で、現在も執筆メンバを募集中。興味のある方は、どしどし応募頂...

バックナンバー

連載:Visual Studio 2008徹底入門

もっと読む

All contents copyright © 2005-2019 Shoeisha Co., Ltd. All rights reserved. ver.1.5