Consuming ABAP Webservices in Flex

former_member186750 · ‎05-04-2010

What

For a while now I have been keen to play around with ABAP Web Services. As I have an understanding of ADOBEs Flex, albeit a small one, I thought why not use that.

Therefore in this Blog I will to discuss consuming ABAP Web Services, in Flex.

I have built an application in Flex for retrieving flight info from SFLIGHT which then allows the user to book one of the flights. It’s a very basic application but was fun nonetheless.

For ease of reading I have broken this blog down into 3 sections. These being.

SAP
FLEX
Execution

Also, as per the norm, my demos will be based around SAPs flight model.

SAP

Prerequisite

Before a Web Service is created we create a function module from which we create the Web Service.

Although I am not going to go over the creation of the FM here there are a couple of things I will point that that must be done before we can proceed.

The Processing type in the FM has to be set to Remote-Enabled Module

All the Parameters in the Funtion Module, be it importing or exporting or any other type need to have the 'Pass Value Enabled' flag set.

Creating the Webservice

OK, time to create the Webservice itself. The best and easiest way to this is via transaction SE80.

For me I find it easier to work directly with the function group.

OK, to start the process. SAP has graciously? provided a wizard to help through the steps in creating the Web Service.

To start the wizard right click in the function group and select 'Create->Web Service'.

The Wizard will now popup and prompt for the service definition (IE: its name) and description. Enter the details and click on “Continue”

The function group is pre-populated for you but it is advisable to also make sure that “Mapping of names” is selected. Click on “Continue”.

At this stage we selection the function modules that we want to create the Web Services for. In my example I have selected both. Click on “Continue”.

At this stage I tend to accept the proposed values but it’s just a personal preference. What I will stress though is that “Deploy Service” should be selected here otherwise further work will be required later down the line. Click on “Continue”.

This next step is self-explanatory. Click on “Continue”.

Right, at this stage we are ready to let SAP create the Web Service for us. Just click on “Complete” and SAP will work it’s magic.

OK, once this is created the following screen will appear.

Getting the WSDL URI

OK, at this stage we could commence our Flex development but I would like to show one last important part of the whole process. This is how to get the WSDL URI.

To get the URI we need to use transaction SOAMANAGER. This transaction is the replacement for WSADMIN & WSCONFIG which are obsolete as of NW04s SP14.

Note: Please read the transaction documentation for more information.

When SOAMANAGER is executed it will launch the default browser, this is because it is a WebDynpro application.

Ok, when the WebDynpro application is loaded select he “Application and Scenario Communication” tab. Then within this window click on “Single Service Administration”.

This will bring up the “Web Service Administration” screen. Here you enter the same of the service just created in the search pattern and click on “Go”.

The next step is to display the details of the service. This is achieved by highlighting the Web Service and clicking on “Apply Selection”.

http://tonkapome.files.wordpress.com/2010/05/apply_selection.png

When the details of the Service come the next step is to click on “Open WSDL document for selected binding”.

http://tonkapome.files.wordpress.com/2010/05/details_of_service_def.png

The next step is the important part. A new window will open containing the WSDL. The contents are not what we are after, the URI is.

http://tonkapome.files.wordpress.com/2010/05/wsdl_uri.png

Ok, so that’s it for the SAP side of things. Time now for some FLEXing.

Flex

OK, I am not going to go into too much detail about the in’s and out’s of Flex programming. I am just going to cover off the essentials to be able to consume the Web Services.

OK, let’s not procrastinate any further. The first step is to create a Flex Project. Before I start I just want to make it clear that I am not going to spend too much time on FLEX programming. This is, after all an SAP community.

Project

There are two kind of projects that can be created, a Web application which runs in Flash Player or a Desktop application which runs in Adobe Air. For this example the latter has been used.

Ok, now we have created the project it’s time to bind the data from SAP.

Selection Parameters

OK, so on our selection screen we have two fields, City From and City To, these need to be bound with the fields in the webservice.

The following excerpt shows how this is done.

Calling the WebService

Calling the WebService from FLEX is very simple. All we need to do is give the WebService an ID, the WDSL URI, the operation and the format.

Below is the code used in this example.

http://tonkapome.files.wordpress.com/2010/05/call_ws.png

Results from SAP

Right, now that we have called the WSDL we need to manage the data being returned. We do this by binding the data to a DataGrid.

Below is the code used in this example.

http://tonkapome.files.wordpress.com/2010/05/binding_datagrid.png

Creating the Air Application

OK, now it’s time to test this application. Although this application can be tested from within the Flex Builder we might as well go ahead and create a desktop application.

Create the installation file