Technical Articles
SAP Build Apps On SAP BTP Kyma Runtime
Welcome!! You are here because you want to explore how to deploy a web application on Kyma runtime, which is built using SAP Build Apps. If you have not completed the previous tutorial which covers the prerequisites, we recommend finishing the same. This blog is also relevant to our developers who are looking to host a web application and want to consume different BTP services in Kyma runtime.
Pre-requisites –
- Complete SAP Build App development referring to the previous blog – Building UI Integration Card
- Setup Kyma on your BTP account – Kyma Setup
- BTP Subaccount access to manage Destinations
- Services entitlements on BTP required in addition to previous blog –
- Download the template project from Github – Repository OR Repository2
Architecture –
SAP BTP Kyma Deployment Steps –
- Unzip the Approuter project which you downloaded earlier, which will modify according to our requirements.
- Replace the content of deployment.yaml as below.
-
apiVersion: services.cloud.sap.com/v1alpha1 kind: ServiceBinding metadata: name: routerauth-binding namespace: YOUR_NAMESPACE spec: serviceInstanceName: garouter-uaa secretName: routerauth-binding externalName: garouter-uaa --- apiVersion: services.cloud.sap.com/v1alpha1 kind: ServiceBinding metadata: name: garouterdestination-binding namespace: YOUR_NAMESPACE spec: serviceInstanceName: destination-service secretName: garouterdestination-binding externalName: destination-service --- apiVersion: apps/v1 kind: Deployment metadata: name: garouter namespace: YOUR_NAMESPACE labels: app: garouter version: v1 spec: replicas: 1 selector: matchLabels: app: garouter version: v1 template: metadata: labels: app: garouter version: v1 spec: containers: - name: garouter image: YOUR_USER/approuterinkyma:latest imagePullPolicy: Always resources: limits: cpu: "250m" memory: "128Mi" requests: cpu: "250m" memory: "128Mi" ports: - containerPort: 5000 volumeMounts: - name: garouter-uaa mountPath: "/etc/secrets/sapcp/xsuaa/garouter-uaa" readOnly: true - name: destination-service mountPath: "/etc/secrets/sapcp/destination/destination-service" readOnly: true volumes: - name: garouter-uaa secret: secretName: routerauth-binding - name: destination-service secret: secretName: garouterdestination-binding --- apiVersion: v1 kind: Service metadata: name: garouter namespace: YOUR_NAMESPACE labels: app: garouter service: garouter spec: ports: - port: 5000 name: http selector: app: garouter --- apiVersion: gateway.kyma-project.io/v1beta1 kind: APIRule metadata: name: garouter namespace: YOUR_NAMESPACE spec: gateway: kyma-gateway.kyma-system.svc.cluster.local host: garouter.CLUSTER_DOMAIN service: name: garouter port: 5000 rules: - accessStrategies: - config: {} handler: allow methods: - GET - POST - PUT - PATCH - DELETE - HEAD path: /.*
-
- In the above deployment file, you have to change the following placeholders
- YOUR_NAMESPACE – Namespace within your Kyma cluster
- CLUSTER_DOMAIN – You can copy the cluster domain as below –
- YOUR _USER – Docker image path
- If you want to refer to your private repository, you can refer to this blog published by Gunter Albrecht and modify the deployment file accordingly.
- Let’s understand 2 important things in this deployment file, which are service bindings to the application. These are very important as the application will require service key credentials to interact with those services and has to be provided with deployment. These credentials will be provided as a secret to the application.
-
- Next, we have to make modify the service.yaml file to create 2 services, Destination service & xsuaa service. Please replace the placeholders YOUR_NAMESPACE & CLUSTER_DOMAIN before you replace the content.
-
apiVersion: services.cloud.sap.com/v1alpha1 kind: ServiceInstance metadata: name: garouter-uaa namespace: YOUR_NAMESPACE spec: serviceOfferingName: xsuaa servicePlanName: application externalName: garouter-uaa parameters: xsappname: xsuaa-garouter tenant-mode: dedicated oauth2-configuration: redirect-uris: - "https://CLUSTER_DOMAIN/login/callback" scopes: - name: "$XSAPPNAME.admin" description: Admin role-templates: - name: admin description: Admin scope-references: - "$XSAPPNAME.admin" role-collections: - name: Approuterkyma description: kyma approuter role role-template-references: - "$XSAPPNAME.admin" --- apiVersion: services.cloud.sap.com/v1alpha1 kind: ServiceInstance metadata: name: destination-service namespace: YOUR_NAMESPACE spec: externalName: destination-service serviceOfferingName: destination servicePlanName: lite
-
- We have to create a destination in the same subaccount where you have already created the Kyma Runtime. This step is only required if you have not created the destination. Copy the name of the destination as-is, which will be needed in our next step.
- Modify the xs-app.json to point to your newly created destination below
-
{ "welcomeFile": "index.html", "authenticationMethod": "route", "logout": { "logoutEndpoint": "/app-logout", "logoutPage": "/" }, "routes": [ { "source": "^/user-api(.*)", "target": "$1", "service": "sap-approuter-userapi", "authenticationType": "xsuaa", "scope": "$XSAPPNAME.admin" }, { "source": "^/destinations/PurchaseRequisition/(.*)$", "target": "$1", "destination": "PurchaseRequisition", "authenticationType": "xsuaa" }, { "source": "^/(.*)", "authenticationType": "xsuaa", "localDir": "resources" } ] }
-
- Unzip and Copy the Web application content into the resources folder directly, which we downloaded in our last section. Your final project structure should be as below
- Let’s create the service instance using the service.yaml file. Please confirm the same in the Kyma cockpit.
-
kubectl apply -f service.yaml
-
- Build the image and Push the application docker hub
-
docker build --rm -f "Dockerfile" -t YOUR_USER/approuterinkyma:latest "." --no-cache --platform=linux/amd64 docker push YOUR_USER/approuterinkyma:latest
-
- The final step is to deploy the application using a deployment.yaml file which will create the application, bind the services instances, and also create an API rule which we can use to access the application over the public internet.
-
kubectl apply -f deployment.yaml
-
Demo –
Now it shows showtime, and we always love to see things working in action 🙂
Conclusion –
It was so easy to deploy a web application built using SAP Build Apps on BTP Kyma runtime. You can use this as a base and extend it to your requirements. Please do let me know your thoughts in the comment section.
Tips & Tricks-
- Destination service returning 404 – Please check the path in xs-app.json
- Destination service returning 401 – Please check the credentials provided in the destination
- A destination with name “XYZ” not present – Please confirm the destination service binding is completed successfully. Cross-check the deployment.yaml file.
References –
- How to use xsuaa by Gopal Anand – Blog
- Understanding xsuaa – Blog
- Consuming destinations on CF – Blog
- SAP Help Documentation on Kyma
- Kyma Project
- XSUAA