Accessing ColdFusion Services from Flex applications

1. Log in to the ColdFusion Administrator and create a user by giving a username and password along with the permissions to access ColdFusion services listed.

2. The next step is to specify the allowed IP addresses. You can do so by accessing the Allowed IP Addresses page under Security in the ColdFusion Administrator. The IP addresses that you specify in this area are the only ones that can remotely access the exposed ColdFusion services. Add the IP of the client machine where you plan to run the flex application.

3. Create an AIR project in Flash Builder 4 and add /CFIDE/scripts/AIR/cfservices.swc in the library path of Flex Build path setting of the project. Add the xml namespace for ColdFusion tags as shown in the code below.

<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" xmlns:cf="coldfusion.service.mxml.*">

4. Create a config and pdf tag instances as shown in the code below. Enter the username, password, ip and port on the config tag. Sppecify the source url for the pdf, the image url, action for the pdf tag and result and fault handlers on the pdf tag.

<cf:Config id="conf" cfServer="localhost" cfPort="8500" cfContextRoot="" servicePassword="service" tfserviceUserName="service"/>

<cf:Pdf id="pdfaddwatermark" action="addwatermark" source="{pdfpath.text}" image="{imagepath.text}" result="handlePDFResult(event)" fault="handleError(event)"/>

5. Create UI for the application as shown in the image below along with the mx:html tag available in AIR. We will use this to display the pdf.

 <s:BorderContainer  height="26" borderVisible="false">
  <s:layout>
   <s:HorizontalLayout/>
  </s:layout>
  <s:Label id="pdflabel"  text="PDF URL"/>
  <s:TextInput id="pdfpath"  text=" http://localhost:8500/test.pdf" width="179"/>
 </s:BorderContainer>

 <s:BorderContainer  height="26" borderVisible="false">
  <s:layout>
   <s:HorizontalLayout/>
  </s:layout>
  <s:Label id="imglabel"  text="Image URL"/>
  <s:TextInput id="imagepath"  text=" http://localhost:8500/test.jpg" width="168"/>
 </s:BorderContainer>
 
 
 <s:Button label="Add Water Mark" id="performbutton" click="pdfAction();" />
 
 <mx:HTML id="reader" width="100%" height="100%"/>
 

5. Add the pdfAction and handlePdfResult and handleError functions.

   private function pdfAction():void
   {
     pdfaddwatermark.execute();
   }
   
   private function handlePDFResult(event:ColdFusionServiceResultEvent):void
   { 
    reader.location = event.result.toString();
   }
   
   private function handleError(event:Event):void
   {
    mx.controls.Alert.show(event.toString());
   }