cancel
Showing results for 
Search instead for 
Did you mean: 

Independent deployed frontend Web page call the request of backend

former_member492955
Participant
0 Kudos

I created a independent easy UI5 project use command yo easy-ui5 project, all the file produced automatically

I deployed it to cloud foundry, It becomes a destination:

For the backend service,The frontend destination have been connected:

The tioga-design-time-explorer is the backend service.

I configure the mta.yaml file, and xs-app.json and default-env.json.

But I still can't send the request from frontend to the backend, I don't know what is the wrong for the configuration.

Especially, I don't know what's the destination service, how to connect it with backend service.xs-appjson.png

Accepted Solutions (0)

Answers (1)

Answers (1)

CarlosRoggan
Product and Topic Expert
Product and Topic Expert
0 Kudos

Hello,

I assume you'll get better support from the experts, but maybe I can help you with some basic understanding.
There are quite some technologies involved in your scenario and quite several steps where the request goes through and where a little typo might cause the error.
You mentioned a file called default.env This one you can ignore, it is used only for local development. You can copy the required json from your app binding to this file, then you can run and debug your code locally.
The file xs-app.json is a configuration file for approuter.
The application router receives the request for a configured source pattern and delegates it to the target. The target is a destination and names must match.
You might wish to go through the following blog posts to learn how app router works and how it is configured:

https://blogs.sap.com/2019/06/13/sap-cloud-platform-backend-service-tutorial-24-understanding-app-ro...

https://blogs.sap.com/2019/06/17/sap-cloud-platform-backend-service-tutorial-25-understanding-app-ro...

https://blogs.sap.com/2019/06/17/sap-cloud-platform-backend-service-tutorial-26-app-router-3-route-t...

https://blogs.sap.com/2020/05/13/sap-cloud-platform-backend-service-tutorial-33-app-router-4-run-loc...

app router and ui5 app:

https://blogs.sap.com/2019/07/16/sap-cloud-platform-backend-service-tutorial-31-api-called-from-ui5/

See here a diagram to visualize the flow of a request:

https://blogs.sap.com/2019/07/16/sap-cloud-platform-backend-service-tutorial-31-api-called-from-ui5/...

You can see as well that the ui5 app itself declares a route in the manifest file where it points to a route in app router

The names must match, but also the URI segments must be correct. I mean, at the end the URL to the backend service are concatenated and the resulting URL must be correct, so e.g. the URL which you enter in the destination is a base URL and the URI path contains the segments.

You should check the "development tools" of your browser to see how the URL looks like, which is invoked at the end

I hope this input is helpful for you.

Kind Regards,

Carlos

former_member492955
Participant
0 Kudos

Now I will go through and check ,thanks for that

mariusobert
Developer Advocate
Developer Advocate
0 Kudos

Additional to Carlos answer: You need to create a destination in the BTP cockpit that points to the URL of your backend app (similar to what happens here).

Binding a destination service instance to the backend component does something different and won't help you to link the destinations.

former_member492955
Participant
0 Kudos

Hi carlos.roggan

I create the ui5 application from yo easy-ui5 project

The url: https://developers.sap.com/tutorials/cp-cf-sapui5-local.html

There is no manifest.yml file, there is mta.yaml, if I created a static web application , there is even no mta.yaml file, I need to manual created a manifext.yml file?

CarlosRoggan
Product and Topic Expert
Product and Topic Expert
0 Kudos

Hi,
typically, at SAP BTP, you're creating enterprise apps, which consist of several smaller applications (UI, backend, approuter, database, service instances). So you can create manifest file for each app, create service instances manually and configurations, URLs, etc.
To avoid this, there's the concept of MTA. There, all apps are defined and configured, also the service instances are defined and configured and they are created during deployment.
This is why you have destination after deploying your mta
So, mta is kind of combining several manifests and commands.
You still can have a single manifest.yml and use it if you want to deploy only one single app, but that's typically not required