FLEX-2 CLIENT FOR XML-WEBSERVICE

Posted On July 9, 2010 by Rose Mary filed under Programming

HTML clipboard

In this tutorial, I will show how we can provide a Flex2 client for XML-WebService. The webservice may have been created by using Apache Axis as Java Web Service or by using ASP.net in C#.( both are open-source & free).It does not matter how the webservice is created. All that we need
is the WSDL file. (WSDL stands for WebService Description Language).

So, I will first create a simple webservice in java using Axis1.1.and then show how it is utilised by a Flex-2 client.

In the second example, I will create a webservice using ASP.net in DotNet WebMatrix( open-source...supported by Microsoft). and a Flex-2 client
(identical to the previous case) to access the webservice.

Let us first create a java web service in Axis1.1. It is extremely easy. Just create a bean and save it in tomcat\webapps\axis folder as a jws file.
I am using tomcat5 and jdk1.5.

Let me first create the querybean. as shown below.

.....................................................................................................................................
// c:\tomcat5\webapps\axis\querybean.jws

import java.sql.*;

public class querybean
{

public String showrecords(String s)
{
String r=" ";

try
{

Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
String url="jdbc:odbc:keynameplace";
Connection connection=
DriverManager.getConnection(url);

Statement st =
connection.createStatement();
ResultSet rs=st.executeQuery(s);

while(rs.next())
{
r=r+rs.getString(1)+ "\n"+
rs.getString(2)+"\n"+
rs.getString(3)+"\n"+
"-------------"+"\n";

}
}catch(Exception e1){r=" "+e1;}

return r;
}
}

This is the usual jdbc code but saved as jws file. ( java web service).
in c:\tomcat5\webapps\axis folder.
-
Let us now create the flex program to access this webservice.

.....................................................................................................................................
//g:\flexdemos\web\javadbwebservice.mxml

<mx:Application xmlns:mx=
"http://www.adobe.com/2006/mxml" >

<mx:WebService id='service1'
wsdl=
"http://localhost:8080/axis/querybean.jws?WSDL">

<mx:operation name="showrecords">

<mx:request>
<s>
{ text2.text }
</s>
</mx:request>

</mx:operation>

</mx:WebService>

<mx:Button label="send"
click="service1.showrecords();
text1.text='sent';"/>

<mx:TextInput id="text2" />
<mx:TextInput id="text1" />
<mx:TextArea id="area1" />
<mx:Button label="show result"
click="area1.text=String(service1.showrecords.lastResult)"/>

</mx:Application>

Note the ready-made special tag in flex2 for use in webservice client.
In our case, it is having the id as service1 and as the wsdl, we specify the wsdl file. It refers to querybean.jws deployed already in c:\tomcat5\webapps\axis' folder.

We also refer to the function name of the bean (ie) showrecords. as <mx:operation>. The parameter for the function is 's' . This is shown as <mx:request> . obtained from text2 in the flex2 gui.

We have written the event-handler in the <mx:button> itself. 'button1' sends the request and 'button2' is for receiving the response and showing it in area1.
All these are very similar to asp.net.
( The lead-engineer for flex2 in Adobe is the same person who created asp.net, while working in Microsoft.).

I created the above mxml file in:
g:\flexdemos\web

I set path in that window as:
c:\windows\command;
c:\jdk1.5\bin;
c:\flex2\bin
---
To compile this mxml file into swf
( shockwave), I give command as:

>mxmlc javadbwebservice.mxml

This will create the javadbwebservice.swf file.

We cannot test this as standalone. But we can place it in any webserver and use it.

For this experiment, I am using apache server which comes with phptriad.

I created a special folder in
c:\apache\htdocs\flexclients.

Then I copied javadbwebservice.swf to this folder.

I then started apache server from the start menu. I typed the url in browser as
"http://localhost/flexclients
/javadbwebservice.swf".

I got the gui with text1,text2,button1,area1 and button2.
I typed the query in text2( top).and then clicked button1.
I got the message 'sent' in text.
Then I clicked button2. I got the records displayed in area1.

Thus, I have been able to provide flex2 client for javawebservice.
============
( I have shown the screenshot as screen1).( carefully note the URL).

*****************************************

Second experiment.

Flex2 client for ASP.Net webservice.

Let us first create the asp.net webservice using C#.

I am using dotnet Framework sdk and webmatrix server. My working folder is in :
g:\matrix\root\webservice
----------------------------------------

....................................................................................................................................................

<%@ webservice Language="c#" class='readerdemo' %>

using System;
using System.Data;
using System.Web.Services;
using System.Data.OleDb;

[WebService (Namespace="http://localhost/") ]

public class readerdemo : WebService
{
[WebMethod()]

public String getdata(String sql)
{
String s1=
"Provider=Microsoft.JET.OLEDB.4.0;data source=g:\\keynameplace.mdb";

OleDbConnection connection=
new OleDbConnection(s1);

connection.Open();

OleDbCommand command =
new OleDbCommand(sql,connection);

OleDbDataReader reader =
command.ExecuteReader();

String r="";

while(reader.Read())
{
r = r+ reader[0].ToString()+"\n"+
reader[1].ToString()+"\n"+
reader[2].ToString()+"\n"+
"-----------"+"\n";
}

connection.Close();

return r;
}
}

=========================================

I started the webmatrix server in port 8000.

Then, I checked up if the auto-generated wsdl file was available in:
http://localhost:8000/webservice/
readerdemo.asmx?wsdl

It was available.
So the next step was to write the flex client file as given below. It is almost the same as the previous mxml file. , except for the change in wsdl, operation, request .

*****************************************

// g:\flexdemos\web\
//dotnetdbwebservice.wsdl

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" >

<mx:WebService id='service1'
wsdl="http://localhost:8000/webservice/readerdemo.asmx?WSDL">

<mx:operation name="getdata">

<mx:request>
<sql>
{ text2.text }
</sql>
</mx:request>

</mx:operation>

</mx:WebService>

<mx:Button label="send"
click="service1.getdata();
text1.text='sent';"/>

<mx:TextInput id="text2" />
<mx:TextInput id="text1" />
<mx:TextArea id="area1" width='200' height='300' />
<mx:Button label="show result"
click="area1.text=String(service1.getdata.lastResult)"/>

</mx:Application>

========================================

As before, I gave the command as

>mxmlc dotnetdbwebservice.mxml

I get dotnetdbwebservice.swf

I copied this swf file to:
c:\apache\htdocs\flexclients

Then I typed the url in browser as
'http://localhost/flexclients/dotnetdbwebservice.swf'

I got the gui as before. I typed the query in text2. I got correct result as shown in screen-2.( note the URL).

Thus, we are able to use flex2 in client's browser to connect to xml-webservice, be it , a java service or asp.net webservice. This is very useful.

FlexSDK is free( like DotNet Framework SDK).We need to pay only if we use FlexBuilder.

Next month, I will write about Flex clients for jsp, php, asp.net and also about the free version of Flex DataBuilder.

Added on July 9, 2010 Comment

FLEX-2 CLIENT FOR XML-WEBSERVICE

Comments

Post a comment