There are plenty of resources on the web to discuss cross-domain issues with JavaScript. There are a lot of excellent articles written by programmers in The country, which Jerry will not repeat here.

To get straight to the point, I am currently working On a prototype development: exposing the ABAP Function Module STFC_CONNECTION On on-premise system through SAP Cloud Platform and SAP Cloud Connector for wechat consumption.

The logic of this function Module is simple: copy the contents of the input parameter REQUTEXT directly to the output parameter ECHOTEXT without any processing.

Call ABAP on-premise functions using Java+SAP Cloud Platform +SAP Cloud Connector

After being deployed on the SAP cloud platform, the call is made using the following API endpoint:

Demoi042416trial.hanatrial.ondemand.com/connectivit…

Then make the following AJAX call on my wechat messaging server to consume (hardcoded API endpoint in line 3 because it’s POC) :

No ‘access-Control-allow-origin’ header is present on the requested resource.

How to solve it?

Solution 1: Cross-origin Resource Sharing

If the server-side response can be programmed or configured to affect it, cross-Origin Resource Sharing can be used to add the field access-Control-Allow-Origin to the HTTP response structure. The content can be assigned to the origin field based on actual services. Origin is a whitelist in Jerry’s mind.

Solutions refer to my blog:

Cross domain request in ABAP and Java

Blogs.sap.com/2017/05/06/…

Solution 2: JSONP

Cross-domain problems can also be solved using JSONP, but this approach also requires some programming on the server side. Please refer to my blog for details:

Play around with JSONP in nodeJS server and ABAP server

Blogs.sap.com/2017/06/04/…

However, I used SAP Cloud platform and Cloud Connector to expose the function module On Premise to the public network. In this way, developers cannot program or configure the HTTP response header. Therefore, JSONP does not help me prototype to solve cross-domain problems.

SAP’s Mobile Service for Development and Operations Cockpit has a Cross Domain Access configuration. However, my prototype development did not use SAP cloud platform Mobile Service architecture, so it is not applicable.

Solution 3: Develop your own ProxyServlet

What’s next? Jerry used Eclipse IDE to develop CRM Fiori. He started a Tomcat locally, and the Fiori application running On it could also access OData services On on-premise system domain through the localhost domain. Why didn’t you have cross-domain problems then? As a close recall, we also had a Proxy Servlet deployed on our Tomcat server. AJAX requests sent by index.html are intercepted by proxyservlets, which make requests to on-premise systems through Java code. After the request receives a response, the ProxyServlet sends it to index.html.

The principle behind this type of Servlet is explained in detail in this blog post:

Explore the com.sap.ui5.resource.ResourceServlet

Blogs.sap.com/2014/12/04/…

Once you’re clear, it’s easy to write code. The source code for the Corresponding Java Web project above is on my Github:

Github.com/i042416/SCP…

1. The AJAX request sent in index.html actually points to the handler of the ProxyServlet: note the proxy in the request URL path in the third line below.

2. Develop a ProxyServlet to block requests that contain a proxy in the URL path. Going back to my prototyping needs, API consumption on the SAP cloud platform is now implemented through a ProxyServlet, in which I hardcoded the API endpoint for simplicity.

When tested, it works as expected: AJAX requests from domain Localhost can successfully access apis on SAP cloud platform:

SAP has released a standard Proxy project on Github to deal with this JavaScript cross-domain access problem. If you are interested, you can check it out:

Github.com/SAP/cloud-c…

Read more

  • Call functions in ABAP on-premise system using Java + SAP Cloud Platform + SAP Cloud Connector
  • Use JDBC to operate HANA databases on SAP cloud platform
  • Consume SAP Leonardo’s machine learning API using Java programs
  • C4C and wechat integration series of tutorials

For more of Jerry’s original technical articles, please follow the public account “Wang Zixi” or scan the following QR code: