Adding the UI and Approuter Module to the MTA

Add modules to the mta.yaml file.

1. Add the risk-management-approuter and the risk-management-app module for the Approuter to the mta.yaml file:

   Code snippet

   Copy code

   
   # -------------------- SIDECAR MODULE ------------------------
    - name: risk-management-db-deployer
      # ------------------------------------------------------------
      type: hdb
      path: gen/db
      parameters:
        buildpack: nodejs_buildpack
      requires:
        # 'hana' and 'xsuaa' resources extracted from CAP configuration
        - name: risk-management-db
        - name: risk-management-xsuaa
   
    #//### BEGIN OF INSERT
   
    # -------------------- APPROUTER -----------------------------
    - name: risk-management-approuter
      # ------------------------------------------------------------
      type: nodejs
      path: approuter
      requires:
        - name: risk-management-xsuaa
        - name: srv-api
        group: destinations
        properties:
          forwardAuthToken: true
          strictSSL: true
          name: srv-binding
          url: "~{srv-url}"
      build-parameters:
        requires:
          - name: risk-management-app
            artifacts:
            - ./*
            target-path: resources
    # -------------------- UI -----------------------------------
    - name: risk-management-app
      # ------------------------------------------------------------
      type: html5
      path: app
      build-parameters:
        supported-platforms: []
    #//### END OF INSERT

   Copy code

2. Save the file.

   The approuter takes the UI resources of the risk-management-app and puts it in the resources directory. This is where the xs-app.json looks for the files requested for /app/....

   The risk-management-xsuaa binding adds your already existing XSUAA service instance to the approuter. This enables login and log out. The approuter forwards requests with the authentication token (Authorization: Bearer <jwt-token>) to the CAP service. The CAP service then uses the token for authentication and authorization checks.

   The srv-binding creates an environment variable destinations that contains a JSON array with one object containing the destination of the CAP service. This is required to forward requests to the CAP service.

   The generated environment variable looks like this:

   destinations='[{ "name": "srv-binding", "forwardAuthToken": true, "strictSSL": true, url: "https://..." }]

   The URL is taken from the risk-management-srv module that needs to be enhanced to export this information.

Re-build and re-deploy the .mtar file.

1. Build your project with the MTA Build Tool (MBT):

   mbt build -t ./

   Make sure you're in the root folder of your project.

2. Deploy your project to SAP BTP:

   cf deploy risk-management_1.0.0.mtar

   Additional Documentation: How to build an MTA archive from the project sources¹.

3. When the deployment is finished, check the deployment log for a line saying:

   Application "risk-management-approuter" started and available at "<some_URL>"

   Like in the following screenshot:

   

   This is the URL of the Approuter, that, from now on, will take care of all the requests to your application.

4. Copy the URL and open it in a new browser tab. In the background, the approuter authenticates your user and provides it with the authorizations that have been assigned to the user. Open the Risksapplication tile and try to retrieve data by selecting the Go button.

   As your user does not have the required application roles yet, the result should look like the following: