Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
cancel
Showing results for 
Search instead for 
Did you mean: 
ankit12
Active Participant
Today’s fast paced digital economy demands that companies adapt to remain competitive. Success requires agility, flexibility and the ability to connect end-to-end processes across your organization and beyond. Create new solutions and enhance your application portfolio with smart business services, partner-built applications and leading-edge technologies. Business organizations are now seeking to expose their on-premise system to internet for reaching out more and more customers.

 

To address the above requirement, I have tried to build an application in which I have highlighted that how one organization can expose their on-premise legacy systems to internet and using innovative technologies like SAP UI5, SAP Cloud Platform and SAP Cloud Connector.

 

In this application, used one java server that can simply replace by any other legacy server in real time (server like SAP MII, SAP HANA or any other 3rd party server). SAP Cloud Connector to connect on premise server to the SAP Cloud Platform and SAP Web IDE to create simple web application by using SAP UI5.

 

Below is the Architecture of application:


Image: Cloud Connector architecture


 

On Premise Server: in this application, one REST web service is running on the Java server. Web service can accept input in format like (JSON, XML) and can produce response in same format as (JSON, XML). User can have its content in any format. In addition, it accepts all methods like GET, POST, PUT and DELETE according the user choice as what action user want to perform.

 

SAP Cloud Connector: SAP Cloud Connector (SCC) connects any SAP or non-SAP application to the SAP Cloud Platform. With the help of SAP Cloud Connector, we connect any server (weather its SAP or Non-SAP) to the SAP Cloud Platform.

 

For connecting applications to the SAP Cloud Platform, we need to install SAP Cloud Connector at the host machine (in this case client machine) and need to configure the account (used SAP Neo Subaccount in this case) in SAP Cloud Connector(for SAP Cloud Connector configuration you can use this link). After this, we can configure our server URL and path (resources). Moreover, we can cover our actual server URL by using the virtual URL.

 



 

Image: Connector ID in SAP Cloud Connector



Image: Cloud Connector configuration


 

After successful configuration of SAP Cloud Connector, we can see our Cloud Connector in the SAP Cloud Platform Cockpit in Cloud Connectors tab. In addition, it will also display all the server applications available to the SAP Cloud Platform.


Image: Cloud Connector in SAP Cloud Platform


 

SAP Cloud Platform: SAP Cloud Platform is a Platform as a service developed by SAP SE for creating new applications or extending existing applications in a secure Cloud-computing environment managed by SAP.

In this application, use of SAP Cloud Platform is to access Cloud Connector URL as destination. By doing that we can easily use our destination to develop any web application using SAP Web IDE and SAP UI5.


Image: Destination configuration in SAP Cloud Platform


 

SAP Web IDE and SAP UI5: SAP Web IDE and SAP UI5 both used to develop interactive web application for the end user.

In this application, SAP Web IDE is used to develop a simple form with the help of SAP UI5. A form that gets the user input data and pass it to the controller. Then in controller, it will process the user data and connects it to the on-premise server using SAP Cloud Connector and according to the user event, it will use various methods (like GET, POST, PUT and DELETE) to process the data. And get the response from the server as user wanted.

Attaching some testing snippet below:

Please note that testing has been done in chrome.

Sample UI Form:


Image: Sample UI Form


Sending Requested Json Format:


Image: Json Button Pressed



Image: Request Payload /Response from server


 

Request/Response header in Developer tools (Chrome):


Image: Request/Response header in Developer tools


 

UI Form (XML format):


Image:XML Button pressed


 


Image: Request Payload /Response from server


 

Request/Response header in Developer tool:


Image: Request/Response header in Developer tools


 

That’s all from my side. Hope you have enjoyed this blog while reading. If you have any comments/queries or suggestion please write those in the comment section.

Happy Reading.
1 Comment
Labels in this area