-1

I am designing a SAP UI5 Application which is fetching data from different server. Currently, I am acing Cross Origin Error while making OData calls and workaround for this is setting --disable-web-security in Chrome. But i want proper solution ( a piece of code ) that can be used to avoid this error.

Please note that I cannot make any changes on OData server.

Xatenev
  • 6,383
  • 3
  • 18
  • 42
John Smith
  • 25
  • 2
  • 10
  • 1
    There is no way to disable same origin policy in javascript. You'd have to set the correct response headers. See https://stackoverflow.com/questions/10636611/how-does-access-control-allow-origin-header-work for more explanation – Xatenev Sep 11 '17 at 11:30
  • 1
    You cannot - and that's a very good thing. You're asking the wrong question here. You should be asking how you can avoid it, and the answer there is to either return CORS headers in the response, or return JSONP. If you cannot do either of those, then you will have to make the request on the server side instead of client-side JS – Rory McCrossan Sep 11 '17 at 11:33
  • @RoryMcCrossan I am getting output by using --disable-web-security. Can I assume that Odata server will throw data once any request has header for CORS? If yes, plz provide how to return CORS header in respone, as you mentioned – John Smith Sep 11 '17 at 11:44
  • 1
    No - it's the other way around. The CORS headers need to be in the *response* not the *request* – Rory McCrossan Sep 11 '17 at 11:47
  • 1
    CORS would have to be enabled by the remote party - which in this case would be your “OData server”. No configuration access to that - no CORS. – CBroe Sep 11 '17 at 11:48
  • @RoryMcCrossan can you please provide any example or post – John Smith Sep 11 '17 at 11:50
  • 3
    Not sure if my comment is simply being ignored or not read.. – Xatenev Sep 11 '17 at 11:53
  • @Xatenev I had already gone through post shared by you. – John Smith Sep 11 '17 at 12:00
  • @JohnSmith Thats good! But I am not sure what kind of example or post you are referring to? Everything you need should be explained in the linked question/answers. – Xatenev Sep 11 '17 at 12:03

2 Answers2

0

You have to use a proxy servlet to fix your CORS issue. In the config json of the file manifest.json add the links to your odata service or data provider e.g.:

"config": {
  "oDataRemote": "http://exampleService.com/sap/opu/odata/sap/<ServiceName>",
  "oDataProxyRemote": "proxy/sap/opu/odata/sap/<ServiceName>",
}

In your Components.js get the URL link and initiate your oData Model:

var oConfig = this.getMetadata().getConfig(); //get variables of config json defined in manifest.json
    
    // Define if proxy is required or not
    if (window.location.hostname == "localhost") {
          sServiceUrl = oConfig.oDataProxyRemote;
      } else {
          sServiceUrl = oConfig.oDataRemote;
      }

When the uri is determined initiate the odata model in your components.js:

var oODataModel = new sap.ui.model.odata.ODataModel(sServiceUrl, mParameters);
this.setModel(oODataModel, "oDataModel");

In the WEB-INF folder you need to add the following servlet to your web.xml:

<!-- ============================================================== -->
<!-- UI5 proxy servlet -->
<!-- ============================================================== -->

<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.proxy.REMOTE_LOCATION</param-name>
    <param-value>{protocol}://{host name}:{port number}</param-value>
</context-param>

The simple proxy servlet is for testing purpose only. If you need this for your productive environment you need a mature proxy servlet. I would recommend a reverse proxy(e.g. Apache HTTP Server), to bring all web and application servers in one domain.

You can also check out the sample provided by SAP simple proxy servlet

Community
  • 1
  • 1
Beka
  • 343
  • 2
  • 8
0

You should setup a reverse proxy in the server-side. And you should call the external url through this. All the calls should go through this.

techippo.com
  • 245
  • 1
  • 4