Skip to Content

Experienced Java Developers (Eclipse, EGit and Maven) could simply execute the Short Installation Guide Extension-004 to run the sample web application described in this blog.

This blog describes how you get the Extension-004 code sample “Connectivity Proxy Sample Web Application” running on your development Environment.

1.    Check Prerequisites in below section 1

2.    Get an overview of the Extension-004 Connectivity Proxy Sample Web Application Sample in below section 2

3.    Download Extension-002 code sample, import projects and run application in below section 3

1. Prerequisites

  1. You have read before SAP HANA Cloud Code Samples – Extensions of PersonsList Web Application
  2. You have executed the HANA Cloud Platform (HCP) Getting Started tutorial Building your first end-to-end SAP HANA Cloud “PersonsList” Web Application Scenario before, so that you can run your developed PersonsList Web Application on your HCP Development Environment.

        Make sure you have

    • Downloaded the newest available version of this tutorial (currently this is v-1.4.1)


2. PersonsList Extension-004 – Connectivity Proxy Sample Web Application

The PersonsList Extension-004 sample demonstrates how an HCP developer could make use of the connectivity service and connectivity proxy to retrieve data from an external OData service.

The Extension-004 sample therefore extends the PersonsList CRUD example (Extension-001) in a way that the Person Entity can store an additional Country property and the available countries for creating a new Person in the Ui is coming from the external Sample OData service.

1. PersonsList Extension-004 – Why Connectivity via a Proxy?

As shown in the following picture, the SAP UI5 based Extension-004 UI wants to call the external Sample OData service (from domain: hana.ondemand.com) to fill a dropdown box with available countries.

0a.PNG

But due to the Same-Origin-Policy of JavaScript the Extension-004 sample web application (domain: hanatrial.ondemand.com) is not allowed to access an internet service that is accessible under a different (“external“) domain (here hana.ondeman.com) as the originating domain of the application.

The solution which the Extension-004 implements uses the HANA Cloud Platform connectivity service: The external service is accessed via a connectivity proxy servlet as visualized in the following picture.

0b.PNG

2. PersonsList Extension-004 – Application UI

The Extension-004 extends the CRUD The Extension-004 sample extends the PersonsList CRUD example (Extension-001) in a way that the Person Entity can store an additional Country property and the available countries for creating a new Person entities in the Ui is coming from the external Sample OData service.

/wp-content/uploads/2014/02/0c_380902.png

3. PersonsList Extension-004 – Changed Code

For the main code change added to the Extension-001 CRUD sample have a look at the following files


a) In personslist-repo-web project: ProxyServlet.java and SecurityHandler.java:

This proxy servlet implementation has been taken from SAP/cloud-connectivityproxy · GitHub.


b) In personslist-repo-web project: web.xml

Here the ConnectivityProxy servlet has been declared and the servlet mapping specifies which url pattern maps to the proxy servlet


c) In personslist-repo-web project: webapp/destinations/odataservicedest 

This destination needs to be added as connectivity destination to the HANA Cloud server so that the connectivity service knows which service Url needs to be called by the proxy servlet (see server connectivity configuration at the end of section 3 in this blog)


d) In personslist-repo-model-jpa project:Person.java

In this class the country specif properties were added to the Person JPA model entity


e) In personslist-repo-web project: index.html

The SAPUI5 OData model of the external Sample OData service is initialized with the proxy URL “proxy/odataservicedest”.


f) In personslist-repo-web project: personslist.view.js and personslist.controller.js

Here the Ui was change according to the additional country properties.

See the following paragraph 4 for all changed files and what content in the files has been changed exactly.

4. PersonsList Extension-004 – Which files were changed?

If you want to know exactly which files were changed in Extension-001 compared to the original PersonsList then you can look at SCN blog PersonsList Extension 002 – Preload Data Sample Web Application and find there in section 2B how to do this.

3. Download Extension-004 Code Sample, Import Projects, Run Application…

If you don’t know already how to do this, then you should execute the described steps of section 3 of SCN blog PersonsList Extension 001 – UI5 OData CRUD Sample Web Application (and replace always Extension-001 with Extension-004).

Note: After you executed all steps of section 3 of SCN blog PersonsList Extension 001 – Ui5 OData CRUD Sample Web Application the Extension-004 sample application will run on the local Java Web Server but the Country dropdown box will not be filled with the available countries provided by the external Sample OData service.

The Extension-004 web application will look as shown in the following screenshot

/wp-content/uploads/2014/02/1_380584.png

(Developer Tools of Chrome have been enabled to show that the request URL of the sample odata service http://localhost:8080/personslist-repo-web/proxy/odataservicedest/$metadata does not work yet correctly)

What is missing is the Connectivity configuration of the local Java Web Server. This configuration ensures that the URL which contains the “/proxy/*” as part of the URL will be forwarded to the Connectivity Proxy servlet, which then calls the sample odata service correctly.

Execute the following steps to configure the local Java Web Server, so that the Extension-004 sample works correctly

1. Configure Connectivity in Server editor

Open Eclipse Servers view

/wp-content/uploads/2014/02/2_380677.png

a) Double click on created ‘Java Web Server’ server node to open server editor (Note: The above Screenshot still contains the former server name “SAP HANA Cloud Platform local runtime” but was renamed meanwhile to Java Web Server)

b) Switch to Connectivity tab

c) Click on ‘Import existing Destination‘ icon to open a file Browser

/wp-content/uploads/2014/02/3_380738.png

d) Navigate to C:/<local-path-to-cloud-personslist-scenario-git-repo>/personslist/personslist-web/src/main/webapp/destinations/odataservicedest and add this odataservicedest file to ‘All Destinations‘ area of the server editor.

/wp-content/uploads/2014/02/4_380739.png

e) Save Editor

2. Configure Proxy in Server editor (in case you don’t have a proxy skip this configuration)

If you are working in a network with a proxy, you have to configure this proxy in the server editor

as follows

Assume that you are working in a company behind a firewall with proxy host = proxy and proxy port = 8080.

a) Stop Server

/wp-content/uploads/2014/02/5_380740.png

b) In server editor Switch to Overview tab

/wp-content/uploads/2014/02/6_380759.png

b) Click on Open launch configuration link to open Edit Configuration dialog

c) On Edit Configuration dialog switch to Arguments tab

d) In VM arguments section enter the following bold marked string (adapted with your proxy settings)

    -Dhttp.proxyHost=proxy -Dhttp.proxyPort=8080 -Dhttps.proxyHost=proxy -Dhttps.proxyPort=8080 -Dhttp.nonProxyHosts=*.corp

/wp-content/uploads/2014/02/7_380760.png

e) Choose OK

f)  Start Server

/wp-content/uploads/2014/02/8_380761.png

3. Run personslist-repo-web project on local Java Web Server again

In Project Explorer

a) Select personslist-repo-web project

b) Open context menu and choose Run as > Run on Server and then choose the server you configured above.

As a result the Extension-004 sample is launched and this time the Country dropdown box will be filled with the available countries provided by the external Sample OData service as shown in the following picture

/wp-content/uploads/2014/02/9_380774.png

4. Feedback

I really appreciate your feedback regarding this code sample.

Please add your comments below.

Thanks,

Jens

To report this post you need to login first.

Be the first to leave a comment

You must be Logged on to comment or reply to a post.

Leave a Reply