Error 404 when trying to access a full stack CAP application deployed in Cloud Foundry

[raihan_siddiqui]

Hello experts,

I have created a full stack CAP application and deployed it in Cloud Foundry. However when trying to access the app via HTML5 repository, I get a blank page and when I open the console, I see a bunch of 404 errors.

I have followed a youtube tutorial: https://www.youtube.com/watch?v=z10xke7yli4&list=PL54JdsBCvI0mPwzMkzlNnulw3NaxoWzks&index=23
The steps which I followed were exactly the same, still I am getting this issue.

Steps to reproduce:

1. Clone the github repository: https://github.com/developedbysom/cap-animal-adopt.git

2. Run npm install.

3. Run cds add hana --for production

4. Run cds add xsuaa --for production

5. Run cds add workzone (Since we are using managed approuter, this will also create xs-app.json in app/adopter)
6. Run npm install --prefix app/adopter/

7. Run cds add mta 
8. Run mbt build -t gen --mtar mta.tar && cf deploy gen/mta.tar

I have added my xs-app.json,mta.yaml and manifest.json files as txt in the question.
Please look into this and guide me if I am doing anything wrong.

Thanks,

Regards,

Raihan

[MioYasutake · Accepted solution]

@raihan_siddiqui 

Remove the leading slash from the following part of the manifest.json.

"uri": "/odata/v4/adopter/",

Alternatively, you can add the following task in the ui5-deploy.yaml. This task removes the leading slash during the build.

  customTasks:
    - name: webide-extension-task-updateManifestJson
      afterTask: replaceVersion
      configuration:
        appFolder: webapp
        destDir: dist 

[raihan_siddiqui · Accepted solution]

@MioYasutakeThank you for your response. Eventually, after posting this, I came across the below tutorial from SAP

https://developers.sap.com/tutorials/deploy-to-cf..html

Here the steps mentioned helped me change the manifest.json as well as the mta.yaml file.

However, I do have one query. When the application is deployed, I see only 2 applications in my dev space, i.e. the service and the db-deployer.
Usually, we also have an approuter right from where we are able to access even the html5 app and accessing the html 5 app through cockpit leads to auth issue? What do we have to do do make our config that way? Also, is that the standard config which is followed?


Thanks,

Regards,

Raihan