How to define the URL path to UI module app in approuter/html5 repository once deployed to BTP?

[TiagoAlmeida]

Hello all!

On a typical cap node.js project that has UI modules, once the mta.yaml is deployed to BTP, the URL to the UI applications will follow this pattern:

https://some-url-to-the-approuter/<id-of-the-app-without-special-characters>;

This works because the approuter is bound to the html5 repository service and tries to find an app with that id (id-of-the-app-without-special-characters) in the repository. If such an app exists it will use it's xs-app.json and it will serve it's content. This is described here

So for example a UI5/Fiori app that was generated in BAS for namespace "com.company" and with name "purchases" will have an id of "com.company.purchases" and it will, by default, be deployed into HTML5 repository with the id "comcompanypurchases" and so it it will be available at the following URL:

https://some-url-to-the-approuter/comcompanypurchases

My question is: how to change this path, without changing the ID of the app? Is there any setting on the mta.yaml or on the xs-app.json to do this? I ask because you may want your UI app module ID to still be "com.company.purchases" but the app to be available for end users at just https://some-url-to-the-approuter/purchases.

For a specific example, we can use this mta.yaml is here

It's structure works for this example: It contains an approuter and one UI app called HTML5Module.

The UI app has a manifest.json with an ID of mtx-guestbook here so I think when this is deployed to BTP it will be available at the approuter under the path /mtxguestbook. How could we change that path to be something else?

I couldn't find a way to define this.

Thank you for any pointers.

[gregorw]

Please check approuter/xs-app.json#L96:

    {
      "source": "^/html5userapiforcf/(.*)$",
      "target": "/comsapsapmentorshtml5userapiforcfui/$1",
      "service": "html5-apps-repo-rt",
      "authenticationType": "xsuaa"
    },

To redirect to the index.html you would need another section. Haven't tried this yet.

[TiagoAlmeida]

Thank you Gregor 🙂 Yes, this indeed works.

The only downside I see is that the routes on the app's xs-app.json need to be copied into the approuter's xs-app.json as well so it can access it's backend.

I was on the lookout for (maybe) an "alias" parameter when the app is uploaded to the HTML5 apps repo. I'll keep searching.

Thank you again.

Take care