This blog is facing the Same-Origin-Issue using a proxy servlet when the model is set up by the
manifest.json.
Problem-Description
During development of an mobile Web-Application using SAPUi5 and Eclipse I faced the Same-Origin-Policy when I was trying to consume a remote OData-Webservice - lets say
http://services.odata.org/V3/Northwind/Northwind.svc/
After having a quick look at the SAPUI5 Documentation
https://sapui5.hana.ondemand.com/#/topic/2d3f5fb63a2f4090942375df80abc39f I found out that there is a proxy mechanism to avoid the Same-Origin-Policy for quick and local testing. It states that the exernal URI needs to be extended by an "
proxy/" prefix in the coding.
However, it does not work for me since I implemented a global
manifest.json and I didn't know how to exactly extend an external
http://hostname/. URI with the
proxy/ prefix In the
dataSources attribute of the
manifest.json. Should it be like
??? It seems there are to many possible combinations to me. Moreover, it is neccessary to extend the
web.xml in the
WEB-INF folder. Since I was struggeling around for at least two days I would like to share my solution in the following.
Example for consuming the Northwind-Service
This Example is based on the SAP Walkthrough tutorial step 26. You can find it and download the source here:
https://sapui5.hana.ondemand.com/#/sample/sap.m.tutorial.walkthrough.26/preview
To avoid the Same-Origin-Issue modify the following files:
Adopting the URI in the manifest.json
{
"_version": "1.8.0",
"sap.app": {
...
},
"dataSources": {
"invoiceRemote": {
"uri": "proxy/V3/Northwind/Northwind.svc/",
"type": "OData",
"settings": {
"odataVersion": "2.0"
...
},
"sap.ui5": {
...
"models": {
...
"invoice": {
"dataSource": "invoiceRemote"
}
...
}
It is essential that you don't have the hostname and the procotol in your URI-String since this will be concatenated by the web.xml as we see in the following:
Activating the Servlet in the WEB-INF/web.xml
<?xml version="1.0" encoding="UTF-8"?>
...
<servlet>
<servlet-name>SimpleProxyServlet</servlet-name>
<servlet-class>com.sap.ui5.proxy.SimpleProxyServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>SimpleProxyServlet</servlet-name>
<url-pattern>/proxy/*</url-pattern>
</servlet-mapping>
<context-param>
<param-name>com.sap.ui5.resource.PREFER_REMOTE_LOCATION</param-name>
<param-value>true</param-value>
</context-param>
<context-param>
<param-name>com.sap.ui5.proxy.REMOTE_LOCATION</param-name>
<param-value>http://services.odata.org</param-value>
</context-param>
...
Conclusion
The hostname and the proctol will be declared in the
web.xml and thus needs not to be passed to the
manifest.json. Moreover, It came out that it is essential to set the context parameter
com.sap.ui5.resource.PREFER_REMOTE_LOCATION to
true by adding the corresponding XML-Tags to make it work. Otherwise the Framework tries to concatenate the localhost server to the service address. Finally, it could solve my issue.
Greetings from Duesseldorf - Germany