SAP-samples / cloud-cap-samples

This project contains sample applications for SAP Cloud Application Programming Model.
https://cap.cloud.sap/
Apache License 2.0
475 stars 496 forks source link

Empty Fiori page after starting #417

Open alexlopez3102 opened 1 year ago

alexlopez3102 commented 1 year ago

I'm not able to test the project After npm install and cds watch if I click on any webapp like https://port4004-workspaces-ws-kxwrg.us10.trial.applicationstudio.cloud.sap/products/webapp/index.html Empty tab is displayed no data no fields at all

chgeo commented 1 year ago

Please provide step by step instructions to reproduce the issue.

gregorwolf commented 1 year ago

I guess it's an issue with the current SAPUI5 1.107.0 version. With 1.107.1 the Launchpad Mock works again.

alexlopez3102 commented 1 year ago

This is the complete log of npm install npm_install_log.txt

alexlopez3102 commented 1 year ago

This is what I see when I click on products webapp

Output Runing Products App
gregorwolf commented 1 year ago

Have you checked the console output of the development tools?

sfdfklskldf commented 1 year ago

Could it be related with the "destination" to add? I have the issue that during deployment of the Fioir App I will be asked for "Destination Name" but I can't find any useful documentation what this should be. So in all. CAP Service itself and database works. Fiori app is not deployed at all.

chgeo commented 1 year ago

@sfdfklskldf I am inclined to treat comments by sfdfklskldf username as spam ;) Any chance you can use a different one?

sfdfklskldf commented 1 year ago

Why should it be spam? It is just a random name (try to find a nice one that is not occupied).

But the issue is real or not? In https://cap.cloud.sap/docs/guides/deployment/to-cf it is described how to deploy. The screenshot in this ticket looks similar to mine. Local (I am not using BAS cloud!) but BAS local installation with plugins. I see my Fiori App in the overview screen. mta.yaml does not describe the Fiori app to upload.

If I run:

Adding deploy-config to the project. info Add:Deploy-config Using: @sap/fiori:deploy-config ? Destination name ()

I have no idea what "destination" is meant here. No hint nothing.

chgeo commented 1 year ago

If I run:

Adding deploy-config to the project. info Add:Deploy-config Using: @sap/fiori:deploy-config ? Destination name ()

I am afraid I don't know which tool you use. I guess it's some Fiori tool. So, what did you do that produces the output above?

chgeo commented 1 year ago

Why should it be spam? It is just a random name

First and last name in your profile would be nice.

sfdfklskldf commented 1 year ago

I am using the SAP Template Wizard inside BAS (local installation). Technically it will be this:

    "scripts": {
        "deploy-config": "npx -p @sap/ux-ui5-tooling fiori add deploy-config cf"
    },

This seems to setup typical SAPUI5 build process (creating dist folder and so on) and creates a xs-app.json file inside the folder of this app. That looks like this:

$ cat app/appname/xs-app.json

{
  "welcomeFile": "/index.html",
  "authenticationMethod": "route",
  "routes": [
    {
      "source": "^/admin/(.*)$",
      "target": "/admin/$1",
      "destination": "destinationnametoenter", <<- what is this for?
      "authenticationType": "xsuaa",
      "csrfProtection": false
    },
    {
      "source": "^/resources/(.*)$",
      "target": "/resources/$1",
      "authenticationType": "none",
      "destination": "ui5"
    },
    {
      "source": "^/test-resources/(.*)$",
      "target": "/test-resources/$1",
      "authenticationType": "none",
      "destination": "ui5"
    },
    {
      "source": "^(.*)$",
      "target": "$1",
      "service": "html5-apps-repo-rt",
      "authenticationType": "xsuaa"
    }
  ]
}

There is also an xs-app.json in the app folder:

$ cat app/xs-app.json

{
  "authenticationMethod": "route",
  "routes": [
    {
      "source": "^/app/(.*)$",
      "target": "$1",
      "localDir": ".",
      "authenticationType": "xsuaa",
      "cacheControl": "no-cache, no-store, must-revalidate"
    },
    {
      "source": "^/(.*)$",
      "target": "$1",
      "destination": "srv-api",
      "authenticationType": "xsuaa",
      "csrfProtection": true
    }
  ],
  "welcomeFile": "/domainappname" <-- here the domain like com.sap.appname is used without dots
}

After mta deployment to cloud foundry I just see the GET /domainappname not available.

chgeo commented 1 year ago

Alright, I have pinged colleagues w/ expertise in this area. Let's see.

sfdfklskldf commented 1 year ago

My assumption would be that the GUI part is part of the main service of a CAP application. At least this is how I understood the CAP documentation? https://cap.cloud.sap/docs/get-started/in-a-nutshell So if I create "cds init example" and add "app/vue/index.html" I would assume the frontend could be reached over the url of the "example" service deployed? Is this assumption correct? Meanwhile I fear the Fiori deployment requires some launchpad configuration on BTP cloud and uses HTML5 repository?

chgeo commented 1 year ago

My assumption would be that the GUI part is part of the main service of a CAP application So if I create "cds init example" and add "app/vue/index.html" I would assume the frontend could be reached over the url of the "example" service deployed?

Yes, the app folder is served in any CAP app started with cds run/serve.

However, SAP-style deployment layouts (MTA) separate UI files from the server, so that this folder isn't packaged by default. There, either the html5 repo (plus a centrally-managed approuter) serve the files, or a standalone approuter that is deployed along with the application. Approuter always comes with its xs-app.json file defining the routes.

So, if you want to keep it simple and don't need FLP, you can package the app folder by a post-build step into the deploy archive. If you need FLP, however, you need to go the full way using approuter and/or html5 repo.

sfdfklskldf commented 1 year ago

My first try would be to figure out to pack it with the CAP stuff.

sfdfklskldf commented 1 year ago

Happy new year. It took some time but I still can't deploy the CAP project. As soon as I pack a Fiori app with it it does no longer work. Is there somewhere an example app with a Fioir UI that I could clone from git and deploy it? So that the UI is part of CAP service?

gregorwolf commented 1 year ago

Happy new year. I would suggest you work through Deploying a CAP based Fiori app to a central Launchpad. If you use my branch https://github.com/gregorwolf/central-launchpad-cap/tree/add-authentication you can try it also with authentication.

MartinStenzig commented 1 year ago

I also assembled a little end-to-end scenario that might be useful... very simple but end to end with Fiori UI. https://github.com/RizInno/cds-customer-stepbystep