Flexアプリケーションの開発におけるCFCの役割について
必要条件
ユーザーレベル
すべて
ColdFusionの経験豊富なデベロッパーは、Webアプリケーション開発において、Adobe ColdFusionアプリケーションサーバーでデータおよびHTML生成機能を使用することに慣れています。 この記事では、ColdFusionコンポーネント（CFC）によって、フロントエンドのAdobe Flexアプリケーションにバックエンドデータサービスを提供する方法について説明します。また、Flexアプリケーションの開発でCFCを扱うのに役立つ、Adobe Flash Builder 4ベータ版ツールについても説明します。
CFCへのビジネスロジックの組み込み
ColdFusionのデベロッパーの多くは、アプリケーションのプログラミングを手続き型で行います。つまり、ColdFusionサーバーが最初から最後に向かって処理できるように、CFMLコードを記述します。次のコードは、データベースに対してクエリーを実行し、値をHTMLテーブルに出力するための、一般的な手続き型CFMLディレクティブです。
<cfquery datasource="F4CF_FictitiousSalesPlanner" name="qEmployees">
SELECT FirstName, LastName, Email, Phone, Region
FROM SalesTargets
</cfquery>
<table border="1" cellpadding="10">
<tr>
<td>FIRST NAME</td>
<td>LAST NAME</td>
<td>EMAIL</td>
<td>PHONE</td>
<td>REGION</td>
</tr>
<cfoutput query="qEmployees">
<tr>
<td>#qEmployees.FIRSTNAME#</td>
<td>#qEmployees.LASTNAME#</td>
<td>#qEmployees.EMAIL#</td>
<td>#qEmployees.PHONE#</td>
<td>#qEmployees.REGION#</td>
</tr>
</cfoutput>
</table>
ColdFusionは、以下の2つの目的のために使用されます。
- データベースからデータを取得する(また、必要に応じてその他のサーバー側サービスを実行する)
- アプリケーションのユーザーインターフェイスのためのHTMLコードを動的に生成する
ColdFusionとFlexの開発では、フロントエンドのユーザーインターフェイスコードとバックエンドのビジネスロジックを完全に分離する必要があります。ユーザーインターフェイスはFlexフレームワークで作成し、ビジネスロジックはCFCに組み込むのです。
CFCを作成する最初のステップは、サーバー側のニーズを分析してロジック単位に落とし込むことです。このコードでは、アプリケーションには従業員情報が表示されるので、ビジネスロジックCFCの論理名はEmployee.cfcです。
次に、CFCで1つまたは複数の関数を作成し、次のコードのように、cffunctionタグで囲みます
<cfcomponent>
<cffunction name="getEmployees">
<cfargument name="region" type="string" />
<cfquery datasource="F4CF_FictitiousSalesPlanner"
name="qEmployees">
SELECT FirstName, LastName, Email, Phone, Region
FROM SalesTargets
<cfif isDefined("arguments.region")>
WHERE Region = '#arguments.region#'
</cfif>
</cfquery>
<cfreturn qEmployees>
</cffunction>
<cffunction name="insertEmployee">
...
</cffunction>
<cffunction name="updateEmployees">
...
</cffunction>
<cffunction name="deleteEmployee">
...
</cffunction>
</cfcomponent>
CFCのgetEmployees関数内のクエリーは、regionというオプションの引数の記述がある点を除き、手続き型コードのクエリーと同じです。 この関数を呼び出すと、cfreturnタグを使用してクエリー結果が返されます。
このCFC関数をCFMページで使用するには、次のコードに示すように、cfinvokeタグを使用して、手続き型のクエリーコードを関数呼び出しに置き換えます。
<cfinvoke component="Employee"
method="getEmployees"
returnvariable="qEmployees" />
<table border="1" cellpadding="10">
<tr>
<td>FIRST NAME</td>
<td>LAST NAME</td>
<td>EMAIL</td>
<td>PHONE</td>
<td>REGION</td>
</tr>
<cfoutput query="qEmployees">
<tr>
<td>#qEmployees.FIRSTNAME#</td>
<td>#qEmployees.LASTNAME#</td>
<td>#qEmployees.EMAIL#</td>
<td>#qEmployees.PHONE#</td>
<td>#qEmployees.REGION#</td>
</tr>
</cfoutput>
</table>
cfinvokeタグは、ファイル拡張子.CFCを付けなくてもEmployee.cfcコンポーネントを参照し、getEmployeesメソッドを呼び出します。returnvariable引数は、CFCメソッド呼び出しから返されたデータに名前を付けます。この名前は、CFMページでデータを参照するために使用できます。このコードでは、returnvariable引数には手順型クエリーと同じ名前が付けられているため、UIをテーブル表示するHTMLおよびCFMLコードの変更は不要です。
注意: CFCの作成の詳細については、この記事の最後のリソースを参照してください。
FlexアプリケーションからこのCFCにアクセスするには、次のコードに示すように、accessプロパティーをcffunctionタグに追加します。
<cffunction name="getEmployees" access="remote">
...
</cffunction>
これで、このCFC関数を使用して、HTMLとFlexアプリケーションの両方でサーバー側のビジネスロジック処理を行うことができるようになりました。
Flash Builder 4ベータ版によるCFCを使用した開発
CFCは、任意のコードエディターで作成できます。 また、Flexアプリケーションも、無料のオープンソースのFlexフレームワークSDKと任意のコードエディターで作成できます。しかし、Flash Builder 4ベータ版を使えば、Flexアプリケーションの開発を大幅に効率化できます。これは特に、サーバー側ロジックにCFCを使用する場合に顕著です。
図1に、Flexアプリケーションの開発でCFCを使用するワークフローを示します。
SWFファイルとCFCファイル間の実行時の通信
ColdFusionで開発したFlexアプリケーションには、少なくとも以下の3つのファイルが含まれています。
- アプリケーションのサーバー側ビジネスロジックなどの関数が記述されたCFCファイル
- FlexアプリケーションのUIが格納されたコンパイル済みのSWFファイル
- SWFファイルや（該当する場合は）追加のColdFusion/HTMLコンテンツを参照するためのHTMLが埋め込まれたCFMファイル
本番環境におけるこれらのファイルの設定は、ColdFusionで開発したWebアプリケーションと同様です。これらのファイルをサーバーに移動し、データベースに接続するためのデータソースを定義して、CFCのビジネスロジックに必要なその他のサーバー側リソースを設定します。
図2は、ユーザーがFlexアプリケーションを含むCFMページをリクエストした場合の動作の仕組みを示しています。
- ユーザーがCFMページをリクエストすると、ColdFusionサーバーはファイルを見つけて処理を開始します。
- CFMページの構築は、手続き型としてすべてのコードをインラインで記述するか、CFCに関数をリクエストする形で行われます。
- CFCのビジネスロジックは、データベース、メールサーバー、ファイルシステムなどのシステムリソースにアクセスできます。
- CFMページは、CFCデータを使用してHTMLの動的表示を生成します。これには、SWFファイルへの参照が含まれます。
- WebページにSWFファイルが表示されると、CFC関数に直接アクセスできるようになります。これは非常に強力で、HTMLページをリフレッシュしなくても、動的コンテンツでユーザーインターフェイスを更新できます。
次のステップ
この記事では、Flexアーキテクチャーの重要な要素としてCFCが必要な理由を説明しました。FlexとColdFusionの学習ページの「ファーストステップ」のセクションにあるチュートリアルで手順に従えば、ここで得た知識を実際に活用できます。まずは、ColdFusionとFlash Builder 4ベータ版の使用についてのチュートリアルから始めるといいでしょう。
ColdFusionコンポーネントの作成について詳しくは、ColdFusionデベロッパーセンターのほか、以下のリソースを参照してください。
More Like This
- Deploying a Flex application with ColdFusion URL variables
- Understanding Flex in the client/server model
- Adobe Flash Builder 4ベータ版によるColdFusionフォームの生成
- Adobe Flash Builder 4ベータ版によるColdFusionデータの管理
- ColdFusionおよびFlash Builder 4ベータ版入門
- Set up and build your first Flex and ColdFusion application – Part 2: Generating ColdFusion components
- Flash Builder 4によるデータ中心型開発
- Set up and build your first Flex and ColdFusion application – Part 1: Database setup
- Set up and build your first Flex and ColdFusion application – Part 3: Use ColdFusion and Flash Builder 4 to create an application
