on 2020 Sep 25 2:00 PM
I have developed a litte CAP Java application for learning CDS, having no problems to access my services via the browser. Now I would like to implement a little test Fiori application which should access the CAP services/models.
For that purpose I am following this SAP guide:
Developing an SAP Fiori Application for a CAP Project / with an standalone Approuter using the SAP Fiori Freestyle- Module Generator. (I am choosing no Authentication and local Service)
Afterwards I start the Java Application following this SAP guide:
Creating Run Configurations for CAP Java Applications
Unfortunately I am not able to access the previous generated and configured Fiori app from the Business Application Studio. I don't know the correct endpoint or do not know how to configure it.
I have a standard CAP Java directory structure, these directories are generated (the name of my app is dispoapp):
- app
- HTML5Module (generated)
- dispoapp-approuter (generated)
I suppose I need to change the source and target section of the generated xs-app.json file, which looks like this (but can't figure out the correct way):
{
"welcomeFile": "/index.html",
"authenticationMethod": "none",
"logout": {
"logoutEndpoint": "/do/logout"
},
"routes": [
{
"authenticationType": "none",
"csrfProtection": false,
"source": "^/enter_your_service_destination_here/(.*)$",
"destination": "enter_your_service_destination_here",
"target": "$1"
},
{
"source": "^(.*)$",
"target": "$1",
"service": "html5-apps-repo-rt",
"authenticationType": "xsuaa"
}
]
}
My generated mta.yaml file looks like this:
_schema-version: "3.1"
ID: dispoapp
description: Generated by cds-services-archetype
version: 1.0.0
modules:
- name: dispoapp-srv
type: java
path: srv
provides:
- name: srv-api
properties:
srv-url: ${default-url}
build-parameters:
build-result: target/*.[wj]ar
builder: custom
commands:
- mvn clean package
- name: dispoapp-approuter
type: approuter.nodejs
path: dispoapp-approuter
requires:
- name: dispoapp_html_repo_runtime
- name: dest_dispoapp
parameters:
disk-quota: 256M
memory: 256M
- name: dispoapp_ui_deployer
type: com.sap.application.content
path: .
requires:
- name: dispoapp_html_repo_host
parameters:
content-target: true
build-parameters:
build-result: resources
requires:
- artifacts:
- HTML5Module-content.zip
name: HTML5Module
target-path: resources/
- name: HTML5Module
type: html5
path: app/HTML5Module
build-parameters:
builder: custom
commands:
- npm run build
supported-platforms: []
resources:
- name: dispoapp_html_repo_runtime
type: org.cloudfoundry.managed-service
parameters:
service: html5-apps-repo
service-plan: app-runtime
- name: dispoapp_html_repo_host
type: org.cloudfoundry.managed-service
parameters:
service: html5-apps-repo
service-plan: app-host
- name: dest_dispoapp
type: org.cloudfoundry.managed-service
parameters:
service: destination
service-plan: lite
parameters:
enable-parallel-deployments: true
build-parameters:
before-all:
- builder: custom
commands:
- npm install --production
- npx -p @sap/cds-dk cds build --production
I am happy about any help 🙂 !
Thanks & Best Regards
Thomas
Request clarification before answering.
Hi thomas.brandstetter,
You can solve this by adding a second app router, for example, approuter-local, which you only use for local testing. Do not put this app router in your deployment script of the MTA, so it will be ignored when building the MTA and deployment to SCP.
In the xs-app.json, remove the service html5-app-repo-rt. This service tries to find the UI5 code on the server, but we want to run/debug the Fiori app locally. In the xs-app.json you add the endpoint of the Fiori application. For example for the Fiori app com.docloudnow.administrator, this will be:
{
"source": "^/comdocloudnowadministrator/(.*)$",
"target": "$1",
"destination": "ui1",
"csrfProtection": false
},
As you can see the dots are removed from the namespace and we use a namespace.
Now we must also tell the local app router to use destination ui1
This can be done by adding a destination to the default-env.json file:
{
"name": "ui1",
"url": "http://localhost:8001",
"forwardAuthToken": true,
"strictSSL": false
},
Of course, you should also add the endpoint for the CAP service to the xs-app.json file :
{
"source": "/odata/(.*)",
"destination": "srv_api",
"csrfProtection": false,
"authenticationType": "xsuaa",
"scope": {
"default": "$XSAPPNAME.Display"
}
},
And in the default-env.json also the destination of the CAP service
{
"name": "srv_api",
"url": "http://localhost:4000",
"forwardAuthToken": true,
"strictSSL": false
},
Now you can start the app router in your local app router folder with the command: npm start. This will start the app router. And you also need to start the CAP services with cds watch.
The only thing that’s left is to start the Fiori App with the right port: ui5 serve --port 8001 in the root folder of your Fiori app.
If your Fiori app doesn’t have an index.html file but only a component.js, you can add a test launchpad with the name index.html in the resources folder of the app-router and use the following code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Bookshop</title>
<script>
window["sap-ushell-config"] = {
defaultRenderer: "fiori2",
applications: {
"application-administrator": {
title: "Administrator",
description: "start:ui-adm",
additionalInformation: "SAPUI5.Component=com.docloudnow.administrator",
applicationType : "URL",
url: "/comdocloudnowadministrator",
navigationMode: "embedded"
}
};
</script>
<script src="https://sapui5.hana.ondemand.com/test-resources/sap/ushell/bootstrap/sandbox.js"></script>
<script src="https://sapui5.hana.ondemand.com/resources/sap-ui-core.js"
data-sap-ui-libs="sap.m, sap.ushell, sap.collaboration, sap.ui.layout"
data-sap-ui-compatVersion="edge"
data-sap-ui-theme="sap_fiori_3_dark"
data-sap-ui-frameOptions="allow"
></script>
<script>
sap.ui.getCore().attachInit(()=> sap.ushell.Container.createRenderer().placeAt("content"))
</script>
</head>
<body class="sapUiBody" id="content"></body>
</html>
It works for me, Good luck.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
Hello Robert,
thank you for your detailed answer!
I am a java and Fiori developer and I am just getting used to the new CAP / Cloud technologies. I will give your answer a try :-), but for me it is also important that the SAP BAS tooling works and I can focus on implementing the application. After a certain amount of experience I hope to be able to do the configuration myself.
Thanks a lot, best Regards
Thomas
User | Count |
---|---|
89 | |
11 | |
9 | |
8 | |
7 | |
5 | |
4 | |
4 | |
4 | |
4 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.