I have successfully pushed both applications (Angular UI and node server) to Cloudfoundry.
Both applications can be opened through the Mindsphere launchpad / the browser.
For example, calling https://<tanent>-nodeserver-<region>.mindsphere.io/api/data displays entries of a database on the browser.
However, I am unable to get the database content through the Angular app. Whenever I try to fetch the url, I get a CORS error. Here is a screenshot of the error and the corresponding code section:
My component structure on the Mindsphere Developer Cockpit:
CSP for both apps: style-src * 'unsafe-inline'; script-src 'self' 'unsafe-inline' static.eu1.mindsphere.io; img-src * data:;
I have tried to allow CORS on the server side:
I think you have two different apps. UI-app and Server-app. From UI-app you want to call API endpoint from another app i.e server-app. You can use following option:
In the UI-app, you can add more components for backend server. In your case "nodeServer" component into UI app. So all calls to server happens from single app. Details here resolution
I have already tried this solution but it didn't work. My component structure can be seen below.
If I understand it correctly, I should be able to call https://<tenant-name>-ngChart-<provider-name>.<region>.mindsphere.io/nodeServer
But whenever I try that I get the "404 Error". If I try to call ...../nodeServer/api/data then I get "Cannot GET /nodeServer/api/data".
Apparently, I am doing something wrong ...