Extracting content from HTML based server response in Adobe Flex

Using HTTPService component of Adobe Flex we can send a request to a page on the server. Most of pages on the server are developed using either server side scripting languages or static HTML pages that return content in form of HTML to the client. Here we show how to extract the content from HTML response returned by the server and also how to send parameters to the server scripts.

After an RPC component calls a service, the data that the service returns is placed in a lastResult object. By default, the resultFormat property value of HTTPService components and WebService component operations is object, and the data that is returned is represented as a simple tree of ActionScript objects. Flex interprets the XML data that a web service or HTTP service returns to appropriately represent base types, such as String, Number, Boolean, and Date. To work with strongly typed objects, you must populate those objects using the object tree that Flex creates. WebService and HTTPService components both return anonymous Objects and Arrays that are complex types. If makeObjectsBindable is true, which it is by default, Objects are wrapped in mx.utils.ObjectProxy instances and Arrays are wrapped in mx.collections.ArrayCollection instances.

I created a JSP and a Flex application, which will invoke the JSP on the server side and extract the content from the response in HTML format. The JSP returns HTML tags as response. We can modify the type of the lastResult object returned by the HTTPService object by modifying the resultFormat property of the HTTPService component.

In this example we will pass a parameter to the JSP and convert the response from the JSP to Object of the type XML by setting the resultFormat property of the HTTPService object to e4x and then extract the content from the <Body> element.

Create a JSP page

This JSP page takes the name as a parameter and responds a message with the input parameter.

First.jsp

<html>

<head><title>First Page</title></head>

<body>

<%

out.println(“Hi ” + request.getParameter(“name”));

%>

This is from the JSP.

</body>

</html>

Create Flex application

This application sends an HTTP service request to the JSP page. Once the JSP page responds, the response is converted into Object of the type XML by setting the resultFormat property of the HTTPService component to e4x. We parse the result object and retrieve the content in the <BODY> tag and display it. You can also observe that we are passing a parameter to the JSP in the send() method of the HTTPService component.

RPS.mxml

<?xml version=”1.0″ encoding=”utf-8″?>

<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml&#8221; layout=”vertical”>

<mx:Script>

<![CDATA[

import mx.rpc.events.ResultEvent;

import mx.controls.Alert;

private function handleHttpService(event:ResultEvent):void

{

Alert.show(event.result.toString(), “Complete Response”);

Alert.show(event.result.body.toString(), “Content in Body element”);

}

]]>

</mx:Script>

<mx:HTTPService id=”httpObj” url=”http://localhost:8400/sujit/first.jsp&#8221;

resultFormat=”e4x”

showBusyCursor=”true”

result=”handleHttpService(event)”

/>

<mx:Button id=”httpService” label=”Http Service” click=”httpObj.send({name: ‘Sujit’});” />

</mx:Application>

Snapshot of the application displaying the extracted content from server response

HTMLResponseExtracted

17 Responses to Extracting content from HTML based server response in Adobe Flex

  1. Sandeep says:

    hi!!
    i have created a jsp page which includes flex component(did this using wrapper classes) now i need to catch an event generated in this flex component using jsp…..plz help me….and thanx in advance..!!

  2. Sujit Reddy G says:

    Hi Sandeep,

    Can you please explain what exactly you want to do. I am a bit confused.

    Thanks.

  3. babu says:

    hi sunit,
    do i need to do any configuration in the config fies to run the sample..i am getting error as (mx.rpc::Fault)#0
    errorID = 0
    faultCode = “Client.CouldNotDecode”
    faultDetail = (null)
    faultString = “Error #1096”
    message = “faultCode:Client.CouldNotDecode faultString:’Error #1096′ faultDetail:’null'”
    name = “Error”
    rootCause = (null)

    can u solve this problem..

  4. Sateesh says:

    HI Sujit,
    Is there a way in flex to embed HTML pages (actually JSP running on other servers) with out using iFrames in Main.html?

  5. Sujit Reddy G says:

    Hi Sateesh,

    Flash player supports few major HTML tags only. If you want to render HTML pages, then I think IFrame is the way to go.

    Hope this helps.

  6. Sujit Reddy G says:

    Hi Babu,

    You don’t need any configuration on the server to use HTTP Service. Can you please share the code? Please email ur code to sujitreddy.g@gmail.com

  7. srinivas says:

    Hi sujit,
    i have one doubt regarding what you are saying but little bit different.
    I have a flex file(i mean MXML file) ,in that i have two textinputs and one button.After entering the values in the textinputs and then click on the button it will open the jsp page and display the values in jsp page itself whatever we are entered in flex file.i’m waiting for ur reply.

    Thanks & Regards,
    Srinivas.

  8. Hi Srinivas,

    Try navigateToURL(new URLRequest(‘http://ururl’)) function

    Hope this helps.

  9. Jashraj Deshpande says:

    Sujit

    I have a JSP page which has google javascript api’s running and showing a map. I want to display this jsp inside my flex tab. In the sense .. user does some event , sends value to jsp , jsp processes and renders the maps .. show the same in flex tab…

    can this be done.

  10. Hi Jashraj,

    Try Flex iFrame component

  11. Srini says:

    Hi Sujit,
    Simple and easy man(the best way to start my tutorial),thanks keep it up & keep going

  12. jaivinoth says:

    Method: SetMetaData
    HTTP Status: 200
    Status Text: OK
    Reason:
    Response Text:
    No HTML was present in the HTTP server response

  13. SV says:

    Hi Sujit:

    Thanks for the cameo. This is very good for understanding the HTML/JSP with Flex interaction.

    I have a question here. In a real time project we have build scripts that pick all the regular J2EE files like JSP,Servelets(classes etc), .js files, html etc. How do Flex files get picked? Since they are built in Flex Builder how are they integrated into a regular J2EE project?

    Thanks

  14. Kalyan Kumar says:

    Thanks for the good post sujit.. It helped me a lot.. one small doubt.. i want to put the jsp body response into iframe in flex. How to do this..
    I am using like this..

    m_idFrame.source=event.result.body.toString();
    m_idFrame.showIFrame();

    It is not working … can u explain me the reason

  15. hi says:

    hi sujit,

    i am trying to create a login page by using HTTPservice
    in flash builder it is using Zend framework .how to receive data from php to flex.i will share my code to u . waiting for you mail .

  16. kasi reddy. says:

    i am trying to create a login page by using HTTPservice
    in flash builder it is using Zend framework .how to receive data from php to flex.i will share my code to u . waiting for you mail .

  17. aman says:

    Hi Sujit,
    I am using flex on netbeans by installing the plugin.
    When i am running “RPS.mxml” its giving an error “Unexpected end of token stream” on the statrt of script

    <![CDATA[
    ^
    I using Flex SDK 3 on netbeans.
    is there any way to make this works.

    Thanks in advance

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: