チュートリアル : ユーザー コントロールに Web パーツ パーソナル化を実装する
更新 : 2007 年 11 月
このチュートリアルは、Web パーツ パーソナル化によりユーザー固有の既定値を Web ページ上に提供する、ASP.NET ユーザー コントロールの作成方法について説明します。
ASP.NET Web パーツを使用すると、ユーザーは、目的に合わせて外観と内容を変更できるモジュール式のレイアウトを使用して、Web ページを作成できます。パーソナル化と呼ばれる重要な Web パーツ機能では、各ページのユーザー固有の設定を保存し、その後のブラウザ セッションでこれらの設定を再利用できます。
Web パーツとパーソナル化を使用すると、多くの Web アプリケーションで役に立つ機能、つまり、ユーザー固有の既定値をフォームに提供する機能を備えた Web ページを作成できます。このチュートリアルでは、ユーザー固有の既定値を、ユーザー コントロール (パーソナル化できる Web パーツ コントロールと見なされる) を実装することで提供する方法を示します。この開発方法は、たとえばカスタマ サービス エージェント用のアプリケーションを作成してオンライン フォームに入力するような場合に役立つことがあります。Web パーツとパーソナル化の機能を使用すると、ページで各エージェントを認識できます。ユーザー コントロールにより、各エージェントはフォーム上のフィールドの既定値を保存でき、その後ページにアクセスしたときにその既定値が自動的に埋め込まれます。
メモ : |
---|
このチュートリアルで作成するユーザー コントロールは、WebPart クラスを継承しません。ただしこのチュートリアルでは、ユーザー コントロールが WebPart コントロールとして機能できることを学びます。チュートリアルを実行しているときに、ユーザー コントロールを WebPartZoneBase ゾーンに追加します。これにより、ASP.NET が GenericWebPart コントロールでユーザー コントロールをラップします。これで、ユーザー コントロールは他の WebPart コントロールのように動作するため、パーソナル化について学ぶことができます。 |
このチュートリアルでは、次の作業を行う方法について説明します。
パーソナル化できるプロパティを持つユーザー コントロールを作成し、その値を長期ストレージに保存します。
Web ページのフォーム上にユーザー固有の既定値を表示します。
ゾーン内のユーザー コントロールを実際の WebPart コントロールとして操作します。
メモ : この種のアプリケーションは、ASP.NET プロファイルを使用して開発できます。ただし、この場合、買い物カゴ アプリケーションのように、ユーザーに関してアプリケーション全体で再利用する情報は格納されません。代わりに、ページごとのユーザー固有の設定または各コントロールの設定を保存します。プロファイルの詳細については、「ASP.NET プロファイル プロパティの概要」を参照してください。
前提条件
このチュートリアルを実行するための要件は次のとおりです。
サイトをホストするコンピュータにインストールして構成したインターネット インフォメーション サービス (IIS: Internet Information Services)。IIS のインストールと構成の詳細については、インストールに含まれている IIS ヘルプ ドキュメント、または Microsoft TechNet サイト (Internet Information Services 6.0 Technical Resources) にある IIS オンライン ドキュメントを参照してください。
個別のユーザーを識別できる ASP.NET Web サイト。そのようなサイトを既に構成している場合は、このチュートリアルの開始点としてそのサイトを使用できます。サイトをまだ構成していない場合、仮想ディレクトリまたはサイトの作成方法の詳細については、「方法 : IIS 5.0 および 6.0 内で仮想ディレクトリを作成および構成する」を参照してください。
設定済みのパーソナル化プロバイダとデータベース。Web パーツのパーソナル化は既定で有効に設定されており、Microsoft SQL Server Standard Edition の SQL パーソナル化プロバイダ (SqlPersonalizationProvider) を使用して、パーソナル化データを格納します。このチュートリアルでは、SSE と既定の SQL プロバイダを使用します。SSE をインストール済みである場合、構成は必要ありません。SSE は、Microsoft Visual Studio 2005 のインストールのオプション部分または無料のダウンロードとして使用できます。詳細については、Microsoft SQL Server 2005 Express Edition Web サイトを参照してください。SQL Server の完全なバージョンのいずれかを使用するには、ASP.NET アプリケーション サービス データベースをインストールして構成し、SQL パーソナル化プロバイダを構成してそのデータベースに接続する必要があります。詳細については、「SQL Server 向けアプリケーション サービス データベースの作成と構成」を参照してください。また、SQL データベース以外のデータベースやストレージ ソリューションで使用するカスタム プロバイダを作成して設定することもできます。詳細とコード例については、「メンバシップ プロバイダの実装」を参照してください。
パーソナル化できるユーザー コントロールの作成
ここでは、エージェントの情報フォーム用のユーザー インターフェイス (UI) を備えたユーザー コントロールを作成します。また、このコントロールは、名前や電話情報用のパーソナル化できるプロパティを公開します。
メモ : |
---|
Web パーツ パーソナル化は既定で有効になるため、有効にする必要はありません。パーソナル化の詳細については、「Web パーツのパーソナル化の概要」を参照してください。 |
ユーザー コントロール用のパーソナル化できるプロパティを作成するには
テキスト エディタで新しいファイルを作成し、ファイルの先頭に次のコントロール宣言と、開始と終了の <script> タグを追加します。
<%@ control language="VB" classname="AccountUserControl" %> <script runat="server"> </script>
<%@ control language="C#" classname="AccountUserControl" %> <script runat="server"> </script>
次の例に示すように、UserName という名前と Phone という名前の 2 つのパーソナル化できるプロパティを作成するコードを、<script> タグ内に追加します。
メモ : それぞれのプロパティが Personalizable 属性を持ちます。これにより、Web パーツ パーソナル化が、データベースにプロパティ値を格納できるようになります。
<Personalizable()> _ Property UserName() As String Get If Textbox1.Text Is Nothing Or Textbox1.Text.Length < 0 Then Return String.Empty Else Return Textbox1.Text End If End Get Set(ByVal value As String) Textbox1.Text = value End Set End Property <Personalizable()> _ Property Phone() As String Get If Textbox2.Text Is Nothing Or Textbox2.Text.Length < 0 Then Return String.Empty Else Return Textbox2.Text End If End Get Set(ByVal value As String) Textbox2.Text = value End Set End Property
[Personalizable] public string UserName { get { if(Textbox1.Text == null | Textbox1.Text.Length < 0) return String.Empty; else return Textbox1.Text; } set { Textbox1.Text = value; } } [Personalizable] public string Phone { get { if(Textbox2.Text == null | Textbox2.Text.Length < 0) return String.Empty; else return Textbox2.Text; } set { Textbox2.Text = value; } }
セキュリティに関するメモ : このコントロールは、ユーザー入力を受け付けるテキストボックスを持つため、セキュリティ上の脅威になる可能性があります。既定では、ASP.NET Web ページはユーザー入力を検証し、入力に HTML 要素やスクリプトが含まれていないことを確認します。詳細については、「スクリプトによる攻略の概要」を参照してください。
ファイルに AccountUserControlCS.ascx または AccountUserControlVB.ascx (使用する言語に応じて異なります) という名前を付け、Web サイトのルート ディレクトリに保存します。
これで、パーソナル化できるプロパティが追加されて既定値が保存されるため、ユーザー コントロールに UI コントロールを追加してユーザーの名前と電話番号を表示できます。
ユーザー コントロールに UI コントロールを追加するには
次のコード例に示すように、<script> タグの下に、<div> タグでラップされた Label コントロールと TextBox コントロールを追加し、ユーザーの名前を格納します。
<div> <asp:label id="Label1" runat="server">Name</asp:label> <asp:textbox id="Textbox1" runat="server" /> </div>
次に示すように、上で追加したコントロールの下に、<div> タグでラップされた Label コントロールと TextBox コントロールを追加し、ユーザーの電話番号を格納します。
<div> <asp:label id="Label2" runat="server">Phone</asp:label> <asp:textbox id="Textbox2" runat="server" /> </div>
上で追加したコントロールの下に、<div> タグでラップされた <asp:button> 要素を追加し、ポストバックを実行してユーザーの情報を保存します。
<div> <asp:button id="Button1" runat="server" text="Save Form Values" /> </div>
ファイルを保存します。
Web パーツ コントロールとしてのユーザー コントロールの参照
これで、パーソナル化できるプロパティを持つユーザー コントロールが作成されたため、ASP.NET Web ページを作成し、このユーザー コントロールを Web パーツ コントロールとしてホストできます。パーソナル化機能が動作するには、コントロールを Web パーツ コントロールとしてホストする必要があります。
ユーザー コントロールを Web パーツ コントロールとして参照するには
テキスト エディタで新しいファイルを作成し、ファイルの先頭に次のページ宣言を追加します。
<%@ page language="VB" %>
<%@ page language="C#" %>
次の例に示すように、ページ宣言の下に、前に作成したユーザー コントロールを参照する宣言を追加します。
<%@ register tagprefix="uc1" tagname="AccountUserControl" src="AccountUserControlvb.ascx"%>
<%@ register tagprefix="uc1" tagname="AccountUserControl" src="AccountUserControlcs.ascx"%>
コントロール参照の下に、ユーザー コントロールを Web パーツ コントロールとしてホストする、次の基本的なページ構造を追加します。
メモ : ユーザー コントロールが Web パーツ コントロールとして機能するには、ページに <asp:webpartmanager> 要素を組み込み、ユーザー コントロールを <asp:webpartzone> 要素および <zonetemplate> 要素に連続して組み込む必要があります。
<html> <head runat="server"> <title>Personalizable User Control</title> </head> <body> <form id="form1" runat="server"> <asp:webpartmanager id="WebPartManager1" runat="server" /> <asp:webpartzone id="zone1" runat="server" headertext="Main"> <zonetemplate> <uc1:AccountUserControl runat="server" id="accountwebpart" title="Agent Information" /> </zonetemplate> </asp:webpartzone> </form> </body> </html>
ファイルに Hostaccountcontrol.aspx という名前を付け、ユーザー コントロールと同じディレクトリに保存します。
これでパーソナル化できるユーザー コントロールが作成され、Web フォーム ページでそれが Web パーツ コントロールとして参照されます。最後の手順では、このユーザー コントロールをテストします。
パーソナル化できるユーザー コントロールをテストするには
Hostaccountcontrol.aspx ページをブラウザに読み込みます。
[Name] フィールドおよび [Phone] フィールドに値を入力し、[Save Form Values] をクリックします。
ブラウザを閉じます。
ページをもう一度ブラウザに読み込みます。
前で入力した値がフォームに表示されます。これらは、パーソナル化できるプロパティに保存され、ブラウザにページを読み込んだときにデータベースから復元された値です。
フォームに新しい名前を入力しますが、保存を実行するボタンはクリックしません。
ブラウザを閉じます。
ページをもう一度ブラウザに読み込みます。
パーソナル化したプロパティに入力および保存した元の値は、新しい値を保存していないため、フォームに再表示されます。
次の手順
このチュートリアルでは、パーソナル化できるプロパティを持つユーザー コントロールの作成に関連する基本的な作業について説明しました。特定のコントロールおよびページ用のユーザー固有の設定を保存し、新しいブラウザ セッションでユーザーがページにもう一度アクセスすると、保存されたこれらの設定を表示できるコントロールを作成しました。次に行う作業の例を示します。
Web パーツ ページの作成に関連するその他のコンポーネントについて調べます。概要については、「チュートリアル : Web パーツ ページの作成」を参照してください。
ユーザー コントロールの操作についてさらに習得します。詳細については、「ASP.NET ユーザー コントロールの概要」を参照してください。
ユーザー コントロールに比べてプログラムによるより詳細な制御が可能で、すべての範囲の Web パーツ機能を備えた独自のカスタム Web パーツ コントロールを作成する方法について習得します。詳細については、「方法 : ユーザー コントロールを Web パーツ コントロールとして処理する」を参照してください。